《网页设计与制作》课程教案

教材P261-264
课后分析与小结：
本章介绍如何在网页中插入多媒体对象，因为这类文件可以把声音、图像结合在一起，其界面动感十足，所以在网上非常流行。在网页上不仅是插入这些对象，而且要保证相应的文件能够正常播放，学会安装各种各样的插件能丰富网页的内容。
第 页
教 学 内 容（含时间分配）
板书或旁注
1．Flash的使用
教具及教学手段：（如：举例讲解、多媒体讲解、模型讲解、实物讲解、挂图讲解、音像讲解等）
多媒体讲解、举例讲解。
作业和思考题：
教材P131~P135
课后分析与小结：
表格对于网站内容的定位是非常重要的。既可以利用表格来进行各种数据的设定，也可以进行文字区域及图像的定位，并利用布局视图来改变表格的布局。应用框架来进行页面的优化，方便用户的浏览。通过制作表单来进行调查、订单、搜索界面等，完成数据的采集，同时要了解表单的处理。
第 页
教 学 内 容（含时间分配）
板书或旁注
1．模板
a)熟悉资源面板
b)创建模板
c)编辑模板
d)创建可编辑区域
e)重复区域
f)模板的应用
g)模板应用实例分析与讲解
2．库
a)创建库
b)在文档中插入库项目
c)编辑库项目
d)库项目应用实例分析与讲解
实验5：
利用模板和库制作网站
授课时间
第 十四、十五 周
课次
2
授课方式
（请打√）
理论课√□ 讨论课□ 实践课√□ 习题课□ 其他□
课时
安排
8
教学单元（教学章、节或主题）：
CSS样式、div+css布局
目的、要求（分了解、熟悉、掌握三个层次）：
掌握创建CSS样式表，熟练掌握CSS样式的属性项目设置方法，在文档中如何应用样式表，会管理样式表，div+css布局模式。
讲课：36 学时
实训：36 学时
学 分
4
类别
必修课（ √ ） 选修课（ ） 理论课（ √ ） 实践课（ √ ）
任课
教师
陈奋
职称
讲师
授课
对象
专业班级：11动漫Ａ、Ｂ 共 ２ 个班
基本
教材
和主
要参
考资
料
教材：网页设计与制作案例教程
主编：九州书源
清华大学出版社
参考资料：网页设计与制作案例教程 主编:陈承欢
第 页
教 学 内 容（含时间分配）
板书或旁注
1．层的创建
a)创建新层
b)创建嵌套层
c)熟悉层面板与属性面板
2．层的基本操作
a)层的移动
b)调整层的大小
c)层的对齐、排列
3．层的应用
a)拖动层
b)显示、隐藏层
c)层具体实例的分析讲解
4．Div标签的使用
实验3：
利用层制作拼图游戏
利用层制作动态显示的菜单
编制日期：2013 年 3 月 3 日
授课时间
第 一、二 周
课次
2
授课方式
（请打√）
理论课√□ 讨论课□ 实践课□ 习题课□ 其他□
课时
安排
8
教学单元（教学章、节或主题）：
Photoshop基本操作、网页与网站的概念。
目的、要求（分了解、熟悉、掌握三个层次）：
了解网页的基本概念、静态网页、动态网页、使用数据库的动态网页。
第 页
教 学 内 容（含时间分配）
板书或旁注
PS概述
PS面板的基本操作
PS选区、图层的操作
建立网站之前的一些准备工作
与网站有关的一些概念
网页的概念与分类
网站的概念、主题、风格、名称、结构
建立网站的过程
网站的整体规划
定位网站的主题和风格
构建出一个网站的目录框架和链接框架
发布网页
网页语言html
授课时间
教 案
2012 ～ 2013 学年第 二 学期
学部
工程技术学部
教研室(实验室)
动漫
课 程 名 称网页设计与来自作授 课 班 级11动漫
主 讲 教 师
职 称
讲师
使 用 教 材
网页设计与制作案例教程
主编：九州书源
清华大学出版社
教 案（首页）
至12-13学年第二学期
课程
名称
网页设计与制作
课程编码
总计：72 学时
利用div技术来布局网页
授课时间
第 九、十 周
课次
2
授课方式
（请打√）
理论课√□ 讨论课□ 实践课□ 习题课√□ 其他□
课时
安排
8
教学单元（教学章、节或主题）：
行为与时间轴
目的、要求（分了解、熟悉、掌握三个层次）：
熟练掌握行为面板的使用方法，基本的行为操作，能利用时间轴创建沿路径运动的动画，利用行为与时间轴和层的结合来制作动态交互网页。
课时
安排
8
教学单元（教学章、节或主题）：
表格、框架和表单。
目的、要求（分了解、熟悉、掌握三个层次）：
能够熟练利用表格、框架进行网页的布局，掌握表单的制作和验证。
知识要点：
熟练掌握利用表格的布局模式进行网页的布局，表单的操作。
技能要点：
表格布局模式的使用，表单的制作。
教学步骤：
举例展示->讲解->小结->实验->讲评
第 页
教 学 内 容（含时间分配）
板书或旁注
1．表格
a)创建表格
b)选择表格
c)设置表格、单元格属性
d)创建网站相册
2．布局表格
a)绘制布局表格
b)设置布局表格、单元格属性
c)布局表格实例分析讲解
3．框架
a)创建框架
b)保存框架
c)框架的选择、属性、链接的设置
d)框架实例分析讲解
4．表单
a)创建表单
b)向表单添加对象
c)表单属性的设置与后台程序的链接
d)表单实例分析讲解
实验2：
利用表格布局模式进行包含表单等网页元素的布局设计
利用框架进行网页的布局设计
授课时间
第 七、八 周
课次
2
授课方式
（请打√）
理论课□ 讨论课□ 实践课√□ 习题课√□ 其他□
课时
安排
8
教学单元（教学章、节或主题）：
层、div布局
教学
目的
要求
教学目的：本课程是动漫专业的一门职业技术必修课，目的是使学生掌握有关网站建设的基本概念、创建网站的方法和步骤、重点掌握利用Dreamweaver软件来设计布局静态网页以及一些简单的JavaScript脚本语言、熟练掌握网页编写语言html，能够利用Dreamweaver来创建和设计一个网站，为以后学习Web动态网页的开发奠定基础。
知识要点：
模板和库。
技能要点：
模板和库的使用
教学步骤：
举例展示->讲解->小结->实验->讲评
教具及教学手段：（如：举例讲解、多媒体讲解、模型讲解、实物讲解、挂图讲解、音像讲解等）
多媒体讲解、举例讲解、个别辅导。
作业和思考题：
教材P278-279
课后分析与小结：
建设网站时，可以在网页中综合应用模板和库的相关知识，即把库放到模板中，让模板和库项目联合来更新网站。使用这种方法可以更好地维护网页，有利于减轻网站设计中的重复工作量。
教学要求：通过本课程的学习，要求学生掌握网站的相关概念，创建网站的方法和步骤，掌握网页编写语言html，DW软件的使用。
教学
重点
难点
教学重点：网页编写语言html，如何利用DW来布局网页，层，行为，模板，库。
教学难点：如何利用表格的布局模式以及框架进行布局，CSS样式，行为，模板。
《网页设计与制作》课程教案
教学步骤：
举例展示->讲解->小结->实验->讲评
教具及教学手段：（如：举例讲解、多媒体讲解、模型讲解、实物讲解、挂图讲解、音像讲解等）
多媒体讲解、个别辅导。
作业和思考题：
教材P166~P168
课后分析与小结：
层和div布局技术是DW的优势所在，一方面应该熟练地使用层技术来完成页面元素的精确定位，另一方面通过设置与层有关的行为来制作具有动态效果的网页，不但能增加制作网页的兴趣，还会增加做好网页的自信心。
知识要点：
行为与时间轴的概念。
技能要点：
基本行为的操作，行为与时间轴和层的结合来制作动态交互网页。
教学步骤：
举例展示->讲解->小结->实验->讲评
教具及教学手段：（如：举例讲解、多媒体讲解、模型讲解、实物讲解、挂图讲解、音像讲解等）
多媒体讲解、举例讲解、个别辅导。
作业和思考题：
教材P211~P212
目的、要求（分了解、熟悉、掌握三个层次）：
通过学习，学生要熟练掌握层的概念，层的常用具体的操作，包括层的创建、属性的设置、层的移动、排列、拖动、显示、隐藏，div布局。
知识要点：
层的概念，层的创建、属性的设置、层的移动、排列、拖动、显示、隐藏，div布局。
技能要点：
层的创建、属性的设置、层的移动、排列、拖动、显示、隐藏,层的精确定位，div布局。
建立本地站点并管理站点
制作简单的静态网页
使用对象面板在网页中插入文字、水平线、图像、Flash文件等简单的元素
熟练使用属性面板设置对象的属性
多种超链接的设置方法
利用页面属性设置页面的属性值
实验1：
创建本地站点、整体控制页面
文本操作与图像操作
授课时间
第 五、六 周
课次