1网页设计与制作教学大纲.docx

1网页设计与制作教学大纲.docx

《1网页设计与制作教学大纲.docx》由会员分享，可在线阅读，更多相关《1网页设计与制作教学大纲.docx（15页珍藏版）》请在冰豆网上搜索。

1网页设计与制作教学大纲

网页设计与制作实施性教学大纲

（适用于计算机网络专业、电子商务专业等）

一、课程的性质与任务

1、课程性质

   《网页设计与制作》是我校计算机应用、计算机网络、电子商务等专业开设的一门专业必修课，是计算机类专业的一门实践环节课程，也可以作为其他相关专业的实践课程或选修课，它是一门操作性和实践性很强的职业技术课程。

本课程的主要内容为系统介绍网页编辑与制作软件AdobeDreamweaverCS3，通过这种有代表性的网页制作软件的使用，掌握网站设计的全过程，并能熟练地制作出有专业水准的网站。

2、课程任务

   本门课程在专业教学计划中起着十分重要的作用，通过这门课程，学生可以掌握以下技能和知识：

   ◆掌握网站的开发流程，如建站规划、效果图制作、建立站点、发布网站等相关知识。

   ◆掌握各种网页元素在DremweaverCS3中的使用。

例如，文本、表格、图像、超级链接、层、框架和表单等。

   ◆掌握HTML，理解各种标记的功能和用法。

   ◆掌握在DremweaverCS3中使用CSS控制网页元素的方法。

   ◆掌握在DremweaverCS3中使用JavaScript制作网页特效的基本方法。

   ◆能够解决一些网页设计中的常见问题。

3、本课程的特点

   ◆课程注重实际应用，即实践性强。

   ◆涉及的DremweaverCS3软件是目前网页制作工作中较为流行的软件，是“网页三剑客”之一，具有较强的实践性，学习难度不大。

   ◆突出理论联系实际，实作课时占总课时的50%以上，实际应用知识占课程总知识量的80%以上。

4、与相关课程的衔接、配合、分工

   先修课程：

“计算机应用基础”、“图形图像处理（Fireworks或PhotoShop）”、“Flash动画制作”等。

二、课程目标

   本课程的基本目标是：

   使学生通过本课程的学习，掌握DreamweaverCS3的使用方法，学会使用DreamweaverCS3制作Web网页的技术。

   本课程学习结束后，学生应能根据实际需要自行设计静态网页，建立网站。

故应使学生通过本课程的学习，熟练掌握网页的基本制作方法和技巧，并最终设计一个具有实用意义的网站，并上传到学习用的服务器（或互联网）上。

   课程在知识、素质和能力方面的基本要求：

（1）知识要求

   ◆深入了解Internet，理解WWW、HTTP、FTP等概念及作用；

   ◆掌握网站设计和发布的流程；

   ◆理解网站维护管理的意义及重要性，理解服务器、客户端、浏览器的概念和作用；

   ◆掌握HTML的含义，及使用HTML制作网页的方法；

   ◆了解多种网页制作软件和图像处理软件相结合设计网站的好处。

（2）素质要求

   本课程将培养学生以下几方面的职业素质：

   ◆服务意识：

能够为他人提供优质的服务；

   ◆文明法制意识：

网站内容应积极健康向上，不做违法的事；

   ◆合作精神：

能够与他人进行合作，具有协调工作能力和组织管理能力；

   ◆较强的自我知识及技术更新能力：

快速跟踪网页制作的新技术及市场应用动态。

   （3）能力与技能要求

   ◆掌握网页制作软件DreamweaverCS3的使用方法；

   ◆掌握DreamweaverCS3的基本功能，并能根据具体要求制作表态网页；

   ◆掌握CSS、DIV等网页制作元素，并能有效运用，美化网页；

   ◆能在网页中有效地编制/插入需要的JavaScript脚本；

   ◆能熟练地进行网站的上传/下载、更新、管理。

三、适用专业及开设学期

1、适用专业：

   中等职业技术学校中的计算机应用专业、计算机网络专业、电子商务专业。

2、开设学期：

   第三学期或第四学期。

四、学时分配

   总学时：

96（理论：

38，实作：

58）。

一个学期内完成教学。

   各知识单元的学时（理论与实验学时）分配如下：

编号

教学内容

讲解学时

实作学时

1

了解网站的制作流程

2

2

2

创建和管理本地站点

2

2

3

HTML语言

6

6

4

使用表格布局网页

3

6

5

使用CSS控制网页元素

6

6

6

使用模板提高制作效率

3

6

7

使用DIV+CSS布局网页

4

8

8

Spry和JavaScript的使用

4

6

9

使用框架布局制作网页

