网页设计课程教学大纲

1、网页设计课程教学大纲 一、课程说明： 课程类别：选修课 适用专业：工商管理、电子商务专业、信息管理与信息系统专业和计算机相关专业、艺术设计 专业等。 计划学时： 60 学时（讲课 24学时，上机实验 36 学时） 学分： 4 先修课程：计算机基础 执笔： 审阅： 二、课程的教学目的 以培养应用型人才为目标，充分考虑远程教育学生的学习基础和学习特点。 简单介绍HTML语言、 CSS样式、javascript 语言，全面介绍与网页设计制作有关的知识，通过对 Web页制作技术和制作 工具的学习，使学生对于网页设计中所涉及的相关知识有一个全面的了解。并使学生具有解决一般 网页制作问题的能力。掌握运用D

2、reamweaver CS6网页制作软件制作网页的方法，掌握运用Fireworks CS6、 photoshop cs6 图像处理软件进行网页中图形制作版式设计及切片的应用。 掌握运用 flash CS6 动画制作软件设计网页中动画的方法，进而掌握将这四个软件互相配合，完成网页设计与制作任务 的方法。为今后从事网页设计与制作工作打下基础。 三、课程教学基本要求： 1、 课程重点 掌握网页制作三剑客 Dreamweaver、Fireworks 、flash 及 photoshop 在网页设计过程中的应用，使 学生具备网站策划、网页设计与制作、效果图设计与制作等方面的技能，提高学生分析解决问题能

3、力和项目实施能力，注重学生在学习和实践过程中职业素质的养成。通过学习，使学生熟练掌握运 用 Dreamweaver 网页制作软件制作网页，掌握运用 Fireworks 、Photoshop 图形图像处理软件进行网 页中图形图像的设计与制作，掌握运用 flash 动画制作软件设计网页中动画的方法。 2、 课程难点 （1） 理解HTML语言各种文本格式、字符格式、段落设置、列表、标记的作用； （2） 理解CSS样式表中属性单位的作用和意义； （ 3）理解 javascript 语言脚本程序的工作方式； （ 4）深入理解超级链接、图形图像各种功能和应用； （5）深入理解表格、AP Div、框架、表单

4、的作用； （ 6）深入理解模板、库、行为和脚本的高级应用； （7）理解网站测试的目的和测试方法； （ 8）深入理解“切片”和“热点”的涵义和应用； （9）深入理解动画的组成“时间轴” 、“场景”、“帧”的涵义及各种动画的制作； （ 10）理解使用图像设计软件进行版式设计的方法。 3、 能力培养要求 (1) 了解HTML语言的基本内涵。理解基本标记的用法； (2) 掌握在网页中添加 CSS样式的方法。熟练使用 CSS设置网页格式和列表的格式； ( 3)熟练掌握网页中文本的输入、特殊字符的插入及字符格式的设置方法； ( 4)掌握在网页中嵌入图象和多媒体的方法； (5)熟练掌握使用绝对和相对 URL

5、创建文本超链接，图象热点的方法； ( 6)熟练掌握使用表格、框架、 AP Div 布局页面的方法； ( 7)掌握创建表单的方法； ( 8)掌握模板的创建和库项目的使用方法； ( 9)理解行为和脚本的用法； ( 10)掌握 FireworksCS6 基本操作及其在网页制作中的应用； (11)掌握 FlashCS6 基本操作及简单动画的制作； ( 12)掌握 PhotoshopCS6 基本操作及在网页设计中的应用； 四、课程教学内容与学时： 理论教学内容： 第 1 章 网页设计与制作概述 1.1 网络的基础知识 掌握：TCP/IP协议、IP地址、域名地址、统一资源定位器的概念和内涵 1.2 图形图

