《网页设计与制作》教学大纲1.课程的基本描述2.教学定位2.1 课程教学目标能够掌握网页设计与制作的基本理论与方法，熟练掌握以Dreamweaver为代表的网页设计制作软件的基本操作以及其余Photoshop等软件的配合应用，掌握H5页面制作等新兴网页制作方法。
在此基础上能够独立完成网页的设计与制作。
2.2 课程的主要特点本课程是广播电视编导电视节目制作方向的专业必修课。
该门课程是一门实践性较强的课程。
他要求学生在掌握相关知识和原理后，学会使用DreamWeaver这门软件，并能够利用它熟练的制作出网页作品。
这门课程的内容主要包括：HTML语言的相关知识，Dreamweaver的相关用法。
并在此基础上了解掌握CSS（层叠样式表）的用法，JavaScript的主要用法。
以及服务器端语言的语言及数据库的相关知识。
由于授课时间的原因，以及学生的知识背景，这门课的主要授课重点在于HTML语言的语法，和Dreamweaver的使用。
而对于CSS以及JavaScript等知识只要侧重于介绍，其目的在于使学生对相关知识有全面的了解，以便在其中找出自己感兴趣的方向。
根据这门课的特点本门课包含大量的实验学时，通过上机实验，以加强学生的动手能力。
该门课程的先修课主要包括计算机使用基础等计算机类的基础课，以及Flash等相关软件的使用。
后续课主要是网站的设计与建设。
课程的讲授方式主要包括理论和实践相结合，重点培养学生的动手能力，激发学生的学习兴趣以在课下用大量时间进行自我学习。
根据这门课程的特点以及培养目的，这门课的考核采用节课作业的形式，务求切实的考察出学生的动手能力。
2.4教学方法案例教学、传统授课教学方法。
本课程采取传统授课教学方法和案例教学法相结合的授课方式：通过传统授课法让学生掌握网页设计与制作的基本方法以及Dreamweaver的基本操作；通过网页设计制作案例，强化学生的动手能力及自主学习能力。
3.知识点与学时分配3.1 课程覆盖的知识领域和知识单元汇总4.案例设计实验一简单网页制作一、实验目的1．熟悉Dreamweaver软件的操作界面。
2．掌握建立站点的方法。
3．掌握简单网页的制作方法。
4．掌握超链接的建立方法。
5．了解网页基本元素的HTML标记。
二、实验内容1．创建“神秘园”站点。
2．制作“首页”网页。
3．制作“作品列表”网页。
4．制作“十年精选”网页。
5．完成网页超链接。
三、实验准备以下文件上传至教师机1．网页范例文件：index.htm，list.htm，tenyears.htm。
2．图片素材。
3．实验指导书。
四、实验指导内容1．创建站点的重要性2．创建站点的基本步骤3．新建网页的两种方法4．网页文件的命名规则5．制作网页的基本步骤6．建立超链接的方法实验二 XHTML语言一、实验目的1．掌握XHTML 语法。
2．掌握XHTML 文档类型声明。
3．掌握XHTML 标记及属性。
3．掌握进行XHTML 标记验证的方法。
二、实验内容1．制作“webquest/index.html”网页。
2．依据XHTML 1.0 Strict DTD规范对“webquest/index.html”网页进行XHTML标记验证。
3．纠正不规范的XHTML代码，并记录在实验报告中。
三、实验准备以下文件上传至教师机1．网页范例文件：webquest/index.html。
2．图片素材。
3．实验指导书。
四、实验指导内容1．设置网页的文档类型2．文本分行和分段落的区别。
3．在网页中插入特殊符号的方法。
4．在网页中插入列表的方法。
5．在网页中插入图片的方法。
6．上传文件进行标记校验。
7．纠正不符合规范的XHTML代码实验三 CSS基础一、实验目的1．掌握CSS的基本语法规则。
2．掌握CSS的常用选择符。
3．掌握在网页上应用CSS的方法。
4．掌握使用Dreamweaver定义CSS的方法。
二、实验内容1．使用<div>标记定义“webquest/index.html”网页的逻辑结构。
2．使用CSS控制“webquest/index.html”网页的样式。
三、实验准备以下文件上传至教师机1．网页范例文件：webquest/index.html。
2．图片素材。
3．实验指导书。
四、实验指导内容1．“webquest/index.html”网页的逻辑结构。
2．新建CSS样式文件。
3．Dreamweaver中CSS样式面板的使用方法。
4．CSS的基本语法规则。
5．类型选择符的使用方法。
6．ID选择符的使用方法。
7．类选择符的使用方法。
8．选择符分组的使用方法。
9．ID选择符与类选择符的区别。
实验四 CSS单列布局一、实验目的1．掌握典型单列布局网页的逻辑结构。
2．熟练掌握使用CSS进行网页单列布局的方法。
二、实验内容1．使用CSS控制“悠然我思－首页”网页的样式。
2．使用CSS控制“悠然我思－月光诗集”网页的样式。
三、实验准备以下文件上传至教师机1．网页范例文件：index.html，poems.html。
2．图片素材。
3．实验指导书。
四、实验指导内容1．典型单列布局网页的逻辑结构。
2．使用CSS进行网页单列布局的方法。
3．网页居中的方法。
4．使用图像替换文字的方法。
5．设置列表样式的方法。
6．清除浮动的方法。
实验五 CSS两列布局一、实验目的1．掌握典型两列布局网页的逻辑结构。
2．熟练掌握使用CSS进行网页两列布局的方法。
二、实验内容1．使用两种方法实现”01.html”网页的两列布局。
2．使用两种方法实现”02.html”网页的两列布局。
三、实验准备以下文件上传至教师机1．网页范例文件：01.html，02.html。
2．图片素材。
3．实验指导书。
四、实验指导内容1．典型两列布局网页的逻辑结构。
2．使用CSS进行网页两列布局的方法。
3．float属性的取值及含义。
4．position属性的取值及含义。
5．CSS盒模型属性width，height，border，padding，margin等对网页布局的影响。
6．浏览器的兼容性。
实验六 CSS三列布局一、实验目的1．掌握典型三列布局网页的逻辑结构。
2．熟练掌握使用CSS进行网页三列布局的方法。
二、实验内容1．使用定位方法实现“index.html”网页的三列布局。
2．使用浮动方法实现“index.html”网页的三列布局。
三、实验准备以下文件上传至教师机1．网页范例文件：01.html，02.html。
2．图片素材。
3．实验指导书。
四、实验指导内容1．典型三列布局网页的逻辑结构。
2．使用CSS进行网页三列布局的方法。
3．float属性的取值及含义。
4．position属性的取值及含义。
5．CSS盒模型属性width，height，border，padding，margin等对网页布局的影响。
6．浏览器的兼容性。
实验七旅游类网站设计与制作一、实验目的应用网页设计与制作的知识和技能，独立设计并制作小型网站；培养学生综合运用所学知识解决实际问题的能力，为今后开展网站规划、设计和开发打下初步的基础。
二、实验内容1．确定网站主题。
2．网站风格设计。
3．网站栏目设计。
4．网站布局设计。
5．网站导航设计。
6．网站首页设计。
7．网站次级页面设计。
8．网站素材处理。
9．网站制作。
10．网站测试。
三、实验准备将实验指导书上传至教师机。
四、实验指导内容1．网站设计结构图。
2．网站首页设计图。
3．网站次级页面设计图。
4．XHTML文件的规范性。
5．CSS样式的实现方法。
6．设计说明书的写作方法。
5.作业设计本课程的作业以网页设计制作的案例为主，通过作业的完成使学生消化吸收课堂所学内容，进一步提高自己的动手能力。
具体内容及要求如下：第一次课：复习课上所讲的HTML的基础知识，自主熟悉Dreamweaver的界面及操作。
第二次课：复习Dreamweaver的基本操作，并完成简单的页面创建、操作、保存等练习。
第三次课：复习Dreamweaver中对文字、图片、音频、视频等媒体的操作。
第四次课：复习网页中的表格及框架等操作，利用表格实现对页面的布局。
第五次课：复习CSS的基本操作，利用CSS实现网页的初步布局。
第六次课：复习网页中的表单功能，在网页中添加交互功能。
第七次课、第八次课：进行旅游网页站页面的制作。
6.考核与成绩评定6.1考核方式及成绩评定6.2 考核评价的标准大纲撰写人：朱海澎课程组负责人：朱海澎专业负责人：郭弘2018年7月。