4

6

10

综合设计

4

10

合计

38

58

五、课程各知识单元的内容、重点、组织结构及授课要求

项目一、了解网站的制作流程

本章目标

   ◆通过经典网站的赏析，了解不同用途的网站在设计风格上的异同点。

同时也有助于提高学习制作网页的兴趣。

   ◆了解与网站相关的几个概念。

   ◆认识DreamweaverCS3的工作界面，以及工具窗口的布置方法。

   ◆能制作一个简单的网页。

学习要点

   ◆与网站相关的概念（服务器、浏览器、网页、网站、IP地址、域名、FTP等）。

   ◆DreamweaverCS3的工作界面。

   ◆创建简单的网页。

重点和难点

   ◆与网站相关的概念

   ◆发布网站。

内容组织结构

任务1、经典网页赏析

   ◆门户网站

   ◆学院网站

   ◆商业网站

任务2、几个相关概念

   ◆网页与网站

   ◆服务器与浏览器

   ◆网站的基本工作原理

   ◆静态网页和动态网页

   ◆网页设计工具简介

任务3、熟悉DreamweaverCS3

   ◆运行DreamweaverCS3

   ◆熟悉DreamweaverCS3的工作界面

   ◆了解DreamweaverCS3的帮助功能

任务4、制作第一个网页

   ◆制作一个简单的图文混排网页

   ◆浏览网页

项目二、创建和管理本地站点

本章目标

   ◆理解站点、网站、网页及网页属性的概念。

   ◆了解建立网站的准备工作以及与网站有关的概念。

   ◆掌握创建和组织管理站点的方法。

   ◆掌握使用DreamweaverCS3创建网页的方法。

   ◆了解创建Web服务器及虚拟目录的方法。

学习要点

   ◆站点、网站、网页及网页属性的概念，组织管理站点。

   ◆使用DreamweaverCS3创建和管理站点。

   ◆配置本地Web服务器。

重点和难点

   ◆创建和管理本地站点

   ◆安装与配置本地Web服务器

内容组织结构

任务1、创建和管理本地站点

   ◆认识站点

   ◆创建和管理站点

任务2、在站点中创建网页

   ◆创建和保存网页

   ◆打开和关闭网页

任务3、安装与配置本地Web服务器

   ◆什么是Web服务器

   ◆在Windows操作系统中安装Web服务器

   ◆设置IIS信息服务

项目三、HTML语言

本章目标

   ◆认识HTML常用标记，理解其常用属性。

   ◆掌握HTML常用标记的用法。

   ◆熟悉使用HTML制作较简单的网页。

学习要点

   ◆HTML排版标记、表格标记、超链接标记、表单标记等的属性和用法。

重点和难点

   ◆理解HTML文本结构。

   ◆掌握HTML常用标记的正确使用。

   ◆掌握超链接标记的主要属性和使用方法。

   ◆认识表单及控件。

内容组织结构

任务1、HTML语言简介

   ◆什么是HTML语言

   ◆HTML基本语法

任务2、页面排版标记

   ◆标题标记

   ◆版面格式标记

   ◆项目符号标记

   ◆图像标记

任务3、表格标记

   ◆几种表格标记

   ◆合并单元格

任务4、超链接标记

   ◆超链接标记

   ◆绝对路径和相对路径

任务5、表单标记

   ◆表单的概念

   ◆常用的表单控件标记

项目四、使用表格布局网页

本章目标

   ◆掌握插入表格、表格嵌套的方法。

   ◆掌握选择表格，合并及拆分单元格，插入或删除行或列的方法。

   ◆设置表格、单元格属性和表格模板。

学习要点

   ◆插入表格、表格嵌套。

   ◆选择表格，合并及拆分单元格，插入或删除行或列。

   ◆设置表格、单元格属性和表格模板。

重点和难点

   ◆表格嵌套。

   ◆设置表格、单元格属性和表格模板。

内容组织结构

任务1、使用表格制作简单网页

   ◆表格布局

   ◆表格的相关属性

   ◆单元格的相关属性

任务2、使用表格制作复杂网页

   ◆使用嵌套表格布局网页

   ◆选择表格元素的方法

项目五、使用CSS控制网页元素

本章目标

   ◆理解CSS样式表的含义、分类。

   ◆掌握利用样式面板创建及编辑CSS样式表的方法。

   ◆使用CSS控制文本、段落、页面、表格的布局。

   ◆使用CSS设置超链接。

   ◆使用CSS滤镜。

学习要点

   ◆掌握利用样式面板创建及编辑CSS样式表的方法。

   ◆使用CSS控制文本、段落、页面、表格的布局。

   ◆使用CSS设置超链接。

