HTML网页设计教案课程

《H T M L

网页设计》教案

列 1 号 共 5 页

《HTML网页设计》教案（续页）第 2 页

图1- 1

组织教学

3分钟

（一）

创设情境，

引入课题

10分钟

（二）

实例探究

例1

5+8分钟 师生致礼、点名、检查学生准备情况、使学生集中注意力上课。 （组织教学贯彻于上课的始终） 在实际生活中，我们常常会上网获取各种各样的信息，完成各种各样的工作，上网展示在大家面前的是丰富多彩的网页，比如…… 注意．．： （1） 网站与网页的概述．．．．．．．． （2） 网页的基本元素．．．．．．． （3） 网页布局．．．． （4） 配色原则．．．． （5） HTML ．．．．与渲染．．．

教师活动：利用多媒体展示实际网页，引导学生思考。 教学意图：创设问题情境，激发学习动机。

例1．中国最成功的个人网站--hao123网址之家，在经过大家羡慕模仿复制以后，为什么依然风采依旧，而且是独树一帜，hao123网址之家最好的亮点就是他的创意了，在他运作起来并且迅速被大家认可的时候，大量站点的模仿以及复制其实是等于对他的运作模式的认可，对于这么个站点的结构内容以及程序方面，大家都已经认为了他一点技术含量没有，但是为什么他就这样一直做的很好，而别的网站倒的倒，改行的改行，那么“hao123网址之家”他到底好在哪里？

教师活动：启发诱导，师生互动，把实际问题转化为专业问题。

学生活动：通过讨论、思考回答问题，把实际问题转化为思考专业问题。 教学意图：通过具体网页发起问题探究，掌握网页设计的原则。增强学生应用专业知识的意识。

《HTML 网页设计》教案（续页） 第 3 页

图1- 2

时间分配

教学内容

条件变化5+5分钟

实例讲解例2、例3 5+8分钟

变化：

hao123网址之家内容不变

（1）如果hao123网址之家的网站浏览速度不够快？

（2）如果网站里的连接打开后是一些错误连接或者没有品位的站点？

（3）如果网站打开后广告在首页满天飞？

教师活动：师：是否因为hao123网址之家的网页美观、内容丰富、实用就成功了呢？

学生活动：学生积极思考、讨论得出结果。

教学意图：加深学生对网页设计原则的理解，加强学生应用专业知识的兴趣和能力的培养。

例2：网页色彩的搭配问题探究：

（1）IBM（蓝色巨人）网站

（2）爱情交友网

例3：网页风格的设计问题探究：

（1）儿童网站

（2）新浪网站

教师活动：启发诱导，展示实际不同网页配色方案。及时点评，注意：不同应用场合、不同人群。

学生活动：学生分组讨论，交流互动。最后到讲台说思路。

教学意图：通过实际问题的探究，及时巩固学生网页构思的能力。拓展学生的思维空间，培养学生的创新意识和创新能力。

《HTML网页设计》教案（续页）第 4 页

图1- 3

图1- 4

图1- 5

图1- 6

《HTML网页设计》教案（续页）第 5 页