6、像的基础知识 理解：位图与矢量图的概念 了解：常用的图形、图像格式 1.3 网页的布局知识 了解：网页的基本结构及页面的布局原则和模式 理解：网页的色彩应用及色彩属性与象征意义 1.5 HTML 基础 理解： HTML 基础标记符的内涵，如文本格式标记、超链接标记符、图像标记符、表格标记符、 框架标记符、表单标记符、滚动条 了解：CSS技术的内涵，能够识别基本属性，如：字体属性、列表样式属性 理解： CSS 的定义及使用方法 了解： JavaScript 技术及 JavaScript 脚本嵌入 HTML 文档的方法 第 2 章 DreamweaverCS6 网页设计基础 2.1 Dreamwe

7、aver 的工作环境 理解： Dreamweaver 的工作区菜单、面板、属性检查器的使用 2.2 构建 Dreamweaver 站点 掌握：如何创建、管理本地站点及站点中文件 2.3 网页文本编辑 掌握：正文文本的添加和格式的设置、插入空格、特殊字符 理解：页面属性的设置 2.4 CSS 样式设置 重点掌握：如何创建 CSS规则、链接样式表 2.6 Dreamweaver 工作环境的设置 了解：环境设置的方法 第 3 章 图像与多媒体 3.1 图像的应用 掌握：如何在网页中插入图像及设置图像属性 3.2 创建鼠标经过图像 掌握：如何在网页中创建鼠标经过图像及设置图像属性 3.3图像占位符及属

8、性的设置 理解：图像占位符的含义 3.4 插入 flash 动画 掌握：如何在网页中插入 flash 动画及设置动画属性 3.5 音频的应用 了解：音频文件格式 掌握：如何在网页中添加音频 3.6 视频的应用 掌握：网页中视频的应用及属性的设置 第 4 章 超级链接及其应用 4.1超链接概述 理解：绝对路径和相对路径的含义及超链接的内涵 4.2 创建文本超链接 掌握：各种创建文本超链接的方法 4.3 创建图像超链接 掌握：创建图像热点链接的方法 4.4 创建电子邮件链接 掌握：创建电子邮件链接的方法 4.5 空链接 理解：创建空链接的意义 第 5 章 网页的布局 5.1 表格的应用 掌握：插入

9、表格的方法 5.2 表格编辑及属性设置 掌握：表格、单元格、行或列的编辑及属性的设置方法 5.3应用 AP Div 布局页面 掌握：使用 AP Div 布局页面 5.4AP Div 与表格的相互转换 理解： APDiv 转换与表格的互相转化方法 5.5 框架的应用 理解：创建框架集及设置框架集属性 掌握：如何设置框架中显示的网页及框架的编辑 第 6 章 表单的应用 6.1 创建表单 理解：表单的概念 6.2 添加表单对象 掌握： 如何添加表单对象， 如：插入文本域、 插入单选按钮 /单选按钮组、 插入复选框 /复选框组、 插入选择框（列表 /菜单）、插入文件域、插入按钮 6.3 表单的提交 掌

10、握：表单的提交设置 6.4 应用表格布局表单实例 掌握：应用表格布局表单的方法 第 7 章 行为与脚本语言及模板和库的应用 7.1 行为在网页中的应用 理解：行为、事件、动作 掌握：如何添加行为、事件 7.2 JavaScript 脚本 理解： JavaScript 脚本概述、 JavaScript 脚本语言特效 掌握： JavaScript 脚本在网页中的应用 7.3 创建与应用模板 理解：创建模板的意义 掌握：如何创建和使用模板创建新网页及模板的编辑 7.4 创建与应用库项目 理解：创建库的意义 掌握：如何创建、在网页应用库项目及库的编辑 第 8 章 站点的测试 8.1 站点的测试 了解：

11、站点的测试方法，如：检查浏览器兼容性、链接的检查与修正、不同分辨率下的测试等 8.2 创建远程站点 了解：如何设置远程服务器、连接远程站点 8.3 文件的上传和下载 了解：文件的上传、下载文件、文件的取出与存回的操作方法 第 9 章 FireworksCS6 基础及其在网页制作中的应用 9.1 FireworksCS6 基础 了解：认识 FireworksCS6 工作区、文档管理、布局工具、各种面板、常用工具 9.2 绘制并编辑矢量图形 掌握：绘制与编辑基本形状、自动形状、自由变形形状、复合形状的基本操作方法 9.3 创建并修饰位图图像 理解：创建与编辑位图图像的方法 9.4 创建并编辑文本

