HTML网设计教案

1、HTM网页设计教案章节课题第一章HTML网页设计入门审阅者签名授课日期2007年9月4日 第一周 星期（二） 第12节授课时数2学时教学目的知识目标：了解HTML的发展历史，掌握网页设计原则。学会操作 DREAMWEAVER 8 学会结合Dreamweaver辅助编写HTML弋码。能力目标：培养学生们软件操作的技能、协作学习的能力以及应用所学知识解决实际问题的能力。品德目标：引发学生学习制作网页知识的兴趣，发展创新精神，培养实事求是，理 论与实际相结合的科学态度与科学精神。通过师生、生生互动，增进增强学生的自 主性和合作精神。教学方法多媒体教室，采用“演示式”教学法。教学重点掌握网页设计原则，

2、引发学习兴趣。教学难点1. DREAMWEAVER基本操作技能；2. 结合Dreamweaver辅助编写HTML弋码。教具、挂图见课前准备工作作业题号见教案：附加题教学过程及时间分配主要教学内容及步骤课刖 准 备 工 作图样图1 1:腾迅QC网站首页；图12:网址之家首页截图；图1 3: IBM蓝色巨人网站截图；图1 4:爱情交友网站首页截图；图1 5:儿童网站首页截图；图1 6:新浪网站首页截图。演 示 素 材1 第一章HTML网页设计入门PPT演示文稿，13页；2. HA012网站代码，1套。软件DREAMWEAVER 8绿色企业版，1套。HTML网页设计教案（续页）教学过程及时间分配教学

3、内容组织教学3分钟(一)创设情境, 引入课题10分钟(二)实例探究例15+8分钟师生致礼、点名、检查学生准备情况、使学生集中注意力上课。(组织教学贯彻于上课的始终)在实际生活中，我们常常会上网获取各种各样的信息，完成各种各样的工作， 上网展示在大家面前的是丰富多彩的网页，比如M H !hMH K* HA bB Ml M 可 iM M1 ip U* Mi atfAn ma n *.B1 Faj ka ”注意：(1) 网站与网页的概述(2) 网页的基本元素图1-1(3) 网页布局(4) 配色原贝0(5) HTML与渲染教师活动：利用多媒体展示实际网页，引导学生思考。教学意图：创设问题情境，激发学习

4、动机。例1.中国最成功的个人网站-hao123网址之家，在经过大家羡慕模仿复制 以后，为什么依然风采依旧，而且是独树一帜，hao123网址之家最好的亮点就是他的创意了，在他运作起来并且迅速被大家认可的时候，大量站点的模仿以及复 制其实是等于对他的运作模式的认可，对于这么个站点的结构内容以及程序方面， 大家都已经认为了他一点技术含量没有，但是为什么他就这样一直做的很好，而 别的网站倒的倒，改行的改行，那么“ hao123网址之家”他到底好在哪里？教师活动：启发诱导，师生互动，把实际问题转化为专业问题。学生活动：通过讨论、思考回答问题，把实际问题转化为思考专业问题。教学意图：通过具体网页发起问题探

5、究，掌握网页设计的原则。增强学生应 用专业知识的意识。乐ft 滋擡H出丸,_r7row珀阿m遇峠“ Pj. gllfUldr Tv申曲WK科 r-!Hmu丈屁戸F Et * FA F S3IHhKIPINidi餐方上 I4nL利 bIH卓鲨声JI4T4戸甲尚*4;Xjrikft.si文*卜遍甲华黑干网UCT.Ug阳群IH申国（人m in転 CEHwrtife0m 主于弭肖=*=WE-SrBdT Tft白庫宝即堆嚴2曙41叶认空nJ电曲2:可百paps叫 JBiiMpPH诚 IK崩常EH和n出弄K卞卡|*自到酣上石垓T2S3Cffi-fV=MKhl#担呂佢:TT丄P幌c+fr Hirli.feL

