学习]网页设计的基础-网页设计制作概述.ppt

一网页、网站的概念
二Web标准
三网站的规划与设计
四网站开发工作流程
五网站策划书撰写要点
六常用网页制作软件
七实训1.1.1网页、网站和主页
网页（WebPage）是存放在Web服务器上供客户端用户浏览的文件，可以在Internet上传输。网页是按照网页文档规范编写的一个或多个文件，这种格式的文件由超文本标记语言创建，能将文字、图片、声音等各种多媒体文件组合在一起，这些文件被保存在特定计算机的特定目录中。几乎所有的网页都包含链接，可以方便地跳转到其他相关网页或是相关网站。
网站由一组相关的HTML文件和其他文件组成，这些文件存储在Web服务器上。当用户访问一个Web站点时，该站点中有一个页面总是被首先打开，该页面称为首页或主页（一般为index.html或default.html）。1.1.2静态网页和动态网页
按照Web服务器的响应方式的不同，可以将Web页分为静态网页和动态网页。
静态网页指客户端的浏览器发送URL请求给WWW服务器，服务器查找需要的超文本文件，不加处理直接下载到客户端，运行在客户端的页面是已经事先做好并存放在服务器中的网页。其页面的内容使用的仅仅是标准的HTML代码，静态网页通常由纯粹的HTML/CSS语言编写。

1.1.2静态网页和动态网页
按照Web服务器的响应方式的不同，可以将Web页分为静态网页和动态网页。
静态网页指客户端的浏览器发送URL请求给Web服务器，服务器查找需要的超文本文件，不加处理直接下载到客户端，运行在客户端的页面是已经事先做好并存放在服务器中的网页。

1.1.2静态网页和动态网页
动态网页是指必须经过应用程序服务器处理后才能交给Web服务器送到客户端进行显示的网页文件。这类网页根据所采用的应用程序服务器不一样，其文件名的扩展名也不一样。可以是hph，jsp，asp等等。
动态网页技术根据程序运行的区域不同，分为客户端动态技术与服务器端动态技术。
客户端动态技术不需要与服务器进行交互，实现动态功能的代码往往采用脚本语言形式直接嵌入到网页中。服务器发送给浏览者后，网页在客户端浏览器上直接响应用户的动作。常见的客户端动态技术包括JavaScript、ActiveX和Flash等。

1.2.1Web标准的概念
WEB标准不是某一个标准，而是一系列标准的集合。
网页主要由三部分组成：
结构（Structure）
结构标准语言有：XML、XHTML
表现（Presentation）
表现标准语言有：CSS
行为（Behavior）
行为标准语言有：DOM、ECMAScript
1.2.2建立Web标准的目的
简单地说，建立Web标准的目的是：
提供最大利益给最多的网站用户；
确保任何网站文档都能够长期有效；
简化代码，降低建设成本；
让网站更容易使用，能适应更多不同用户和更多网络设备；
当浏览器版本更新或者出现新的网络交互设备时，确保所有应用能够继续正确执行。1.2.3采用Web标准的优点
1．客户端的优点
文件下载与页面显示速度更快；
内容能被更多的用户所访问（包括失明、弱视、色盲等残障人士）；
内容能被更广泛的设备所访问（包括屏幕阅读机、手持设备、搜素机器人等）；
用户能够根据样式选择定制自己的表现界面；
所有页面都能提供适于打印的版本。1.2.3采用Web标准的优点
2．服务器端的优点
更少的代码和组件，容易维护；
带宽要求降低（代码更简洁），成本降低；
更容易被搜寻引擎搜索到；
改版方便；
提供打印版本不需要复制内容。在建设网站之前，需要对网站进行一系列的分析和设计，然后根据分析的结果提出合理的建设方案，这就是网站的规划与设计。
网站的规划与设计一般应遵循以下三个原则：
最大限度地满足用户需要；
最有效地进行资源利用；
使用方便，界面友好，运行高效；
常规的规划与设计方法一般有以下三种：自顶向下、自底向上、不断增补的设计方法。典型的Web开发工作流程包括以下几个阶段。
1）规划站点：包括确立站点的策略或目标、确定所面向的用户以及站点的数据需求。
2）设置开发环境：包括选择Web应用程序服务器、利用Dreamweaver网页制作软件定义站点及数据源。
3）规划页面设计和布局：包括用绘画工具创建页面和界面模型，以及使用Dreamweaver、FrontPage布置页面。
4）创建内容资源：包括使用Fireworks、Photoshop和Flash创建图像、视频等。
5）组合、测试和部署站点：包括使用Dreamweaver设置文本格式、编译资源，测试代码将站点发布到服务器上。
6）维护站点：包括使用Dreamweaver保持内容的更新。补充案例：暨南大学网站结构
网站策划书应该尽可能地涵盖网站规划中的各个方面，写作要科学、认真、实事求是。以最常见的企业网站为例，介绍网