重点和难点

   ◆掌握利用样式面板创建及编辑CSS样式表的方法。

   ◆使用CSS控制文本、段落、页面、表格的布局。

内容组织结构

任务1、使用CSS控制页面、文本、段落的布局

   ◆什么是CSS

   ◆CSS分类

   ◆CSS规则对话框的使用

任务2、使用CSS控制表格元素的外观

任务3、使用CSS设置超链接。

   ◆超链接的四种状态

   ◆将网页中不同位置的超链接设置成不同的样式

任务4、使用CSS滤镜产生绚丽效果

   ◆什么是CSS滤镜

   ◆滤镜的类型及其参数设置

项目六、使用模板提高制作效率

本章目标

   ◆掌握模板和库的概念。

   ◆掌握模板和库的创建、编辑、应用方法。

   ◆熟练使用模板和库。

学习要点

   ◆掌握模板和库的创建、编辑、应用方法。

   ◆熟练使用模板和库。

重点和难点

   ◆掌握模板和库的创建、编辑、应用方法。

   ◆熟练使用模板和库。

内容组织结构

任务1、使用模板制作网页

   ◆什么是模板

   ◆创建模板的方法

   ◆创建可编辑区域

   ◆创建可重复区域

   ◆应用模板

   ◆将模板从网页中分离

   ◆删除网站的模板

任务2、使用库制作相似的网页

   ◆库的概念

   ◆创建库项目

   ◆在文档中插入库项目

   ◆编辑更新库项目

   ◆更新页面

   ◆分离文档中的库项目

   ◆重建库项目

项目七、使用DIV+CSS布局网页

本章目标

   ◆掌握DIV（层）的概念。

   ◆了解CSS+DIV的布局优势。

   ◆掌握使用CSS+DIV进行常用页面布局方法。

学习要点

   ◆DIV（层）的概念。

   ◆掌握使用DIV+CSS进行常用页面布局方法。

重点和难点

   ◆DIV（层）的概念。

   ◆掌握使用DIV+CSS进行常用页面布局方法。

内容组织结构

任务1、初识DIV

   ◆DIV与CSS

   ◆插入DIV与建立CSS规则

   ◆CSS盒子模型

   ◆常用的DIV布局方式

   ◆DIV与项目列表

任务2、使用DIV制作较复杂的网页

项目8、内置行为与JavaScript

本章目标

   ◆掌握行为和事件的概念。

   ◆掌握使用内置行为制作简单的网页特效。

   ◆掌握使用Spry构件制作网页下拉菜单的方法。

   ◆了解使用JavaScript脚本语言制作简单网页特效的方法。

学习要点

   ◆掌握使用内置行为制作简单的网页特效。

   ◆掌握使用Spry构件制作网页下拉菜单的方法。

   ◆了解JavaScript脚本语言。

重点和难点

   ◆行为和事件的概念。

   ◆使用内置行为制作简单的网页特效。

   ◆使用Spry构件制作网页下拉菜单的方法。

内容组织结构

任务1、使用DreamweaverCS3内置行为制作网页特效

   ◆认识事件与动作的含义

   ◆行为的概念及常用行为

   ◆在网页中添加行为

   ◆使用时间轴

任务2、Spry框架制作动态导航菜单

   ◆认识ry框架

   ◆认识Spry框架中的构件

   ◆使用Spry框架制作导航菜单

任务3、JavaScript制作网页特效

   ◆JavaScript简介

   ◆使用JavaScript制作网页特效

项目九、使用框架布局制作网页

本章目标

   ◆掌握框架的概念、组成及属性的定义。

   ◆掌握使用框架布局网页的方法。

   ◆掌握使用浮动框架布局网页的方法。

学习要点

   ◆掌握框架的概念、组成及属性的定义。

   ◆掌握使用框架布局网页的方法。

   ◆掌握使用浮动框架布局网页的方法。

重点和难点

   ◆掌握框架的概念、组成及属性的定义。

   ◆掌握使用框架布局网页的方法。

   ◆掌握使用浮动框架布局网页的方法。

内容组织结构

任务1、使用框架布局网页

   ◆框架的概念及应用

   ◆框架的创建与删除

   ◆框架的激活与属性设置

   ◆框架集的属性设置

任务2、使用浮动框架布局网页

   ◆浮动框架的概念

   ◆浮动框架的创建及属性设置

项目十、综合设计

本章目标

   ◆形成小型商业网站的创建思路。

   ◆掌握创建小型商业网站的客户端界面的方法。

   ◆网站创建综合能力的养成。

学习要点

   ◆全面设计站点目录结构的规划和设置。

   ◆网页的创建、布局以及设置方法。

   ◆网站创建综合能力的养成。