12、掌握：创建与编辑文本的方法 9.5 应用笔触和填充 掌握：应用和更改笔触、填充、样式 9.6 应用动态滤镜 理解：动态滤镜 9.7 使用切片和热点 掌握：切片和热点的基本操作和导出设置 第 10 章 FlashCS6 基本操作及在网页制作中的应用 10.1 FlashCS6 的基本操作 理解： FlashCS6 的工作界面、文档的创建、打开、保存及面板组的使用 10.2 时间轴的使用 掌握：图层、帧、播放头、场景的概念和含义 10.3 元件、实例和库资源 掌握：元件的创建方法、实例概念、库面板以及元件与实例的关系 10.4创建各种动画 掌握：遮罩层动画、弓I导层动画、形状补间动画、逐帧动画的创

13、建方法和内涵 10.5在动画中添加声音 掌握：在动画中添加声音及编辑方法 10.6文本的使用 掌握：传统文本字段在动画中的应用 10.7动作面板的使用 了解：动作面板的使用及动作脚本的基本元素 10.8 ActionScript 基本语句 了解：时间轴控制命令、浏览器 /网络命令的使用方法 10.9动作的应用 了解：在动画中使用动作控制动画的原理 10.10测试发布Flash动画 理解：制作过程中动画的测试方法 掌握：如何发布影片 第11章PhotoshopCS6基本操作及在网页设计中的应用 11.1 PhotoshopCS6 基本操作 了解：PhotoshopCS6的工作界面、文件操作、环境

14、设置、基本概念 理解：选区的创建与编辑 掌握：利用画笔类工具绘制图像、利用形状绘制工具绘制图像、图像修饰工具的应用、调色命 令的高级应用 理解：图层样式、文字图层、滤镜的应用 11.2页面设计与制作 掌握：整体页面、导航栏、网页内容板块、网页页脚的制作和设计方法 第12章网页制作工具集成及网页制作综合实训 12.1 Fireworks 与 Dreamweaver 的集成 理解：Fireworks与Dreamweaver两者如何协同工作 12.2 使用 Photoshop 和 Dreamweaver 了解：Dreamweaver中处理Photoshop文件的工作流程 12.3 Dreamweav

15、er 与 Flash 的集成 理解：Flash与Dreamweaver两者如何协同工作 理论教学学时分配表（54课时） 早节 课时 第1章网页设计与制作概述 8 第2章 DreamweaverCS6网页设计基础 4 第3章图像与多媒体 2 第4章超级链接及其应用 2 第5章网页的布局 4 第6章表单的应用 2 第7章 行为与脚本语言及模板和库的应用 6 第8章站点的测试 2 第9章 FireworksCS6基础及其在网页制作中的应用 8 第10章FlashCS6基本操作及在网页制作中的应用 8 第11章PhotoshopCS6基本操作及在网页设计中的应用 8 第12章网页制作工具集成及网页制作

16、综合实训 2 实践教学内容：36学时 （本部分内容为学生上机自学内容、以每章习题中的实践题为实践内容） 实践目的与任务： 目的是让学生提高自己的实际动手能力，熟练掌握当前的流行网页制作工具，具备设计并且实 现一个网站的能力。 基本要求： 要求学生掌握网页基础语言 HTML语言 Dreamweaver CS6建设网站和编辑网页的技术 Fireworks CS6进行图片特效处理及切片的技术 实践学时分配表 内容 课时 网贝设计与制作概述 4 DreamweaverCS6在网页设计中的应用 10 FireworksCS6基础及其在网页制作中的应用 8 FlashCS6基本操作及在网页制作中的应用 8 PhotoshopCS6基本操作及在网页设计中的应用 6 实践方法 通过模拟教材实例的方法掌握工具的基本用法，再试着改变一些设计内容和参数来设计自己喜 欢或需要的例子，最终完