动态HTML让网页更生动!_第1页
动态HTML让网页更生动!_第2页
动态HTML让网页更生动!_第3页
动态HTML让网页更生动!_第4页
动态HTML让网页更生动!_第5页
已阅读5页,还剩8页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、动态html,让网页更生动!一、 教学内容分析教育科学出版社网络与技术应用(选修)第五章是对动态网页制作的系统介绍。作为动态网页的重要组成部分,动态html是本章知识的一个重点。利用动态html在网页中制作出动态效果,是学生比较感兴趣的学习内容。对于高中学生,需要了解动态html的特点,掌握制作动态html的方法,并加以运用。二、 学情分析作为四星级高中的高一学生,具备一定的自主学习能力,经过第四章建立主题网站的学习,对网页的制作已有一定的基础,对frontpage2000的操作也比较熟练,对网页的美化普遍很感兴趣。在本节课之前,对“html基本结构”这一知识点有基本的认识。三、 教学目标分析

2、知识与技能:1. 了解动态html,实现简单的动态html效果;2. 能够在适当位置复用javascript代码,并对代码适当修改;过程与方法: 根据网页的性质、特点选择适当的网页特效;情感态度与价值观:体验成功的喜悦,激发对网页制作的兴趣。四、 教学重点1. 了解动态html的特点;2. javascript代码的结构及使用方法;3. 根据需要修改javascript代码。五、 教学难点1. 复用javascript代码,并根据需要修改代码;2. 根据网页性质、特点制作恰当的特效。六、 教学方法与策略教学方法:任务驱动、演示法、自主探究教学策略:本节课采用任务驱动为主体的教学模式,设计了4个

3、任务,通过任务1,让学生认识动态html;通过任务2,让学生了解实现动态html的工具之一javascript;通过任务3,让学生理解javascript 的使用;通过任务4,让学生根据实际情况综合运用动态html。在任务的驱动下,依托moodle平台,以学生自主探究为主,培养学生动手操作的能力,在实践过程中,充分理解并运用知识点,激发学生的学习兴趣,提高学生的信息素养。七、 教学课时:2课时八、 教学过程:教学环节教师活动学生活动设计意图情景引入对比两张网页,分析动态效果,指出为页面增色的元素:动态html观察两张网页,指出第二张页面中的各种特效通过网页特效,引出课题,激发学生兴趣探究新知一

4、、动态html1. 什么是动态html?提出问题1:如何在网页中实现动态html效果?请学生自学知识点,尝试任务1。请学生展示各自完成的网页动态效果。2.分析动态html的特点引导学生总结动态html的特点:不依附于网络,离线状态仍能正常显示。自学moodle平台中的知识点,根据提示,制作简单的动态html效果。完成任务1。体会动态html的特点通过实践,以简单的例子引入,激发学生兴趣。引导学生归纳总结二、javascript1. 展示第三张特效网页,指出实现动态html的方法之一: javascript 2. 介绍javascript ,指导学生自学javascript的基本结构提出问题2:

5、如何为网页加入javascript特效?请学生自学知识点,尝试任务2。请出现问题的学生展示网页,及时纠正错误,指出添加javascript的正确位置,并强调script标签的基本结构。自学moodle平台中的知识点,识别javascript的基本结构。通过实践,尝试添加javascript的基本方法。完成任务2。观察同学的错误,指出原因。让学生根据提示,认识并运用javascript,实现简单的javascript效果,激发学生深入学习的欲望。通过错误的演示,让学生自己发现错误,并纠正。3. 提出问题3:能否利用javascript添加更生动的动态效果?指出javascript的运用方法之一:

6、代码复用。请学生自学知识点,尝试任务3中的第1个小任务。4. 提出问题4:如何修改代码,得到符合我们需要的效果?请学生尝试任务3中的第2个小任务。请学生演示操作,及时发现问题。指导学生总结。自学moodle平台中的知识点。通过实践,掌握javascript代码复用的方法。尝试修改javascript代码。完成任务3。个别学生演示,对比自己的操作过程,总结添加javascript的步骤加深script标签印象,掌握javascript代码复用,并通过修改,得到合适的特效。引导学生归纳总结。5. 提出问题:能否根据不同网页的不同性质,添加各种特效? 请几位学生展示自己的成果,谈谈作品的设计初衷和特

7、点。指出javascript运用中较为普遍的错误,强调代码添加的正确位置6. 根据学生的作品,分析动态html的设计原则:(1).尽量精简,不要过于繁复;(2)过度的闪烁让人头痛;(3)合理使用滚动字幕等。根据网页的不同特点添加网页特效,并根据自己的实际水平选择难度适当的代码进行修改。完成任务4。观察他人的作品,并进行评价。总结动态html的设计原则。任务分层设计,学生根据自身情况选择,理解添加动态网页的目的。巩固操作知识点。通过对他人作品的观察,从操作技术和实际效果两个方面进行评价。根据学生的作品,引导学生归纳总结网页特效的设计原则。总结评价1. 总结知识点2. 对学习过程做出评价:利用moodle平台“随堂测试”,并及时将结果以图表形式向学生展示回顾本节学习内容,完成知识点测试,了解自身学习情况总结知识点,根据教师展示的“知识点掌握情况图表”,反思自己的学习过程课后探索动态html的实现除了利用“动态html效果”工具栏和javascript

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论