《网页设计与制作》教案解读Word文件下载.docx

1、课程编码总计：72 学时讲课：36 学时实训：学 分4类别必修课（ ） 选修课（ ） 理论课（ ） 实践课（ ）任课教师陈奋职称 讲师授课对象专业班级：11动漫、 共 个班基本教材和主要参考资料教材：参考资料：网页设计与制作案例教程 主编:陈承欢教学目的要求 教学目的：本课程是动漫专业的一门职业技术必修课，目的是使学生掌握有关网站建设的基本概念、创建网站的方法和步骤、重点掌握利用Dreamweaver软件来设计布局静态网页以及一些简单的JavaScript脚本语言、熟练掌握网页编写语言html，能够利用Dreamweaver来创建和设计一个网站，为以后学习Web动态网页的开发奠定基础。 教学要

2、求：通过本课程的学习，要求学生掌握网站的相关概念，创建网站的方法和步骤，掌握网页编写语言html，DW软件的使用。重点难点教学重点：网页编写语言html，如何利用DW来布局网页，层，行为，模板，库。教学难点：如何利用表格的布局模式以及框架进行布局，CSS样式，行为，模板。 网页设计与制作课程教案编制日期：2013 年 3 月 3 日授课时间第 一、二 周 课次2授课方式（请打）理论课 讨论课 实践课 习题课 其他课时安排8教学单元（教学章、节或主题）： Photoshop基本操作、网页与网站的概念。目的、要求（分了解、熟悉、掌握三个层次）：了解网页的基本概念、静态网页、动态网页、使用数据库的动

3、态网页。了解网站的概念、主题、名称、风格、结构、发布。掌握网页语言html。 知识要点： 网页和网站的基本概念，网页的分类，网页语言html技能要点： 要能够从网络上找出每一种类型的网页，能够利用html来编写简单网页教学步骤： 举例-讲解-课堂练习-讲评教具及教学手段：（如：举例讲解、多媒体讲解、模型讲解、实物讲解、挂图讲解、音像讲解等） 多媒体讲解、举例讲解、Internet网络。作业和思考题： 初步构想一个个人网站，包括网站名称、网站的栏目板块、网站的目录结构、链接结构，并预设网站的色彩搭配、网站的标准字体等。课后分析与小结： 通过学习，介绍了和网站相关的几个概念，从网站的整体规划出发，

4、综合网站的主题、结构、风格、布局等多个方面阐述网站的制作构思，以及如何使用DW发布网页，使学生基本上了解了构建网站的流程及网站有关的基础知识，为以下各章打基础。第 页教 学 内 容（含时间分配）板书或旁注 PS概述 PS面板的基本操作 PS选区、图层的操作 建立网站之前的一些准备工作 与网站有关的一些概念 网页的概念与分类 网站的概念、主题、风格、名称、结构 建立网站的过程 网站的整体规划 定位网站的主题和风格 构建出一个网站的目录框架和链接框架 发布网页 网页语言html第 三、四 周理论课 讨论课 实践课 习题课 其他 PS路径、通道、蒙版、DW基础。掌握建立本地站点的过程，DW的集成环境

5、，熟练使用对象面板与属性面板，掌握简单界面元素的编辑。通过实验，能够利用DW创建本地站点，制作几张含有简单界面元素的网页，并进行相关的链接。 熟悉DW的集成环境，简单界面元素的编辑，网页的链接。 能够利用DW创建本地站点，制作几张含有简单界面元素的网页，并进行相关的链接。 举例展示-小结-实验- 多媒体讲解、举例讲解。 教材P30P34 通过学习，学生掌握了建立本地站点的过程，DW的工作界面的组成，熟练使用对象面板与属性面板，简单的界面元素：文字、图像、Flash动画的编辑方法，区分了文件路径的三种表示方法，会懂得使用各种超级链接。 PS路径、通道和蒙版的使用 建立本地站点并管理站点 制作简单

