Dreamweaver-Flash-Fireworks网页制作培训教程第1课.pptVIP

第1课 初步认识Fireworks 本课要点 具体要求 本课导读 上机练习 本课要点 网页制作基础 了解Fireworks的工作环境 设置图像文档环境 具体要求 了解网站建设流程 熟悉浮动面板的使用 掌握画布的设置 本课导读 Fireworks是专门为网页设计而开发的软件，它综合了矢量、位图及网页功能，编辑功能十分强大。本课主要介绍了网页的基础知识、Fireworks的工作环境及画布的设置。 1.1 网页制作基础 在学习制作网页前，了解网络术语、网页设计制作的工具、制作流程、网页基本元素及Fireworks的环境设置是非常必要的。 1.1 网页制作基础 1.1.1 知识讲解 1.1.2 典型案例——建立“浪度沙发”网站 1.1.1 知识讲解 下面我们来了解一些网页专业术语、网页设计工具、制作流程和网页基本元素。 1.1.1 知识讲解 1. 网页专业术语 2. 网页设计工具 3. 网页制作流程 4. 网页基本元素 1. 网页专业术语 制作网页过程中会遇到如下专业术语。 域名：即一个网站的网址，如，该网址中的163.net就是域名。域名在互联网上具有唯一性。 1. 网页专业术语 站点：它是方便网页设计人员在制作网站时调用的网页元素，将网站页面中用到的内容放置于一个文件夹中来管理。一个网站可以包含一个站点，也可以包含若干个站点。小型网站一般用一个站点，而新浪、网易等大型综合网站则用多个站点来进行分类管理。 1. 网页专业术语 形象页：它是网站的欢迎页面，用于提高企业形象，宣传企业理念。在设计时，可引入企业名称、LOGO、形象图片、宣传语、网址、首页超链接等。 1. 网页专业术语 首页：指一个网站的主索引页，是访问者了解网站概况并引导其阅读站内重点内容的向导；设计时要在保证网站风格的前提下，根据多数人的阅读习惯以色彩、线条、图片等元素将导航条、功能区、内容区进行分隔，其页面色彩要和谐统一。 1. 网页专业术语 超链接：当鼠标指针移动到某个对象上时，鼠标指针变为 形状，所指的对象就是超链接，它可使访问者跳转到另一个页面进行浏览。 FTP：即网络文件传输协议，它具有断点续传功能，常用于网站内容的上传与下载。 2. 网页设计工具 从专业的网页设计角度来说，网页设计主要会用到设计效果、动画设计和网页布局3方面的软件。 设计效果软件：包括Fireworks和Photoshop等。Fireworks是针对网页设计而开发的专业软件，可以对位图、矢量和网页元素进行编辑；Photoshop是专业位图处理程序，也常用于网页界面的设计，但在网页制作方面的功能较弱。 2. 网页设计工具 动画设计软件：目前主要是Flash，还有一些小型动画设计软件，如SWiSH和Cool3D等。 网页布局软件：目前使用最普遍的是Dreamweaver，也可使用FrontPage。 3. 网页制作流程 网页从设计到布局完成一般需要经过以下几个步骤： （1）根据收集的资料，整理出一个结构图，将它作为页面的基本结构。 （2）提取整理数据中的重要内容，作为主页内容，并应用设计软件设计出主页效果图，用切片输出。 3. 网页制作流程 （3）在Flash中完成需要制作的动画。 （4）将步骤（2）中切片的图像及已有的文字资料在布局软件中制作出与拓扑结构图相同的页面结构。 （5）根据主页效果，完成内页的制作。 （6）测试站点并上传到指定的域名空间。 4. 网页基本元素 成功的网页必须具备以下几个元素。 文字：它是网站内容的体现。 图片：用于形象地说明网站的目的和内容。 导航：它是畅游网站的向导。 动画：用于增加页面的动感。 超链接：用于跳转到其他页面。导航也是一种超链接。 1.1.2 典型案例——建立“浪度沙发”网站 案例目标 本案例通过为“浪度沙发”制作网站来讲解网页制作的流程及所用到的基本元素，制作出的效果如下图所示。 1.1.2 典型案例——建立“浪度沙发”网站 操作思路： （1）收集资料，制作出结构图。 （2）根据结构图制作网站页面。 （3）用Flash制作动画效果。 （4）用Dreamweaver整合制作完毕的元素，并将其保存为网页。 操作步骤请老师参照软件讲解 1.1.2 典型案例——建立“浪度沙发”网站 案例小结 本案例制作“浪度沙发”网站的主要目的是使用户了解制作网站的一般流程，为接下来的学习打好基础。 1.2 了解Fireworks的工作环境 Fireworks在网页设计中主要用于设计图标和界面效果，制作简单的动画和按钮等。它可以处理位图和矢量图。 1.2 了解Fireworks的工