网页设计与制作教案.docx

网页设计与制作课程教案 [ 章节名称 ] ：网页设计入门基础 [ 课堂类型 ] ：理论■ 实训□ 练习■ 测试□ [ 学时安排 ] ：2 课时 [ 目的要求 ] 了解网络的基本知识，网页设计的基础知识，网页的分类，动态网页的原理及技术 了解网页的基本构成及最简单的 html 代码 了解网页设计的流程 [ 重 点] 了解网页设计的流程，掌握最基本的网页的构成及最简单的网页 html 代码 [ 难 点] 掌握最基本的网页的构成及最简单的网页 html 代码 [ 教法学法 ] 采用教授法进行教学讲解，结合疑难点师生互动交流方式进行。 练习采用学生自主安排，教师给与个别辅导的方式进行。 [ 参考资料 ] Dreamweaver CS5网页设计与制作—— DIV+CSS版》 吴丰 , 丁欣 主编清华大学出版社 《动态网页制作教程》（第二版）刘梅彦 徐英慧 编著 清华大学出版社 [ 教学过程 ] 环节一：结合 PPT 课件的内容，讲解网络和网页的基本知识。了解网页的分类， 网页运行的原理，介绍网页设计的工具，动态网页的技术。 环节二：介绍网页的构成，并对一个网站进行实例分析说明。编写最简单的 html 代码。 环节三：了解网页设计的流程 主要有以下几个步骤： . 网站规划 二 . 素材资源收集 - 1 - 网页设计与制作课程教案 . 选择开发工具 四 . 站点建立与规划 五 . 分模块进行网页设计 六 . 网页源代码测试与特效添加 七 . 申请域名与空间 八 . 网页源代码上传 九 . 定期的维护 环节四： 对本节课的内容进行复习，让学生练习 html 的代码。并进行疑难解答 - 2 - 网页设计与制作课程教案 [ 章节名称 ] ：html 基础与应用 1 [ 课堂类型 ] ：理论■ 实训□ 练习■ 测试□ [ 学时安排 ] ：2 课时 [ 目的要求 ] 了解 html 语言的基础知识，结构，掌握 html 语言设置网页的背景音乐，背景图 片，字体的方法。 [ 重 点] Html 语言设置网页的背景音乐，图片，字体 [ 难 点] Html 语言设置网页的方法 [ 教法学法 ] 采用教授法进行教学讲解，结合疑难点师生互动交流方式进行。 练习采用学生自主安排，教师给与个别辅导的方式进行。 [ 参考资料 ] Dreamweaver CS5网页设计与制作—— DIV+CSS版》 吴丰 , 丁欣 主编清华大学出版社 《动态网页制作教程》（第二版）刘梅彦 徐英慧 编著 清华大学出版社 [ 教学过程 ] 环节一：复习网页设计的基础知识，介绍如何利用 Dreamweaver 开发工具，记事 本编辑网页的源程序，介绍网页站点的创建及注意事项。 环节二：讲解 html 语言的结构，特点，设置网页页面的背景音乐，图片，字体 设置背景颜色 body bgcolor=red 背景图片 body backgroud ＝bg9.gif 背景音乐 背景音乐和上边介绍的两个有很大的不同，它的代码是放在页面的头部 head/head里， bgsound src=background_sound.mid loop=-1 - 3 - 网页设计与制作课程教案 4. 标题字体 h# 文字 /h# # =1 ，2，3，4，5，6 比如： h1今天是星期三，今天天气晴，温度 15°-23 ° /h1 字体的大小，用于一般文字。 font size=# 文字 /font #=1, 2, 3, 4, 5, 6, 7 or +#, -# 例子： font size=7 今天天气真好！ /font 6. 字体颜色 指定颜色 font color=# 文字 /font # =#rrggbb 16 进制数码，或者是下 列预定义色彩： Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,Fuchsia, White, Green, Purple, Silver, Yellow, Aqua 7. 客户端字体 (Font Face) font face=#, #, ..., # ... /font #= 客户端可获得的字体， 什么是客户端，通俗的讲，就是你的电脑， face=# 就是从你的电脑 获得的字体 环节三：完成课堂讲解的练习例题，并疑难解答 环节四：复习本次课内容，步骤课后作业。 - 4 - 网页设计与制作课程教案 [ 章节名称 ] ：html 基础与应用 2 [ 课堂类型 ] ：理论■ 实训□ 练习■ 测试□ [ 学时安排 ] ：2 课时 [ 目的要求 ] 了解 html 语言的跑马灯效果标签的运用，序列卷标标签的运用 [ 重 点] Html 语言的跑马灯效果标签及序列卷标的应用 [ 难