网页设计与制作第1章概述解析.ppt

第1章 概述 学习要求 本章重点 学习网站制作必备的网站和网页制作基础知识 网页编辑工具和动画制作工具的特征 网站制作的流程。 主要内容  1.1 网络的基础知识 1.2 网站制作的基础知识 1.3 网页制作的常用工具 1.4 网站的制作流程 1.1 网络的基础知识 1.因特网Internet 因特网Internet是目前全球最大的计算机通信网，它通过电话线、光纤传输材料，使用一定的通信规范，把位于世界各地具有独立工作能力的计算机连接起来，使之能够实现网络通信、资源共享。 2.全球信息网WWW 全球信息网WWW(World Wide Web)是一个大型的、分布式的、全球性的、交互的、动态的、跨平台的超媒体图形信息系统，是Internet中最流行、最主要的信息服务方式，用户通过Internet能够浏览、查询和共享WWW 服务器站点上所有的超媒体信息。 3.网页 网页是WWW的基本文档，是在网络上用来同其他用户交流信息的最基本的组成部分。网页界面的构成元素主 主要内容 1.1 网络的基础知识 1.2 网站制作的基础知识 1.3 网页制作的常用工具 1.4 网站的制作流程 1.2 网站制作的基本知识 1.超文本 超文本（HyperText）就是指文档中设置了超链接的文本，它所链接对象也是纯文本，使用了超链接的文字带有下划线，当鼠标移至其下方时，鼠标指针会变成手形，单击已定义好超链接的关键字，便可显示与其相关的说明文字。 2.超媒体 超媒体（HyperMedia）是超文本的一种扩展，它将所链接信息类型扩展到了全新视角的多媒体，综合了文字、影像、图片、动画、声音等文件。使得超链接可以显示图形，播放动画、音乐，也可以播放视频信息。 3. 超链接 超链接（hyperlink）用来实现不同网页间的相互 的、经过无损压缩的、支持动画的、常用于网络传输的一种图形文件格式。它仅支持8位图像色彩的索引颜色，适合于对色彩数目要求不高的卡通图像等。在一些商业网站上它的显示受到一定的限制。 PNG格式的图像，能存储32位信息的位图文件，其图像质量要比GIF格式图像的质量好，通过对像素行和列的扫描，获得较好的压缩效果。显示速度很快，但不支持动画。它支持位图颜色、RGB、索引颜色和灰度模式，但不支持带Alpha通道的位图颜色和索引颜色文件。 JPG/JPEG格式的图像又称作联合图片专家，是24位的图像文件格式，也是一种高效率的压缩格式，可以将图像体积减少至原大小的10％，从而减少下载时间。它支持CMYK、RGB和灰度颜色模式，但不支持Alpha通道。此格式的图像在打开时会自动解压缩，它适合于存储照片之类的色彩丰富的图像。 主要内容 1.1 网络的基础知识 1.2 网站制作的基础知识 1.3 网页制作的常用工具 1.4 网站的制作流程 1.3 网页制作的常用工具 HTML代码，且冗余代码相对较少。 Web图像与动画制作工具 1.Photoshop Photoshop是Adobe公司推出的功能强大的文本图像处理软件，采用专业的图像编辑标准，采用层、通道、路径、滤镜和蒙板等图像处理技术，得到让广大平面设计人员十分青睐的设计效果。它支持大部分的图像格式，适用于打印、图像修复、Web浏览或其它用途的较佳品质的图像。 2.Flash Flash是Macromedia公司推出的一款动画设计与编辑软件,利用它制作的动画文件只需几K字节就可以实现许多令人心动的效果，用在网页设计上不仅可以使网页更加生动，而且体积小下载速度快。 主要内容 1.1 网络的基础知识 1.2 网站制作的基础知识 1.3 网页制作的常用工具 1.4 网站的制作流程 1.4 网站制作的流程 栏目划分等。好的网站架构不仅能使网站的界面友好漂亮、简洁明快，而且还能方便浏览，增强可读性。 网站架构设计的结果要用草图勾勒出来，并且要尽量具体，栏目划分要合理，重点要突出。 这一阶段的最后一步工作是素材的准备，主要包括图标、LOGO、广告语和内容介绍等的搜集工作。 网站的制作 站点规划完成后，就进入了具体的网站制作阶段，在这一阶段主要是对具体的网页及其特效进行设计与制作，主要任务有界面的设计与制作、界面的切割与导出、模板的建立和具体网页的设计等。 可以用Photoshop或Fireworks对网站界面进行设计与制作，但Fireworks 要比Photoshop更加灵活自由，更加专业。设计过程中要注意尽量使用不