《网页设计》课程标准.docx
《《网页设计》课程标准.docx》由会员分享，可在线阅读，更多相关《《网页设计》课程标准.docx（20页珍藏版）》请在冰点文库上搜索。
《网页设计》课程标准
《网页设计》课程标准
课程名称：
《网页设计》
适用专业：
计算机网络技术
建议学时：
68
学分：
4
1.前言
1.1课程的性质
本课程是网络技术专业（网站设计方向）的专业核心课程，主要培养学生从事网页设计与制作的基本技能，使学生掌握网页设计的概念和方法，能够运用专业的网页设计工具和脚本语言，进行网站规划、建立和维护，具备网页设计岗位的职业技术能力。
在本课程之前，学生已学习了《计算机应用基础》、《Photoshop平面设计》等基础课程的，具备基本的计算机操作与图形图像制作能力，本课程的后续课程是《JSP动态网页设计》。
1.2设计思路
本课程的设计思路以就业为导向，按照基于工作过程的职业能力来进行课程开发，邀请企业行业网络专家对计算机网络专业所涵盖的岗位群进行工作任务和职业能力分析，以此为依据确定本课程的工作任务和课程内容，并参照行业职业标准，以任务引领为课程框架，将课程按递进方式设计成项目，并以项目为单元组织教学，使学生由浅入深，以点到面的全面掌握网页设计的职业技能。
同时开发教材，对教学过程的组织、教学条件、课程评价都进行了详细的设计，完成本课程的整体教学内容和教学实施的整体设计，建立了基于网页设计的课程标准。
2.课程目标
本课程以学生能够独立进行静态网站开发与维护的实际工作能力为学习目标，要求学生具备综合运用DHTML技术制作网页，规划、开发、发布管理静态网站的专业知识和技能，形成解决实际应用问题的方法能力，为以后的学习《JSP动态网页设计》课程打下基础。
（一）总体目标：
本课程培养学生综合运用DHTML技术制作网页，以及使用常用网页设计工具规划、开发、发布、管理静态网站的专业知识和技能，具备解决实际应用问题的方法能力，为以后的学习《JSP动态网页设计》课程打下基础。
（二）具体目标如下：
．能处理网页图形图像素材
．能规划、创建、发布、维护静态网站
．能运用javascript控制网页行为
．能运用多种布局技术制作网页布局
．能灵活运用css技术规范、美化网页内容
．能跟踪和学习并应用网页设计与制作的新知识和新技术
3.课程内容设计
经过与通易公司、新软公司和ATA公司设计师的共同讨论，以真实工作项目为依据，对项目进行功能分解、归纳，提取工作任务，分析工作任务所涉及的相关知识，设计一系列能力要求不断提升的进阶式学习任务，以学习任务为教学单元组织课程教学，将网页各类语言的应用融入到各学习情境中，模拟网站开发流程，设计以训练学生为主、教师指导为辅的基于工作过程教学活动，培养学生岗位职业技能应用及自主学习能力，从而构建该课程的教学内容。
。
《网页设计》课程教学内容设计如下表所示。
（一）总体设计
序号
任务名称
知识要点
技能目标
课时
1
制作图文混排网页
Ø常见网页设计工具的使用
ØHTML文档基本结构
Ø文本排版控制标记符
Ø图像插入标记符
Ø特殊字符
Øcss的意义、创建与使用方法
Ø安装与启用网页制作软件
Ø熟悉网页制作的基本步骤
Ø正确插入文本与特殊字符
Ø正确对文本进行分段分行
Ø正确插入图像
Ø运用css技术控制文字图片样式
4
2
制作个人简历网页
Ø有序列表标记符
Ø无序列表标记符
Ø表格标记符
Ø超链接标记符
ØCss技术对列表的控制方法
Ø制作有序列表、无序列表
Ø制作混合列表
Ø运用超链接启动电子邮箱链接
Ø.运用表格进行简单页面排版
Ø运用css技术设置列表显示方式
4
3
制作电子相册网页
Ø网页图像素材的特点与主要类型
ØFireworks对图片进行批处理的方法
Ø电子相册排版要点
Ø图像、表格、超链接标记符的相关属性
ØCss技术的滤镜使用方法
Ø熟悉网页图像素材的特点与类型
Ø掌握Fireworks的基本操作方法
Ø了解并掌握网页图片处理的主要方法
Ø熟知图像、表格、超链接标记符的属性
Ø运用css滤镜技术美化图片效果
6
4
制作唐诗欣赏网站
Ø本地网站的创建与发布
ØIIS的安装与设置方法
Ø网站的规划与制作流程
Ø框架技术进行网页布局的方法
Ø超链接标记符在框架技术中的作用
Ø锚点链接技术
Ø网站LOGO的制作方法
Ø制作网站flashbanner的方法
Ø多媒体素材网页的制作方法
Ø个人网站的规划与制作流程
Ø正确创建、设置、发布本地网站
Ø正确安装、设置与管理IIS
Ø运用框架技术进行网页布局
Ø锚点技术在长版面网页中的应用
Ø运用图像设计软件制作LOGO
Ø运用flash制作具有动态效果的banner
Ø掌握向网页插入动画、视频等多媒体素材的方法
Ø熟悉css控制超链接样式的方法
10
5
制作个人网站
Ø个人网站的规划方法与制作特点
Ø运用图形制作工具绘制网页布局
ØFireworks切片并导出网页的方法
ØDreamweaver布局切片网页的方法
Ø页内框架技术布局网页的方法
Ø动态导航条的制作方法
Øcss进行样式规范与美化网页的方法
Ø了解个人网站的制作方法与特点
Ø设计并绘制网页布局图
Ø应用切片技术设计网页布局结构
Ø运用Dreamweaver优化切片网页
Ø运用页内框架技术实现网站超链接
Ø掌握制作动态导航条的方法
Ø运用css对网页进行样式规范与美化
10
6
制作用户注册网页
Ø表单与表单元素的相关标记符
Ø表单与表单元素的作用
Ø表格布局表单元素
Øcss对表格、表单元素的控制方法
ØDreamweaver检验表单行为的应用
Ø以电子邮件方式提交表单的方法
Ø熟悉表单及表单元素的设置方法
Ø掌握表格布局表单元素的方法
Ø运用css对表格、表单元素进行规范与美化
Ø掌握Dreamweaver验证表单的方法
Ø掌握电子邮件形式提交表单的方法
4
7
制作智能显示效果的网页
ØJavascript基本语法知识
ØJavascript语句嵌入到html的方法
Ø表单元素调用Javascript语句的方法
ØJavascript函数的调用方法
Ø时间对象的使用方法
Ø浏览器对象的控制方法
Ø熟悉javascript语法知识
Ø掌握在html中调用javascript代码的方法
Ø熟悉调用javascript的事件
Ø控制与使用时间对象、浏览器对象
6
8
制作订单网页
ØJavascript判断、循环等语句的语法知识
Ø创建与调用Javascript自定义函数的方法
Ø数组对象的控制与使用方法
Ø字符对象的控制与使用方法
Ø文档对象的控制与使用方法
Ø灵活运用Javascript分支与循环语句
Ø掌握Javascript自定义函数的方法
Ø掌握数组对象、字符对象、文档对象的控制与使用方法
Ø综合运用javascript、html、css技术
6
9
制作在线考试网页
ØJavascript对表单元素的访问与控制方法
Ø定时器的使用方法
ØDHTML技术的综合应用方法
Ø掌握Javascript访问与控制表单元素的方法
Ø灵活设置与取消定时器
Ø运用DHTML处理页面的能力
6
10
制作数码产品门户网站
Ø门户网站的设计、规划与制作流程
Ø网站创建、发布、维护管理的方法
ØDiv+css布局网页的方法
Ø创建子菜单的方法
ØDhtml技术
ØDreamweaver的高级应用技术
Ø熟悉运用div+css技术设计网页
Ø掌握Dreamweaver创建与运用divAp的方法
Ø掌握运用Dreamweaver时间轴功能制作网页漂移元素的方法
Ø掌握Dreamweaver行为面板的使用方法
Ø灵活应用DHTML增加网页特效
12
整个课程通过10个技术难度渐进式的工作过程为向导，以典型工作任务为基点，设计综合理论知识、操作技能和职业素养为一体教学单元活动。
用任务驱动教学的各个环节。
边做边学，带动相关知识点，使学生通过完成工作任务教学单元的学习，不但能够掌握网页制作与网站设计的专业知识和专业技能，还能够全面培养其团队协作、沟通表达、工作责任心、职业道德与规范等综合素质，学生通过学习的过程掌握工作岗位所需要的各项技能和相关专业知识。
（二）课程单元内容
任务名称
一、制作图文并茂的网页
参考课时
2
知识要点
Ø常见网页设计工具的使用
ØHTML文档基本结构
Ø文本排版控制标记符
Ø图像插入标记符
Ø特殊字符以及物理显示标记符
Øcss的意义、创建与使用方法
技能目标
Ø安装和启动网页制作软件
Ø熟悉网页制作的基本步骤
Ø正确插入文本与特殊字符
Ø正确对文本进行分段分行
Ø正确插入图像
Ø运用css技术控制文字图片样式
任务驱动工作过程
1
安装、启动与认识常用的网页制作工具
2
制作一个基本结构完整、内容空白的HTML文档
3
设置HTML文档的基本属性
4
向HTML文档中添加文本信息，并运用相关标记符号进行排版
5
向HTML文档插入图片，并运用相关标记符号进行图文混排
6
为网页的基本属性、文字的样式建立并应用相关css类型，规范样式美化页面
拓展
任务
1
给定文本内容与素材，制作一个图文并茂的网页
2
给定主题，自行组织与制作素材，制作一个图文并茂的网页
任务名称
二、制作个人简历网页
参考课时
4
知识要点
Ø有序列表标记符
Ø无序列表标记符
Ø表格标记符
Ø超链接标记符
ØCss技术对列表的控制方法
技能目标
Ø制作有序列表、无序列表
Ø制作混合列表
Ø运用超链接标记符启动电子邮箱链接
Ø运用表格进行简单页面排版
Ø运用css技术设置列表显示方式
简单任务活动安排
序号
任务名称
说明
1
制作一个包含有序列表、无序列表的网页
应用ULOL标记符
2
制作一个包含混合列表的网页
嵌套应用ULOL标记符
3
制作一个显示课程表的网页
应用TABLE标记符
4
制作一个将以上链接以上网页的网页
应用A标记符
5
制作个人简历网页
给出布局供学生参考，分析制作过程，给出指引后学生自行完成
任务工作过程指导
（1）
表格布局页面
（2）
对表格中的单元格进行合并、拆分，完成页面主体格局
（3）
在相应单元格中插入相关信息，完成简历信息制作
（4）
电子邮箱启动的制作
任务名称
三、制作电子相册网页
参考课时
6
知识要点
Ø网页图像素材的特点与主要类型
ØFireworks对图片进行批处理的方法
Ø电子相册排版要点
Ø图像、表格、超链接标记符的相关属性
ØCss技术的滤镜使用方法
技能目标
Ø熟悉网页图像素材的特点与类型
Ø掌握Fireworks的基本操作方法
Ø了解并掌握网页图片处理的主要方法
Ø熟知图像、表格、超链接标记符的属性
Ø运用css滤镜技术美化图片效果
任务驱动工作过程
1
规划与设计网页的风格与布局结构
2
运用Fireworks制作具有艺术效果的网页文字标题
3
运用Fireworks对相册素材图片的大小、版面样式、色彩等进行批处理，并导出结果
4
利用表格对网页进行基本布局
5
创建css文件，设置文字与图片格式，特别是为图片设置美化的滤镜效果
6
向布局表格的单元格中插入相应的图片素材和文字说明，并应用css样式
7
为图片素材和文字设置相关超链接
拓展
任务
任务名称
四、制作唐诗欣赏网站
参考课时
10
知识要点
Ø本地网站的创建与发布
ØIIS的安装与设置方法
Ø网站的规划与制作流程
Ø框架技术进行网页布局的方法
Ø超链接标记符在框架技术中的作用
Ø锚点链接技术
Ø网站LOGO的制作方法
Ø制作网站flashbanner的方法
Ø多媒体素材网页的制作方法
技能目标
Ø正确创建、设置、发布本地网站
Ø正确安装、设置与管理IIS
Ø运用框架技术进行网页布局
Ø锚点技术在长版面网页中的应用
Ø运用图像设计软件制作LOGO
Ø运用flash制作具有动态效果的banner
Ø掌握向网页插入动画、视频等多媒体素材的方法
Ø熟悉css控制超链接样式的方法
任务驱动工作过程
1
规划网站的模块（可按作者划分模块）、首页布局结构（左上下结构）
2
素材准备：
设计并制作网站LOGO、flashBanner及相关多媒体素材
3
创建相关文件夹，在Dreamweaver创建本地站点，在IIS做相关设置
4
运用锚点技术创建长版面子模块网页，并运用css技术实现图文并茂的效果
5
创建页面，插入LOGO、标题并设置超链接源及目的窗口，形成导航条效果
6
创建页面，插入相关flashBanne
7
创建页面，内容为图文并茂的网站主题简介，作为首页主框架的内容
8
创建首页，运用框架集布局页面，插入相关的框架页面，完成相关超链接
9
发布与调试网站
任务名称
五、制作个人网站
参考课时
10
知识要点
Ø个人网站的规划方法与制作特点
Ø运用图形制作工具设计绘制网页布局
ØFireworks执行切片并导出网页的方法
ØDreamweaver布局切片网页的方法
Ø页内框架技术在网页布局中的应用方法
Ø动态导航条的制作方法
Øcss对网页进行样式规范与美化的方法
技能目标
Ø了解个人网站的制作方法与特点
Ø设计并绘制网页布局图
Ø应用切片技术设计网页布局结构
Ø运用Dreamweaver优化切片网页
Ø运用页内框架技术实现网站超链接
Ø掌握制作动态导航条的方法
Ø运用css对网页进行样式规范与美化
任务驱动工作过程
1
规划个人网站的模块内容（基本模块为：
自我介绍、个人爱好、个人相册、文章）、首页布局结构（上左右结构）
2
设计并绘制网站首页布局图
3
在Fireworks中对布局图进行切片操作，并导出文件夹
4
在Dreamweaver创建本地站点，在IIS做相关设置
5
素材准备：
动态导航条及相关多媒体素材
6
创建css文件，在Dreamweaver设置并优化切片网页，创建页内框架标记符
7
创建并制作“自我介绍”、“个人爱好”、“相册”、“文章”等子模块页面及相关css
8
建立超链接，完成网站
拓展任务
运用切片技术，由全球300强企业网站首页的截图，设计并制作首页、二级子页样式
任务名称
六、制作用户注册网页
参考课时
4
知识要点
Ø表单与表单元素的相关标记符
Ø表单与表单元素的作用
Ø表格布局表单元素
Øcss对表格、表单元素的控制方法
ØDreamweaver检验表单行为的应用
Ø以电子邮件方式提交表单的方法
技能目标
Ø熟悉表单及表单元素的设置方法
Ø掌握表格布局表单元素的方法
Ø运用css对表格、表单元素进行规范与美化
Ø掌握Dreamweaver验证表单的方法
Ø掌握电子邮件形式提交表单的方法
任务驱动工作过程
1
创建页面，插入表单标记符，将表单行为设置为电子邮件提交
2
在表单中插入表格，并创建相应的css样式对表格格式进行控制
3
在表格的单元格中插入表单元素，并创建相应的css样式对表单格式进行控制
4
通过Dreamweaver的行为面板设置单击提交按钮的行为
5
测试网页，验证设计结果
任务名称
七、制作智能显示效果的网页
参考课时
6
知识要点
ØJavascript基本语法知识
ØJavascript语句嵌入到html的方法
Ø表单元素调用Javascript语句的方法
ØJavascript函数的调用方法
Ø时间对象的使用方法
Ø浏览器对象的控制方法
技能目标
Ø熟悉javascript语法知识
Ø掌握在html中调用javascript代码的方法
Ø熟悉调用javascript的事件
Ø控制与使用时间对象、浏览器对象
简单任务活动安排
序号
任务名称
说明
1
制作一个能够输入并记载用户信息的网页
prompt（）函数的调用
2
制作一个具有显示当前时间功能的网页
时间对象的使用
3
制作一个可以更改网页背景颜色的网页
文档对象
4
制作一个可以设置浏览器状态栏信息的网页
浏览器对象
5
制作一个根据具有智能显示效果的网页
给出案例供学生参考，分析制作过程，给出指引并鼓励学生添加智能效果，学生自行完成
任务工作过程指导
（1）
根据用户的访问时间设置相应的问候语
（2）
根据用户的喜好设置网页背景与字体颜色
（3）
状态栏中显示用户当前的操作行为
（4）
具有设置为默认页面、添加到收藏夹等功能
任务名称
八、制作订单网页
参考课时
6
知识要点
ØJavascript判断、循环等语句的语法知识
Ø创建与调用Javascript自定义函数的方法
Ø数组对象的控制与使用方法
Ø字符对象的控制与使用方法
Ø文档对象的控制与使用方法
技能目标
Ø灵活运用Javascript分支与循环语句
Ø掌握Javascript自定义函数的方法
Ø掌握数组对象、字符对象、文档对象的控制与使用方法
Ø综合运用javascript、html、css技术
简单任务活动安排
序号
任务名称
说明
1
制作一个能记录并输出一组用户登记信息的网页
prompt（）+数组+文档对象
2
在以上任务增加功能：
用户可以控制体中止输入信息
判断语句的使用
3
在以上任务增加功能：
美化用户的输出信息
css
5
制作订单网页
给出案例供学生参考，分析制作过程，给出指引并鼓励学生从界面友好、操作方便等方面增加网页功能，学生自行完成
任务工作过程指导
（1）
能列出商品的名称及单价供用户选择
（2）
用户可以在选择商品的同时输入数量
（3）
根据用户输入的信息输出订单，包括商品名称、数量、单价，以及总的金额
（4）
用户确认订单后，信息以邮件的方式提交
任务名称
九、制作在线考试网页
参考课时
6
知识要点
ØJavascript对表单元素的访问与控制方法
Ø定时器的使用方法
ØDHTML技术的综合应用方法
技能目标
Ø掌握Javascript访问与控制表单元素的方法
Ø灵活设置与取消定时器
Ø运用DHTML处理页面的能力
简单任务活动安排
序号
任务名称
说明
1
制作一个具有单选及复选按钮的网页
表单设计
2
在以上任务增加功能：
记载用户的选择信息，并输出
访问表单、数组对象、alert（）
3
在以上任务增加功能：
一定时间内浏览器自动关闭
定时器、浏览器对象
4
在以上任务增加功能：
将信息输出在新浏览器窗口中
文档对象、浏览器对象
5
制作在线考试网页
向演示案例效果，提示学生存在几个问题：
成绩最后的提交方式、若自动关闭后成绩如何算、等等，鼓励学生进一步完善
任务工作过程指导
（1）
登记并显示用户登陆信息，并显示倒计时时间
（2）
以单选、多选按钮的形式显示题目
（3）
用户按提交按钮后，弹出新窗口显示考试结果：
正确答案、用户答案、题目得分、总得分
（4）
在时限内若未按提交按钮，则考试窗口自动关闭
任务名称
十、制作数码产品门户网站
参考课时
12
知识要点
Ø门户网站的设计、规划与制作流程
Ø网站创建、发布、维护管理的方法
ØDiv+css布局网页的方法
Ø创建子菜单的方法
ØDhtml技术
ØDreamweaver的高级应用技术
技能目标
Ø熟悉运用div+css技术设计网页
Ø掌握Dreamweaver创建与运用divAp的方法
Ø掌握运用Dreamweaver时间轴功能制作网页漂移元素的方法
Ø掌握Dreamweaver行为面板的使用方法
Ø灵活应用DHTML增加网页特效
任务工作过程指导
1
根据主题规划与设计网站功能模块、风格
学生完成作品后，以小组的方式演示答辩，成绩为学生小组互评*0.5+教师评分*0.5
2
做出网站一级页面、二级页面的草稿图
3
以上工作经老师认可后，开始进行网站的开发
4.实施建议
4.1教材编写
1.需依据本课程标准编写教材，教材应充分体现基于工作过程项目课程的设计思想，突出职业能力培养的思路。
2.学习项目按照学习情境的要求设计，项目中所要学习的工作任务可以是交叉与重复的。
3.教材的各项目通常应包括以下几项内容：
（1）教学目标；
（2）工作任务；（3）实践操作（相关实践知识）；（4）问题探究（相关理论知识）；（5）知识拓展（选学内容）；（6）英语词汇索引和解释；（7）实训与练习。
4.工作任务通常应包括以下内容：
（1）工作任务名称；
（2）工作任务背景；（3）项目训练载体；（4）技能训练目标；（5）学习环境要求。
5.教材中的活动设计的内容要具体，并具有可操作性。
6.教材内容应体现先进性、通用性、实用性，将当前最新的基于windows的网络服务产品纳入教材，使教材紧跟行业和技术发展。
7.教材应图文并茂，引用图表要清晰精美；语言表述应深入浅出、文字精练，并力求形成一种灵活、亲切、活泼的语体风格。
从而增加教材的可读性，增强教材对学生的吸引力。
8.教材应由学校教师与软件企业工程师共同编写。
4.2教学建议
1、案例教学
引入企业的工程项目，作为典型案例，紧扣课程应解决的理论和实际问题，对案例的过程进行详细的分析、解剖、总结。
教学过程中由老师讲解案例操作步骤和相关知识，然后由学生仿照老师的演示实现服务器架构。
通过对老师操作视频的观看，提高了同学们对知识点的应用的理解，有助于提高学生的学习兴趣力，掌握相应岗位技能。
2、讲练结合
对基础知识精心讲解，并配合课堂练习，加强了师生的及时交流，便于发现问题、解决问题，也便于对基本知识的牢固掌握。
在每一次授课过程中，教师先阐述本章项目驱动部分的任务，然后针对提出的任务，精心讲解本章节的知识点，最后教师现场演示，解决问题，完成任务。
在现场演示过程中，教师指导学生进行练习，完成部分功能的实现。
通过讲练结合，达到了举一反三，灵活应用的目的。
3、课堂演示
教师为每一章内容精心制作了具有动态效果的幻灯片，以及便于对理论知识理解的实例代码，随堂演示，条理清晰，并在开发环境中演示实例运行效果。
在上新课前，对上节课的知识要点进行回顾、讲述本节课的目标及重点、难点，知识点讲解过程中，通过幻灯片动画将知识点和问题逐一引入，充分激发学生学习的积极性。
升级会员 