《Dreamweaver网页设计》教案.docxVIP

1 第 1 章 网页设计基础 熟记站标、导航条、广告条、按钮等网页构成要素，以及 网页、网站、 IP 地址、域名、网址等概念；了解网页的本 教学目标与要求 质和网页的布局类型和 HTML 文档的基本结构，熟练掌握 网站建设的基本流程。 重点：站标、导航条、广告条、网页、网站、 IP 地址、域 教学重点 名、网址等概念，以及网站建设的流程 难点： IP 地址、域名、网址， HTML 文档的基本结构及其 教学难点 常见标签 教学方法 提问、启发、图示、情景教学、案例、课堂讨论 教学课时 2 课时 第 1 章 网页设计基础 教学 提示 导入课程：大家会输入文字、 制作和处理图像、 以提问的方式引入课程 设计动画，如何把这些作品放到 internet 中， 让更多的人去查阅和欣赏呢？ DW 就可以制 作网页。 网页的构成要素和组成元素 网页的构成要素：站标、导航条、广告条、  采用课堂讨论教学法，打开几个典型的网页让同学们讨论总结构成要素和组成元素。 标题栏和按钮； 网页的组成元素： 文字、图片、动画（ gif 、 flash ）、表单（交互功能）、音频、视频、 超链接、表格、框架、导航等。 网页相关知识简介基本概念： 网页的本质 网页、网站、主页、互联网  打开一个搜狐主页，保存成不同的类型，让大家看保存的效果，加深对网页本质的理解； 先打开一个网页的源文件，结合网络常识，详细讲解网页的定义，然后略讲网站和主页的概念。并提醒同学理解并记忆这些概念。 2 动态网页、静态网页 以注册和登录邮箱为例，对比讲解动 态网页和静态网页的特点和区别。 IP 地址、域名、网址（ url ）、浏览器 以平顶山学院和搜狐网站的 IP 地址 等概念 与域名为例，简要讲述这两个概念。 通过查看分析知名网站的网址引入 url 的定义和组成，其它概念略讲。 提醒学生理解并记忆上述概念。 网页布局 网页布局的相关概念 常见的布局类型 网站管理与网页制作相关软件制作和管理网页工具； 制作和优化网页图像工具； 制作网页动画工具； 其中 Dreamweaver、 fireworks 、 flash 这三个软件合称为网页“三  打开一网页（详细讲解网页布局效果的教程）让学生讨论、分析总结布局类型。 根据学生特点简要讲解 ps、 flash 、 fw 等软件在网页设计中的功能。 剑客”。 其他小工具软件。 HTML语言 HTML的概念 HTML文档的基本结构 几个常见的 html 标签： head、title 、style 、script meta、 body、 img、p、 font XHTML语言简介 脚本语言简介  打开搜狐主页的源代码，让学生认识一下 html 语言及其结构，然后分别用记事本和 dw 创建 2 个最简单的网页，让学生细看其源代码，并详细讲解 8 个基本标签及其结构关系，最后 html 、 根据时间酌情讲解其它几个常见标 、link 、 签。 等。 简要讲解这两个概念，然后创建一个网页，复制无缝循环的代码并粘贴到网页的 body 标签，让学生了解脚本语言的功能。 让学生欣赏插入后的效果，吸引学生 dw 的相关代码。 网页的设计理念和配色方案网页的设计理念 色彩的三要素 网页中的色彩心理与网页表现  结合上网的经验，让学生总结网页的设计理念。 色彩的三要素和心理表现学生在上 学期的 ps 课程中学习过，采用提问法，进行复习；然后打开几个典型网 3 色彩搭配应遵循的原则 网站的开发流程 网站需求分析 ② 设计制作网站页面 ③ 空间和域名申请 ④ 测试和发布网站 ⑤ 网站推广 第一阶段：网站需求分析 规划网站 准备素材 第二阶段：创建站点，设计制作各级页面 定义站点 设置页面属性 制作页面 第三阶段：申请空间和域名 第四阶段：测试和发布网站 第五阶段：网站推广 典型网站分析页面结构色彩运用  站，分析其配色方案，最后总结网页中色彩运用的原则。 根据设计的先后顺序和学生一起分析总结网站的开发流程，并用图加以解释，重点讲解网站的需求分析，以加深学生对重点知识的掌握。 采用课堂讨论教学法，打开几个典型的网页让同学们讨论总结网站的构成要素、组成元素、布局结构和配色方案。 作业布置： 察看并对比分析大型网站（如中国网、著名学校网、著名医院网、官 方网、科技网、娱乐休闲运动网、儿童网、 体育网、著名出版社网、 cctv 提问 网站、 sohu、 yahoo、IBM、微软等）的风格、色彩搭配与布局。 2 . 察看的同时下载自己需要的文章、图片、软件等资源。 ３. 课后习题。 小结：通过提问、启发、图示、情景教学、课堂讨论等教学方法的综合 运用，提高了学生的学习兴趣，从学生的反应看，授课效果很好。 4 2 章 Dreamweaver 基