6、的静态网页 使用对象面板在网页中插入文字、水平线、图像、Flash文件等简单的元素 熟练使用属性面板设置对象的属性 多种超链接的设置方法 利用页面属性设置页面的属性值实验1： 创建本地站点、整体控制页面 文本操作与图像操作第 五、六 周理论课 讨论课 实践课 习题课 其他 表格、框架和表单。 能够熟练利用表格、框架进行网页的布局，掌握表单的制作和验证。 熟练掌握利用表格的布局模式进行网页的布局，表单的操作。 表格布局模式的使用，表单的制作。 教材P131P135表格对于网站内容的定位是非常重要的。既可以利用表格来进行各种数据的设定，也可以进行文字区域及图像的定位，并利用布局视图来改变表格的布局

7、。应用框架来进行页面的优化，方便用户的浏览。通过制作表单来进行调查、订单、搜索界面等，完成数据的采集，同时要了解表单的处理。1 表格a） 创建表格b） 选择表格c） 设置表格、单元格属性d） 创建网站相册2 布局表格a） 绘制布局表格b） 设置布局表格、单元格属性c） 布局表格实例分析讲解3 框架a） 创建框架b） 保存框架c） 框架的选择、属性、链接的设置d） 框架实例分析讲解4 表单a） 创建表单b） 向表单添加对象c） 表单属性的设置与后台程序的链接d） 表单实例分析讲解实验2： 利用表格布局模式进行包含表单等网页元素的布局设计 利用框架进行网页的布局设计第 七、八 周理论课 讨论课 实

8、践课 习题课 其他 层、div布局 通过学习，学生要熟练掌握层的概念，层的常用具体的操作，包括层的创建、属性的设置、层的移动、排列、拖动、显示、隐藏，div布局。 层的概念，层的创建、属性的设置、层的移动、排列、拖动、显示、隐藏，div布局。 层的创建、属性的设置、层的移动、排列、拖动、显示、隐藏,层的精确定位，div布局。举例展示- 多媒体讲解、个别辅导。 教材P166P168层和div布局技术是DW的优势所在，一方面应该熟练地使用层技术来完成页面元素的精确定位，另一方面通过设置与层有关的行为来制作具有动态效果的网页，不但能增加制作网页的兴趣，还会增加做好网页的自信心。1 层的创建a） 创建

9、新层b） 创建嵌套层c） 熟悉层面板与属性面板2 层的基本操作a） 层的移动b） 调整层的大小c） 层的对齐、排列3 层的应用a） 拖动层b） 显示、隐藏层c） 层具体实例的分析讲解4 Div标签的使用实验3： 利用层制作拼图游戏 利用层制作动态显示的菜单 利用div技术来布局网页第 九、十 周 行为与时间轴 熟练掌握行为面板的使用方法，基本的行为操作，能利用时间轴创建沿路径运动的动画，利用行为与时间轴和层的结合来制作动态交互网页。 行为与时间轴的概念。 基本行为的操作，行为与时间轴和层的结合来制作动态交互网页。 多媒体讲解、举例讲解、个别辅导。 教材P211P212本章主要讲述了使用DW自带

10、的行为来建立动态交互网页的方法，时间轴动画的制作，以及把时间轴和行为、层结合起来制作更为复杂的动画，这部分知识对制作富有动感的网页很有帮助。1 行为a） 熟悉行为面板b） 添加行为c） 修改行为d） 行为常用的事件e） 应用行为i. 打开浏览器窗口ii. 播放声音iii. 弹出信息iv. 设置文本v. 转到URLvi. 检查插件vii. 控制多媒体动画viii. 显示弹出式菜单2 时间轴a） 熟悉时间轴面板b） 利用时间轴进行层的移动i. 直线移动的动画ii. 拖动路径制作曲线移动动画iii. 记录路径制作曲线移动动画c） 利用时间轴改变图像d） 添加时间轴行为实验4： 利用行为与时间轴制作富有动态的网页第 十一周1 多媒体对象 熟悉插入Flash和修改其属性的方法，了解插入和设置Flash视频、FlashPaper文档、文字和按钮方法。 熟悉插入Flash等多媒体对象和修改其属性的方法。 熟悉插入Flash等多媒体对象和修改其属性的方法