重点和难点

   ◆理解站点、网站、网页及网页属性的概念。

   ◆会向网页中插入多媒体信息。

   ◆培养站点、网站、网页及网页属性等知识的综合应用能力

内容组织结构

任务1、网站创建的流程

   ◆网站制作的基本流程

   ◆网站的设计

   ◆提高网站的打开速度

任务2、站点目录结构的规划和设置

   ◆站点目录规划

   ◆素材的收集、制作和整理

任务3、制作含按钮、导航拦、表单的交互式网页

任务4、制作相应的子页、测试浏览网页

六、教学方法、教学场所与设备要求

   1、教学方法：

本课程是一门应用型课程，涉及到以前所学知识点较多，因此在教学中应注意启发式教学并加强实例教学的直观性。

   2、教学场所与设备要求：

安装有WindowsXP或Windows2000的机房均可以进行实验，教学要求在多媒体教室进行。

   3、需要一台教学用Web服务器：

安装有Windows2000Server或以上版本的网络操作系统，并安装Web服务器和FTP服务，能够接受学生上传的网站。

学生机能正常浏览该Web服务器上的网站。

七、考核方式

   笔试采用闭卷或开卷考试，主要由选择题、实验操作题组成。

在总成绩中，平时成绩占20%，笔试占40%，上机测试占60%。

八、教材及教学参考书

1、教材：

   根据以上内容编写的校本教材——《网页设计与制作DreamweaverCS3》。

2、教学参考书

∙《网页设计与制作DreamweaverCS3》刘红梅主编江苏教育出版社

∙《网页制作三剑客职业技能与商业应用教程》龙飞主编成都时代出版社

Dreamweaver网页设计与制作本书目录

项目一个人网页的简单美化——网站制作基础知识

任务1认识网站与网页

任务2使用HTMl语言修改简单网页

知识拓展网页美化常识

项目二创建度假村网站——DreamweaverCS3入门

任务1面板基本操作——初识DreamweaverCS3

任务2创建“fuligon9”站点——新建和管理站点

任务3为首页设置头信息和页面属性——页面总体设置

知识拓展网站制作流程

项目三制作汽车网站——输入与编辑网页元素

任务1输人并设置网站子页文本——文本输入与编辑

任务2在主页中插入导航条和图像——应用图像

任务3为主页设置动画和背景音乐——应用动匦和多媒体

知识拓展网页中图像不显示问题的处理

项目四制作文化公司网站——应用超链接和行为 

项目一个人网页的简单美化——网站制作基础知识

任务1认识网站与网页

任务2使用HTMl语言修改简单网页

知识拓展网页美化常识

项目二创建度假村网站——DreamweaverCS3入门

任务1面板基本操作——初识DreamweaverCS3

任务2创建“fuligon9”站点——新建和管理站点

任务3为首页设置头信息和页面属性——页面总体设置

知识拓展网站制作流程

项目三制作汽车网站——输入与编辑网页元素

任务1输人并设置网站子页文本——文本输入与编辑

任务2在主页中插入导航条和图像——应用图像

任务3为主页设置动画和背景音乐——应用动匦和多媒体

知识拓展网页中图像不显示问题的处理

项目四制作文化公司网站——应用超链接和行为

任务1为首页和子页设置链接——应用超链接

任务2为首页添加伴随窗口——应用行为

知识拓展制作弹出式下拉菜单

项目五制作饰品网站——用表格构建网页布局

任务1布局主页index.htm1——表格的基本应用

任务2布局子页——表格的高级应用

知识拓展单元格没有按照指定大小显示问题的处理

项目六制作播客网站——应用框架布局网页

任务制作网站首页——了解和使用框架

知识拓展嵌入式框架

项目七制作美容网站——应用样式表

任务1为网站首页设置样式——样式表的基本应用

任务2为网站子页设置样式——样式表的高级应用

项目八制作茶文化网站——应用Div+CSS技术布局网页

任务制作网站首页和子页——使用Div+CSS技术制作网页

知识拓展Div+CSS技术使用技巧

项目九制作个人网站——应用模板和库

任务1创建“梦幻花园”首页——应用模板

任务2创建“幸福一家”网页——应用库项目

项目十制作留言板——动态网页入门

任务1创建动态网页测试环境

任务2创建“留言板”数据库——了解数据库

任务3制作“留言板”——应用表单和表单对象

知识拓展动态网页不能正常显示的解决方法

项目十一制作饰品公司网站首页——应用JavaScript制作网页特效

任务1认识JavaScript

任务2更新饰品公司网站首页——用JavaScript制作网页特效

知识拓展JavaScript项目实例——房屋信息系统