网页设计与制作大纲.doc

网页设计与制作应用教程教学大纲第1部分 课程简介一、基本信息 课程名称：网页设计与制作应用教程 课程代码： 总学时： 学分：课程类别：专业课 适用专业：高级网络工程师专业、电脑美术设计师专业、电子商务、信息管理等专业。 相关课程及关系：相关课程为Office办公自动化、Photoshop图像处理、网络基础程序开发基础等，利用Dreamweaver、flash、Photoshop等工具实现网站的前端开发。 二、 教学目标与特色 通过本课程的学习使学生比较系统地理解网页设计与制作的理论知识和应用实践操作，使学生在掌握网页设计与制作整体理论框架的同时，结合电子商务系统网站的应用分析，具备基本的电子商务系统网站建设的实践操作能力。三、主要的实践环节 本课程采用理论讲授与上机实践相结合的教学模式，讲授与上机交叉进行；在上机实训中完成课堂作业和理解消化课堂中讲解知识要点，从而将理论知识与实践技能相结合，提高综合应用能力和创新技巧。 四、必要的教学条件（教室、实验实训基地、器材、教具等） 多媒体教室、计算机机房、Dreamweaver、flash、Photoshop。 五、学习方法要点及学习效果评价原则 通过课堂教学、上机练习、单元测试和综合实训的表现反映相应的学习效果。第2部分 学时分配表 主题内容（2级结构） 课内学时 上机学时 备注 1. 网页设计基础1.1部分网站案例欣赏1.2网页中的常用术语1.3网页设计的相关知识1.4动态网站与静态网站的区别1.5网站前端开发总体介绍2. 初始Dreamweaver82.1 Dreamweaver8的介绍2.2 Dreamweaver8的基本操作2.3 Dreamweaver8文字排版实例2.4 站点的建立 2.5 站点的管理和编辑 3. html语言的学习3.1什么是html语言3.2 基本控制结构3.3 html语言的常用标签3.4 简单的实例分析阶段测试 4. 插入文本、图片、动画4.1插入文本4.2插入图片4.3插入动画和视频4.4简单的实例分析5.超链接5.1超链接的概念5.2创建文本链接5.3创建图像链接 5.4创建热区链接6. 表格的使用6.1表格的创建与编辑6.2格式化表格6.3导入表格数据和表格排序 6.4 利用表格布局网页7. 表单7.1创建表单7.2向表单中添加对象7.3表单属性设置与表单处理7.4表单制作实例阶段测试 8. 框架与层的应用8.1创建层，设置层属性8.2创建框架，设置框架属性8.3框架的拆分与删除 8.4 框架和层的制作实例9. CSS样式9.1 CSS样式简介9.2 CSS样式的创建与编辑9.3 CSS样式应用实例10. Div+css布局10.1 关于web标准的介绍10.2 Div+css布局基础10.3 Div+css布局流程及规则10.4 Div+css布局实例讲解阶段测试11. 行为的使用11.1行为简介11.2行为面板 11.3行为的编辑 11.4 行为的应用12. 用Flash设计网络动画10.1 Flash基础知识 10.2工具箱的使用和图形处理10.3场景和时间轴 10.4 元件和库 10.5 动画制作 10.6影片后期测试和调整13. JavaScript语言基础以及特效的应用13.1 JavaScript语言概述13.2 JavaScript语言基础13.3 JavaScript事件处理13.4 JavaScript基于对象编程13.5 文档对象模型13.6 String、Math、Array等数据对象13.7 Window及相关顶级对象13.8 Document对象14. 网站的上传与维护14.1 域名空间的申请14.2 上传软件的介绍14.3 测试和维护网站15. asp、php的环境配置以及数据库的简单讲解15.1 IIS的介绍和安装15.2 WAMP的介绍和安装15.3 Access和Sqlserver的介绍和安装学时合计 第3部分 教学大纲文本 第一章 网页设计基础 内容提要了解网站与网页的关系，能够利用因特网进行信息游览用素材收集；了解什么是动态网页和静态网页，以及网页的一些基本知识，制作网页所用的软件以及制作网页的流程等 教学目标1. 了解网页的基本构成元素2. 了解网页中的常用术语 3. 正确的区别动态网页和静态网页 4. 了解网页前端开发整个知识结构 重点难点能够正确的区别动态网页和静态网页的区别，了解网页前端开发的知识结构 1.1部分网站案例欣赏通过网站欣赏对网页的整理结构和构成元素有一定的了解1.2网页中的常用术语只有掌握专业术语的含义，才能在制作网页时灵活应用它们1.3网页设计的相关知识对网页的组成、分类、规划、常用工具的了解1.4动态网站与静态网站的区别能轻松的区别动态网页和静态网页1.5网站前端开发总体介绍对整个学期所学习内容的一个大概了解，树立目标和信心。第二章 初始Dreamweaver8内容提要本章主要介绍了Dreamweaver8软件和站点的建立和编辑。 教学目标1.熟练使用Dreamweaver8软件。 2.了解Dreamweaver8软件的基本功能。 3.掌握站点的建立方法。 4.管理和编辑站点。 重点难点掌握Dreamweaver8软件并利用软件建立网站站点。 2.1 Dreamweaver8的介绍对Dreamweaver8软件有个基本性的了解2.2 Dreamweaver8的基本操作熟练使用Dreamweaver8软件进行网页制作2.3 Dreamweaver8文字排版实例通过实例加深对Dreamweaver8软件的使用2.4 站点的建立 掌握站点的建立方法2.5 站点的管理和编辑对所建的站点进行编辑和管理第三章 html语言的学习 内容提要本章详细介绍了html语言基础。 教学目标1.掌握基本的html语法结构。 2.掌握常用的html标记的使用。 3.利用html语言设置文本格式、列表格式、使用图像、使用超链接。 重点难点html语言的语法结构和常用标签的应用 3.1什么是html语言了解概念，熟悉书写规范3.2 基本控制结构掌握Html语言的基本控制结构，熟悉每部分的含义3.3 html语言的常用标签掌握html语言的常用标签并能熟练使用标签制作网页3.4 简单的实例分析对html语言的综合应用，加深理解第四章 插入文本、图片、动画内容提要本章重点介绍网页中文本、图片以及动画视频的插入方法和应用 教学目标1.掌握插入文字、特殊字符、水平线、背景音乐以及日期到网页中的方法和页面属性的设置 2.掌握插入图片到网页中的方法以及图片的格式和来源。 3.掌握插入动画和视频到网页中的方法和如何设置透明flash。 重点难点掌握在网页中使用文本与图像的方法及它们属性的设置，如何制作一个图文并茂的网页。 4.1插入文本向网页中添加文本，特殊字符，水平线，背景音乐，日期以及灵活的设置页面属性4.2插入图片了解图片的格式及来源，掌握向网页中插入图片4.3插入动画和视频了解动画的来源，掌握向网页中插入动画及视频的方法，如何设置透明动画。4.4简单的实例分析将本章的知识综合应用，加深理解第五章 超链接 内容提要本章重点介绍相对路径以及绝对路径的概念，创建各种连接的方法 教学目标1.了解超链接的概念。 2.掌握相对路径和绝对路径的概念。 3.掌握创建各种链接的方法。 重点难点路径的概念以及各种超链接的创建方法。 5.1超链接的概念了解超链接的概念及超链接的组成（源端点和目标端点）5.2创建文本链接掌握如何创建文本链接、局部链接、电子邮件链接、下载链接。5.3创建图像链接掌握如何创建图像链接。 5.4创建热区链接掌握如何创建热区链接第六章 表格的使用内容提要本章重点介绍利用表格精确地定位文本、图像及其他网页元素对网页进行整体布局。 教学目标1.了解表格的应用实例 2.掌握表格的创建与编辑。3.掌握格式化表格4.掌握导入表格数据，表格的排序。 5.掌握利用表格布局网页。 重点难点掌握利用表格进行网页的整体布局。 6.1表格的创建与编辑掌握表格的创建、在表格中添加内容、表格及单元格属性的设置等。6.2格式化表格掌握Dreamweaver8内置的格式化表格库6.3导入表格数据和表格排序掌握导入导出表格数据及表格的排序 6.4 利用表格布局网页掌握利用表格对整个网页进行综合布局第七章 表单内容摘要本章重点介绍了网页交互的最基本元素表单，使用表单可以在网页上制作留言簿、网站中的注册、聊天室、在线调查、在线考试等页面的制作，是Internet用户同服务器进行信息交流的主要工具。 教学目标1.掌握表单的创建。 2.掌握向表单中添加对象。 3.了解表单域。 4.掌握表单工具栏中各表单对象的作用和添加的方法。5.掌握表单属性的设置及表单处理 重点难点掌握表单对象的作用及添加的方法，熟悉表单属性的设置及表单处理。 7.1创建表单了解表单的概念，创建方法及作用7.2向表单中添加对象掌握表单对象的添加方法及与其他网页元素的结合使用7.3表单属性设置与表单处理了解表单的属性设置方法和进行交互的操作7.4表单制作实例通过实例对表单的综合应用进行讲解第八章 框架与层的应用内容摘要本章介绍如何用框架和层布局页面 教学目标1.了解用框架布局页面。 2.了解框架和框架集的创建方法。 3.了解框架和框架集的属性设置。 4.了解框架内的链接设置。 5.掌握层的使用及层与表格的相互转换。6. 掌握用框架和层布局网页 重点难点利用层及框架的基本属性和创建方法对网页进行布局。 8.1创建层，设置层属性掌握层的创建方法，层的嵌套使用，熟悉层的属性以及层面板的作用8.2创建框架，设置框架属性了解框架的创建方法，设置框架及框架集的属性，如何保存框架以及框架的链接设置8.3框架的拆分与删除 了解框架的拆分和删除方法以及含义 8.4 框架和层的制作实例通过实例加深对框架和层的深入理解。第九章 CSS样式内容摘要本章主要介绍了css样式表的创建与编辑，并通过实例重点学习css样式的应用。 教学目标1.掌握css样式简介。2.掌握css样式的创建与编辑。3.掌握如何应用css样式。重点难点创建新的文件并直接绘制所需要的图形，调用其它格式的文件。将文件保存，也可以将文件导出为其它格式。 9.1 CSS样式简介掌握css样式的概念，css样式面板的作用 9.2 CSS样式的创建与编辑掌握新建css样式，编辑css样式，并对css样式中的8种类型进行深入理解9.3 CSS样式应用实例掌握css样式的应用方法以及应用实例第十章 Div+css布局内容摘要本章主要介绍了WEB标准中典型的应用模式“css+div布局”。 教学目标1.了解web标准。2.掌握div+css的布局流程和规则。3.能够利用div+css布局网页。4.掌握div+css布局技巧重点难点熟练使用div+css对整体网站页面进行布局，而且所设计的页面符合web标准。 10.1 关于web标准的介绍了解web标准知识，将传统和符合标准的制作流程做比较。10.2 Div+css布局基础掌握div+css布局中的常用属性词以及各种选择器之间的关系，以及选择器的正规命名。10.3 Div+css的盒子模型、定位、以及浮动掌握div+css的盒子模型的排列和定位以及盒子的浮动。10.4 Div+css布局实例讲解通过实例加深对div+css布局的理解和应用。以及布局网页的速度。第十一章 行为的使用内容摘要本章主要介绍了使用行为可以在网页中实现简单的交互效果，从行为的概念开始介绍行为面板、行为的编辑以及行为的应用等。 教学目标1.了解行为的概念。2.掌握行为面板，行为的编辑。3.掌握行为的使用。重点难点理解行为面板的使用与编辑以及行为给网页带来的效果。 11.1行为简介掌握行为的概念，以及行为组成。11.2行为面板 掌握行为面板的相关设置和认识，熟悉网页中的常用行为11.3行为的编辑掌握怎样添加、删除、修改行为的方法 11.4 行为的应用使用行为可以使网页产生各种交互效果第十二章 用Flash设计网络动画内容摘要通过本章的学习，掌握Flash基本动画的制作，熟练的制作网络动画。 教学目标1.会用FLASH工具绘制矢量图。 2.会对图片进行加工与处理。 3.会制作逐帧动画、形状渐变动画、运动渐变动画。 4.会制作与使用按钮。重点难点理解行为面板的使用与编辑以及行为给网页带来的效果。 12.1 Flash基础知识 Flash8简介，flash8窗口的基本介绍，flash8的基本操作 12.2工具箱的使用和图形处理矢量图形和位图图形，工具箱，图形控制12.3场景和时间轴 场景的创建和编辑，时间轴，图层的应用，帧的应用 12.4 元件和库元件和实例，库 12.5 动画制作逐帧动画，渐变动画，添加声音 12.6影片后期测试和调整播放影片控制，发布影片，输出动画第十三章 JavaScript语言基础以及特效的应用内容摘要本章主要介绍了JavaScript语言的一些基本语法，运算符，程序的流程控制，函数和对象以及数组等内容。 教学目标1.了解JavaScript的概念以及应用领域。2.掌握JavaScript语言基础和简单的事件处理。3.掌握JavaScript语言的常用数据对象。4.了解文档对象模型和document对象重点难点理解行为面板的使用与编辑以及行为给网页带来的效果。 13.1 JavaScript语言概述JavaScript简介，JavaScript特点，JavaScript功能，JavaScript编程起步，JavaScript的实现基础，客户端脚本和服务端脚本13.2 JavaScript语言基础数值类型和变量，运算符，流程控制语句和循环语句13.3 JavaScript事件处理事件处理的概念和方法，如何编写用户自定义的事件处理函数及如何将他们与页面中用户的动作相关联13.4 JavaScript基于对象编程面向对象编程和基于对象编程，对象的创建，对象组织层次，代码的封装和复用。13.5 文档对象模型文档对象模型D