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