6、HBS喝imRi事枷， v111M 9日干图1- 2HTM网页设计教 案（续页）教学过程及时间分配教学内容条件变化5+5分钟实例讲解例2、例35+8分钟变化：hao123网址之家内容不变（1）如果hao123网址之家的网站浏览速度不够快？（2）如果网站里的连接打开后是一些错误连接或者没有品位的站点？（3）如果网站打开后广告在首页满天飞？教师活动：师：是否因为hao123网址之家的网页美观、内容丰富、实用就成功了呢？学生活动：学生积极思考、讨论得出结果教学意图：加深学生对网页设计原则的理解，加强学生应用专业知识的兴趣 和能力的培养。例2:网页色彩的搭配问题探究：（1）IBM （蓝色巨人）网站（2

7、）爱情交友网例3 :网页风格的设计问题探究:（1）儿童网站图1- 5（2）新浪网站教师活动：启发诱导，展示头际不同网页配色方案。及时点评，注意：不同 应用场合、不同人群。学生活动：学生分组讨论，交流互动。最后到讲台说思路。教学意图：通过实际问题的探究，及时巩固学生网页构思的能力。拓展学生 的思维空间，培养学生的创新意识和创新能力。HTMIB页设计教 案（续页）教学过程及时间分配教学内容(三)小结网页设计原则是：8分钟1.结构性；2.通用性；3.差异性；4.习惯性；5.适用性；6.反复 性；(四)、亠注意：操作技能教师活动：教师及时引导学生小结。练习一学生活动：学生及时整理出网页设计原则。练习二

8、教学意图：学生及时形成能力。10+5分钟练习一：DREAMWEAVER8(五)基本操作：归纳总结(1)安装与启动；8分钟(2) 文档使用；(3) 工作区结构(上)(下)；(4) 菜单概述(上)(下)；(5) 插入栏详解；(6) 面板组。练习二：操作技能建立HTML弋码文件(1) HTML概念；(2) 一个HTML勺示例。教师活动：启发诱导、构思、实际操作演示。注意：配色方案、风格问题； 软件操作的方法。学生活动：学生讨论，交流互动，发散探究。教学意图：通过软件实际操作，及时巩固专业技能。拓展学生的思维空间， 培养学生的动手能力。归纳总结：小结本节课的主要内容、主要思想方法和主要操作技能。1、掌

9、握网页设计原则，引发学习兴趣；2、掌握DREAMWEAVE作技能；3、本节课主要用了转化的思想、理论结合实际的思想。HTMIB页设计教 案(续页)教学过程及时间分配教学内容（六）课外作业5分钟课后反思5分钟教师活动：指导小结，激励评价，概括总结。学生活动：学生回忆本节内容，小结网页设计思想方法和解决问题的思路。教学意图：把本节知识纳入学生已有的认识结构中，有利于学生对设计思路 的有序储存和转化，培养学生的抽象思维能力。附加题课后作业（本周五3、4节前上交）：1. 简述网页、网站和主页的异同。2网页标准主要由哪三部分组成？分别解释其含义。3. 简述网站开发的工作流程。4. 常用的网页制作工具有哪

10、些？分别有哪些特点？课外练习：1、根据自己的兴趣、爱好、特点，构思一个个人网站的首页，并在草稿纸上 勾画出来。2、用DREAMVEAV制作一个简单的网页，题材自定，不要复制网上的。学生活动：学生看书学习，上机操作。教学意图：培养学生良好的看书习惯，培养自学能力，培养创新精神、增强 实践能力、拓展知识结构。师生交流，学生之间交流。教学意图：“前事不忘，后事之师”，教师上课也是如此，每一堂课都有得有失，只有及时了解了课堂上的成功和失误之处，才能扬长避短，不断取得新的进 步。通过师生之间的交流，教师了解到有哪些教学环节比较新颖，比较科学，学 生乐于接受；解决的问题中，有哪些学生比较满意，哪些问题还有更好的解决办 法；