《网页设计与制作》教学大纲由刀豆文库小编整理，希望给你工作、学习、生活带来方便，猜你可能喜欢“网页设计与制作入门”。
《网页设计与制作》教学大纲
课程编号：14411400 课程总学时：48 周学时数：3 学分：3 课程类型：专业必修课 开课（系）院：教育学院 执笔人：朱 玲 审核人：刘 梅
一、课程简介
《网页设计与制作》是一门综合性、应用性很强的课程，是教育技术学专业的一门专业必修课程。通过学习本课程，能利用Dreamweaver 8来开发出有实用价值的网站来。熟练掌握Dreamweaver 8的基本界面环境和HTML语法，了解当前常用数据库的基础知识，能利用数据库来为网站服务。
本课程以《Dreamweaver 8中文版网页制作基础》作为教材，该教材采用项目教学法。项目教学法”是通过实施一个完整的项目而进行的教学活动，其目的是在课堂教学中把理论与实践教学有机地结合起来，充分发掘学生的创造潜能，提高学生解决实际问题的综合能力。这也充分体现了我校的培养应用型人才的路线。
二、教学目的与要求
1、教学目的本课程开设的主要目的，是为了适应web技术的飞速发展，为学生今后在学习、工作中建立网站及网页制作打下基础。通过本课程的学习，使学生了解如何规划并建立站点，掌握制作网页的基础知识，能熟练利用Dreamweaver 8提供的强大的功能制作出精美的网站。
2、教学要求
在本课程的学习中，要求学生能够熟练使用Dreamweaver 8操作环境，掌握HTML的语法规则，并能够利用Dreamweaver 8的强大功能制做出精美的网页，同时能独立创建并管理网站。
三、教学内容及学时安排
第一章Dreamweaver 8概论
[教学目的与要求]
1.认识Dreamweaver 8 2.了解Dreamweaver 8的用途及新增功能 3.熟悉Dreamweaver 8的工作界面 4.熟悉Dreamweaver 8的一些简单的设置 [重点与难点]
1.Dreamweaver 8的工作界面 2.自定义工作环境 3.选择视图方式 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、什么是Dreamweaver
二、新增功能
三、Dreamweaver 8的工作界面
（一）选择工作界面
（二）界面组成四、自定义工作环境
（一）显示/隐藏面板和工具栏
（二）更改“插入”工具栏的外观
（三）自由组合面板
（四）调整文档窗口大小
五、选择视图方式
（一）代码视图
（二）设计视图
（三）代码和设计视图 [实验实践教学环节]
实验项目：熟悉Dreamweaver8操作环境 实验课时：2学时 [课堂训练、作业思考题]
1.如何使一个控制面板成为一个独立的面板？ 2.如何将文档窗口调整为640×480像素大小？
[教学目的与要求]
1.了解网页的设计与布局原则 2.明确网站的策划与创建原则 3.知道网站的开发流程 [重点与难点]
1.网页的设计与布局原则 2.网站的策划与创建原则 3.网站的开发流程
第二章 网页与网站的基本知识
[教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、网页设计和布局原则
（一）网页主题网页主题时应该遵循以下原则：
（二）网页命名和标志
（三）网页的色彩
（四）网页的文字
（五）网页中的表格
（六）网页版面和布局
二、策划与创建原则
(一)什么是网站(二)网站的目标定位(三)网站的风格(四)网站的CI形象(五)网站的栏目和板块(六)网站的目录结构
三、网站的开发流程： [实验实践教学环节]
无
[课堂训练、作业思考题]
1．简述网站开发需要经过的几个主要阶段。2．简述制作网页需要注意的问题。
[教学目的与要求]
1.掌握HTML语言及其基本语法 2.如何制定及清理多余的HTML代码 3.掌握在各种环境中编辑HTML代码的方法 [重点与难点] 1．HTML的基本语法 2．使用代码检查器 3．设置HTML代码参数
第三章 HTML语言控制
4．清理多余的HTML代码 5．编辑HTML代码 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、什么是HTML
二、HTML的基本语法
三、认识“代码检查器”面板
（一）“代码检查器”面板的功能
（二）3.3.2 设置“代码检查器”面板
四、设置HTML代码参数
（一）设置代码颜色
（二）设置代码格式
（三）设置代码改写参数
五、清理HTML代码
六、编辑HTML代码
（一）在代码视图中编辑HTML
（二）在设计视图中编辑HTML
（三）在外部代码编辑器中编辑HTML [实验实践教学环节] 无
[课堂训练、作业思考题]
1．如何清除多余的HTML代码和多余的word代码？
第四章 设置文本和网页属性
[教学目的与要求]
1.了解文档的新建、保存和打开
2.掌握怎样输入文本、查找和替换、检查拼写、设置文本和段落 3.掌握使用水平分隔线和设置网页属性等 [重点与难点] 1.文档的基本操作 2.输入文本 3.查找与替换 4.拼写检查 5.格式化文本 6.使用水平分隔线 7.设置网页属性 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、文档的基本操作
（一）启动Dreamweaver 8主工作界面
（二）新建文档 “新建文档”对话框
（三）保存新文档
（四）打开文档
二、输入文本
(一)文本换行(二)插入特殊字符(三)导入Word文档(四)添加注释
三、查找与替换 “查找和替换”对话框
四、拼写检查 “检查拼写”对话框
五、格式化文本
(一)文本属性栏(二)设置文本格式(三)设置段落格式
六、使用水平分隔线
(一)4.6.1 添加水平分隔线(二)4.6.2 修改属性(三)4.6.3 设置颜色
七、设置网页属性
(一)4.7.1 使用“页面属性”对话框(二)4.7.2 使用网页配色方案 [实验实践教学环节]
实验项目：插入网页对象（第4、5、9、12章）实验课时：3学时 [课堂训练、作业思考题]
1．如何使启动程序不显示起始页？ 2．简述创建一个空白文档的过程。
第五章 使用网页图像
[教学目的与要求]
1.了解网页图像的基本概念
2.掌握如何插入图像、如何编辑图像 3.掌握如何创建图像映射即热点 [重点与难点]
1．网页图像的格式 2．插入图像 3．编辑图像 4．创建图像映射 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、网页图像简述
(一)位图图像(二)矢量图像(三)常见网页图像格式
二、插入图像
(一)插入普通图像
(二)插入鼠标经过时变化的图像(三)插入网页背景图像
三、编辑图像
(一)5.3.1 调整图像大小(二)5.3.2 剪掉图像的多余部分(三)5.3.3 调整图像的亮度和对比度(四)5.3.4 锐化图像(五)5.3.5 图像的排列方式(六)5.3.6 设置图像间距(七)5.3.7 用文字代替图像(八)5.3.8 使用图像编辑器
四、创建图像映射
(一)5.4.1 什么是图像映射图(二)5.4.2 图像映射面板(三)5.4.3 定义和编辑热点(四)5.4.4 为热点建立链接 [实验实践教学环节]
实验项目：插入网页对象（第4、5、9、12章）实验课时：2学时 [课堂训练、作业思考题]
1．如何在网页中用文字代替图像？ 2．如何为热点建立链接？
[教学目的与要求]
1.掌握表格的创建和使用、表格的编辑和修改2.掌握表格的套用样式和嵌套 3.掌握如何使用表格进行页面布局 [重点与难点]
1．创建表格 2．编辑表格
第六章 创建和使用表格
3．套用表格 4．表格的嵌套
5．使用表格进行页面布局 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、创建表格
(一)插入表格并添加内容(二)导入表格数据文件
二、编辑表格
(一)添加/删除行列(二)调整表格大小(三)调整行高和列宽(四)合并/拆分单元格(五)设置单元格的宽度和高度(六)设置表格的边框颜色(七)设置表格的背景
三、套用表格样式
四、表格的嵌套
五、使用表格进行页面布局
(一)布局模式
(二)绘制布局单元格和布局表格(三)将内容添加到布局单元格中(四)使用间隔图像
(五)更改布局表格和布局单元格的属性[实验实践教学环节]
实验项目：网页布局（第6、7、8章）实验课时：2课时 [课堂训练、作业思考题]
1．简述合并和拆分单元格的几种方法。2．怎样在布局表格中使用间隔图像？
第七章 创建和使用框架
[教学目的与要求]
1.理解框架和框架集的概念
2.掌握如何创建、选择框架和框架集
3.掌握如何设置框架和框架集的属性及编辑框架页面 [重点与难点]
1.创建框架与框架集 2.选择框架与框架集的方法 3.设置框架与框架集的属性 4.编辑框架页面 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、什么是框架与框架集
二、创建框架与框架集
(一)使用预定义创建框架集(二)自己设计框架集(三)删除框架(四)创建嵌套框架集
三、选择框架与框架集
(一)在文档窗口中选择(二)在“框架”面板中选择
四、设置框架与框架集属性
（一）设置框架属性
（二）设置框架集属性
五、编辑框架页面
(一)7.5.1 设置框架中文档的背景颜色(二)7.5.2 使用链接控制框架内容(三)7.5.3 替换框架文件
(四)7.5.4 保存框架和框架集文件(五)7.5.5 解决浏览器无法显示框架的问题 [实验实践教学环节]
实验项目：网页布局（第6、7、8章）实验课时：2课时 [课堂训练、作业思考题]
1．如何删除框架和框架集？ 2．怎样替换框架文件？
[教学目的与要求]
1.了解创建层
2.掌握设计层属性、编辑层 3.掌握层和表格的转换 [重点与难点]
1．创建层 2．设置层属性 3．编辑层 4．层和表格的转换 [教学时数] 3学时
[教学方法与手段]
第八章 创建和使用层 讲授法与多媒体教学相结合 [主要内容]
一、创建层
(一)创建平铺式层(二)创建重叠式层(三)创建嵌入式层
二、设置层的属性
(一)设置层参数(二)设置单个层属性(三)同时设置多个层的属性
三、编辑层
(一)使用“层”面板 通过“层”面板可以管理文档中的层。
(二)使用“层”面板可以防止层重叠、更改层的可见性、将层嵌套或层叠，以及选择一个或多个层。(三)在层中添加内容(四)选择和移动层(五)防止层重叠(六)改变层的堆叠次序
(七)显示/隐藏层(八)创建预先载入层(九)调整层的大小
层和表格的转换层
(一)将层转换成表格(二)将表格转换成层 [实验实践教学环节]
实验项目：网页布局（第6、7、8章）实验课时：2课时 [课堂训练、作业思考题]
1．如何创建预先载入层？ 2．简述表格与层的转换方法。
[教学目的与要求]
1.了解表单与表单元素的基本概念
第九章 表 单
四、2.掌握表单的创建及表单元素的插入和设置方法 3.掌握检查表单以验证表单元素正确性 [重点与难点]
1.表单的创建
2.插入与设置文本域和文本区域
3.插入与设置复选框、单选按钮和单选按钮组 4.插入与设置列表框和弹出菜单 5.插入与设置跳转菜单 6.插入与设置文件域 7.插入与设置表单按钮 8.检查表单 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、表单与表单元素(一)表单(二)表单元素
二、表单
(一)创建表单(二)设置表单属性
三、文本域和文本区域
(一)插入文本域(二)设置文本域的属性(三)插入文本区域
四、复选框、单选按钮和单选按钮组
(一)插入单选按钮与复选框(二)设置单选按钮与复选框的属性
五、列表框和弹出菜单
(一)插入列表框与弹出菜单(二)设置列表/菜单属性(三)跳转菜单(四)文件域(五)表单按钮(六)标准表单按钮(七)图片式按钮(八)检查表单 [实验实践教学环节]
实验项目1：插入网页对象（第4、5、9、12章）实验课时：3学时 实验项目2：表单对象 实验课时：2课时 [课堂训练、作业思考题]
1．文本域与文本区域有何区别？ 2．如何插入跳转菜单？
第十章 添加超级链接和导航工具条
[教学目的与要求]
1.掌握在Dreamweaver 8中创建超级链接的基本方法；
2.了解超级链接的种类：包括内部、外部超级链接、为E-mail和下载文件添加超级链接、使用锚点和导航条工具等内容。[重点与难点]
1、内部超级链接的使用方法；
2、外部超级链接的使用方法；
3、为图片添加超级链接；
4、为E-mail创建超级链接；
5、设置下载文件链接；
6、锚点的创建方法；
7、导航条的创建方法； [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、什么是超级链接
(一)超级链接的概念(二)链接路径
二、使用内部超级链接
(一)10.2.1 为文字添加超级链接(二)10.2.2 设置文字超级链接的属性(三)10.2.3 为图片添加超级链接
三、外部超级链接
四、为E-mail和下载文件添加超级链接
（一）为E-mail添加超级链.（二）为下载文件添加超级链接
五、使用锚点
（一）创建锚点
（二）链接锚点
六、使用导航工具条
（一）插入导航条
（二）修改导航条 [实验实践教学环节]
无
[课堂训练、作业思考题]
1．简述超级链接的分类。2．如何创建锚点？
第十一章 层叠样式表
[教学目的与要求]
1.掌握CSS的基本语法与功能、“CSS样式”面板与“相关CSS”面板的使用、应用类样式的方法、插入样式表的方式、CSS样式的属性设置；
2.了解样式表的优先顺序等内容。[重点与难点]
1.CSS样式的创建、编辑与导出 2.应用类样式 3.设置CSS样式属性 4.CSS样式的优先顺序 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、层叠样式表概述
(一)什么是CSS(二)CSS的基本语法
二、CSS样式的创建、编辑与导出
(一)认识“CSS样式”面板(二)认识“相关CSS”面板(三)创建CSS样式
(四)导出样式以创建CSS样式表(五)管理CSS样式(六)链接和导出外部样式表(七)编辑CSS样式(八)编辑外部样式表
三、应用类样式
(一)应用自定义的CSS样式(二)删除自定义的CSS样式
四、设置CSS样式属性(一)“类型”选项(二)“背景”选项(三)“区块”选项(四)“方框”选项(五)“边框”选项(六)“列表”选项(七)“定位”选项(八)“扩展”选项
五、CSS样式的优先顺序
[实验实践教学环节] 无
[课堂训练、作业思考题]
1．简述CSS样式的作用。2．简述创建CSS样式的方法。
[教学目的与要求]
1.掌握插入Flash动画、Shockwave电影第十二章 插入多媒体组件
2.掌握插入Applet程序、ActiveX控件和插件等内容 [重点与难点]
1.添加Flash动画。2.添加Shockwave电影。3.添加Java Applet程序。4.使用ActiveX控件。5.使用插件。
6.添加声音背景和声音文件。7.插入日期和时间。[教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、插入多媒体文件简介
二、添加Flash动画
(一)插入Flash动画(二)设置Flash动画属性(三)参数简介
三、插入Shockwave电影
(一)插入Shockwave电影(二)设置Shockwave电影属性
四、插入Java Applet程序
（一）插入Java Applet程序
（二）设置Java Applet属性
五、设置ActiveX控件
六、设置Netscape Navigator插件
(一)插入插件(二)设置插件属性
七、在网页中添加声音
(一)声音文件格式(二)为网页加入背景音乐(三)嵌入声音文件
八、插入日期和时间
九、使用计数器 [实验实践教学环节]
实验项目：插入网页对象（第4、5、9、12章）实验课时：3学时 [课堂训练、作业思考题]
1．简述可以插入的多媒体组件的种类。2．如何在网页中嵌入声音文件？
第十三章 生成动态特效
[教学目的与要求]
1.了解行为的含义
2.掌握应用Dreamweaver 8中内置的各种行为、为对象附加行为及获取更多的行为 [重点与难点]
1.了解行为
2.了解Dreamweaver 8的内置行为 3.应用行为 [教学时数] 3学时 [教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、什么是行为
二、Dreamweaver 8中的行为(一)认识行为面板(二)内置行为
三、应用行为(一)为对象附加行为(二)获得更多的行为
四、动态特效实例(一)改变对象属性(二)检查浏览器(三)检查插件(四)制作弹出窗口(五)制作动态图片说明(六)设置状态栏信息(七)设置播放声音 [实验实践教学环节]
实验项目：制作动态网页 实验课时：3课时 [课堂训练、作业思考题]
1．简述改变层属性的方法。
2．简述单击某按钮时发出声音特效的制作方法。
第十四章 库与模版
[教学目的与要求]
1.掌握如何创建和设置库项目，为网页添加库项目和编辑库项目 2.掌握如何创建、设置模板的网页属性 3.掌握如何导入导出XML内容 [重点与难点]
1.设置库项目参数 2.编辑库项目 3.利用库项目更新网站 4.使用模板创建网页 5.修改模板属性 6.导入导出XML内容 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、库与模版概述
二、使用库项目(一)创建库项目(二)将库项目添加到网页
三、编辑库项目
（一）认识库项目属性面板
（二）删除与重命名库项目
（三）修改库项目
四、利用库项目更新网站
五、创建模版
（一）将文档另存为模版
（二）创建可编辑区域
（三）创建重复区域
（四）定义可编辑标签属性
六、创建基于模版的文档
七、修改模版属性
八、导入导出XML内容 实验实践教学环节] 无
课堂训练、作业思考题]
1．如何设置可编辑区域及可重复区域？ 2．更改了库项目或模版后，如何更新网站？教学目的与要求]
1.掌握站点的规划和设计知识 2.掌握本地和远程的概念
第十五章 规划和设计站点
[ [
[3.掌握创建本地站点的方法
4.掌握设置本地和远程文件夹，管理站点 [重点与难点]
1．创建本地站点 2．设置本地和远程文件夹 3．管理Web站点 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、关于站点规划和设计
二、关于本地与远程的几个概念(一)本地计算机和Internet服务器(二)本地站点和远程站点
三、创建本地站点
四、设置本地和远程文件夹(一)设置本地文件夹(二)设置远程文件夹
(三)为FTP访问选择主机目录(四)设置远程文件夹时应注意的事项
五、管理Web站点(一)导入与导出站点(二)从站点列表中删除站点(三)获取和上传文件
(四)同步本地和远程站点上的文件(五)遮盖站点中的文件夹和文件(六)使用设计备注 [实验实践教学环节]
无
[课堂训练、作业思考题]
1．简述应用定义站点高级选项卡定义站点的过程。
第十六章 上传站点
[教学目的与要求] 1.了解如何申请个人网站空间 2.知道到哪里去下载免费网站空间
3.了解如何将网站上传到WWW服务器以及如何推广网站等 [重点与难点]
1.申请网站空间 2.上传站点 3.网站的宣传和推广 [教学时数] 3学时
[教学方法与手段] 讲授法与多媒体教学相结合 [主要内容]
一、申请网站空间
(一)选择网站空间(二)申请方法
二、上传站点
（一）设置本地服务器地址
（二）传送站点
三、宣传和推广
（一）用E-mail形式来宣传
（二）在BBS或新闻组中宣传(三)在搜索引擎网站中宣传(四)广告与友情链接
(五)在Dreamweaver 8中插入关键词与描述 [实验实践教学环节]
无
[课堂训练、作业思考题]
1．简述申请个人免费网络空间的方法。
三、教学方法与手段
本课程采用讲授法、演示法、实验法、讨论法、探究式等多种教学方法进行教学，教学手段采用了传统教具、多媒体投影以及计算机网络等。
四、教材与教学参考书
[1] 孙印杰，薛书琴，俞露等编著.新世界Dreamweaver 8中文版应用教.电子工业出版社，2008.[2] 希望图书创作室编著.Dreamweaver（中文版)8标准教程.兵器工业出版社，2007.[3] 杨聪，韩小祥，周国辉主编.Dreamweaver 8网页设计案例实训教程.中国人民大学出版社，2009.[4] 葛艳玲主编.网页制作基础教程（Dreamweaver 8.0）（第2版）.电子工业出版社，2009.[5] 导向科技编著.中文版Dreamweaver 8网页设计培训教程.人民邮电出版社，2006.五、实验实践教学
实验教学是网页设计与制作的重要实践环节。通过实验，使学生加深理解、验证、巩固课堂教学内容，对Dreamweaver 8有一较全面的认识。培养学生分析问题和解决问题的能力，为以后深入学习教育技术专业的其它课程打下坚实的基础。
实验教学的主要目的是培养学生的动手能力，要求学生熟练掌握Dreamweaver 8的基本操作，网页的设计制作，网站的建立与管理等技能。
为使学生巩固课堂所学知识，根据教学内容本课程共设5项实验，分别是熟悉Dreamweaver 8的操作环境、插入网页对象、网页布局、表单对象和制作动态网页，最终学生上机实验完成最终作品。
六、课外训练及自学指导
（一）课外训练体系 1．训练目的与要求
网页设计与制作是一门实践性很强的课程，要想熟练的掌握Dreamweaver 8有关操作，网页制作和网站开发与管理的技能，就必须大力加强课外训练。
课外训练的主要目的：充分掌握网页制作的有关技能操作，学会设计单个网页，能够开发一个小型网站。2．训练内容与方法 训练的内容主要是每一章的重点难点知识，训练的方法主要有观摩法和实践法。
（二）自学指导体系 1．自学目的与要求
这门课程要求学生不仅仅是掌握课本上的知识，课本上的知识是远远不够的，这就要求学生必须自学。自学的主要目的是扩展知识面，加深对该课程知识的认识。要求知道与网页制作有关的知识。
2．自学内容与方法
自学的内容主要是网页制作的有关知识，除了Dreamweaver 8软件的有关操作以外，还要学习Flash、Fireworks等软件的有关网页制作知识。
自学的方法主要有资料查阅法、讨论法、网上学习法、实验练习法等。
七、考试考核
本课程的考试形式为技能考核，学生的学业成绩实行结构化成绩，由考试主卷成绩、副卷(实验)成绩和平时成绩构成，其中考试主卷成绩占60％，副卷成绩占20％，平时成绩占20％。
《Dreamweaver CS6中文版实例教程》教学大纲课程介绍：本课程是一门概念性和实践性都很强的面向实际应用的课程。Dreamweaver CS6是由Adobe公司开发的网页设计与制作软件。Ado......
网页设计与制作教学大纲课程性质专业必修课。学时学分1.总学分2；2.总学时36，其中网上自主学习24，上机实习12。授课对象1.网络教育本科 2.网络教育专升本课程的教学目的3.本课程......
《网页制作与设计》教学大纲课程编号：总学时数：36学时（其中讲授：20学时，实验：16学时）一、课程性质、目的和要求本课程是我系各专业必修专业课程之一。该课程以Dreamweaver和CSS为蓝......
网页设计与制作教学大纲(供医学影像学、护理学本科各专业用)前 言《网页设计与制作》是一门应用性和理论性都很强的课程，是医学影像和护理学专业的选修课程。通过学习本课程......
《网页设计与制作》教学大纲一、课程基本信息课程编号：中文名称：网页设计与制作英文名称：Web Design and Production 课程类别：选修课 适用专业：所有专业开课学期：2011-2012第2学......
