如何在html网页添加动态特效,《让网页动起来----动态HTML》教学案例

《《让网页动起来----动态HTML》教学案例.doc》由会员分享，可免费在线阅读全文，更多与《《让网页动起来----动态HTML》教学案例》相关文档资源请在帮帮文库(www.woc88.com)数亿文档库存里搜索。

1、vaScrit代码。因为可以选择而且不同难度的练习，也使各个能力层次的学生都能有所提高。三、教学过程描述(一)教与学的过程描述教学环节教师活动学生活动对学生学习过程的观察与考查信息技术的应用创设情景、引入课题(分钟)展示两张网页，要求学生观察对比，找出不同。分析第二张网页，因为其页面有网页特效因此令页面生色不少。引出学习内容：动态HTML。观察两张页面，找出第二张页面究竟有什么特效，明确本课学习目标。学生普遍能发现第二张页面的不同，但未能完全找出所有的特效，因此我需要点出三种特效，为下面的知识讲解做铺垫。展示两种网页；用幻灯片展示本课课题知识铺垫、范例演示(分钟)指出实现动态HTML的方法之一：加入JavaScrit代码解释什么是JavaScritHTML的基本结构：展示教学范例网页的源文件，分析其HTML标记语言的组成。演示在网页中加入鼠标跟随文字特效的操作过程，并板书总结操作步骤。结合教学范例，观察HTML的基本结构。观看教师的操作演示，了解其具体操作步。

2、调查及学习反思的帖子，学生可以通过投票的方式选出自己还未掌握的知识点。通过教学调查，可以让学生对本课的学习效果进行一次评价。学习反思的实现：有效的学习反思有助于学生梳理知识体系，为此我在下课前预留分钟让学生通过回复帖子进行学习反思，主要做三项内容：、教学调查；、写出本课的学习感受；、粘贴出精彩的JavaScrit代码。在帖子中，我明确告诉学生可以从哪些方面思考本课的学习感受，这样能够科学地引导学生回顾本课的学习过程、评价自己的学习行为。%的学生反映对“找到指定位置粘贴代码”感到困难；大部分学生回复表示对本课很感兴趣，希望深入学习。约有位学生粘贴了其他精彩的JavaScrit代码。四、教学反思从整体来说，本课的教学目标均能按预期效果实现。我认为本课最大的两个两点在于任务的设置以及学习反思的实现。回顾整个教学过程以及分析教学调查情况，我感觉在练习点评以及个别知识点的讲授方面仍需改进。任务细化、难度逐层深入、由“点”到“面”。让学生从简单任务入手，使学生感受成功，。

3、、掌握知识。从完成指定代码到自行选择代码，由“点”到“面”引导学生完成知识迁移。范例教学：为了让学生尽快掌握在HTML中加入JavaScrit代码的方法，我首先采用范例教学的策略。本课以一个简单的鼠标跟随文字特效制作为引入例子，让学生了解制作JavaScrit特效的基本方法，并要求学生完成同样的特效制作。务求从简单任务入手，让学生从成功的体验中感受到JavaScrit特效的有趣之处，激发学生继续深入学习的欲望。任务驱动、探究合作：为了解决本课的教学重、难点，同时培养学生的探究学习、合作学习的能力，本课安排了两个探究任务。任务一的探究任务要求学生以小组为单位共同探究修改JavaScrit代码中文字属性的方法。这是本课的重、难点，我有针对性地指引学生展开合作探究，学生通过对比、讨论很快能找出方法。任务二要求学生自行选择适合难度的代码进行练习。通过明确的任务要求以及不同难度的练习资源，让学生能够进一步巩固本课新学的操作、完成知识迁移，能够根据灵活运用不同效果的Ja。

4、码学生普遍反感对加恶意代码的行为，但没有明确肯定应该根据网站性质选择适当代码。学习反思、成果共享(分钟)提出学习反思的要求，指导学生完成学习反思及教学调查学生完成教学调查，并回复该贴简单回顾本课学习感受，及粘贴其他精彩的JavaScrit代码%的学生反映对“找到指定位置粘贴代码”感到困难；大部分学生回复表示对本课很感兴趣，希望深入学习。约有位学生粘贴了其他精彩的JavaScri于第二张网页加了三处网页特效。我首先要求学生观察这两张页面找出不同，这样很快就能让学生感受到动态HTML的精彩之处，同时也让学生对如何实现动态HTML感到好奇。学习评价的实现：本课的学习评价主要通过两种方式实现：、学生练习成果展示。每次任务后，我均安排完成得比较好的学生展示他的练习成果，同时介绍操作经验。这样，不仅能让该学生完成自我学习的小结及评价，同时也能让其余学生通过比较找出差距，对自己的练习过程、练习成果做一次自我评价。、通过教学论坛进行教学调查。课前我在教学论坛中发表用于进行教。

5、：()在HTML中加入JavaScrit代码的方法；()能够在指定位置加入JavaScrit代码；()修改JavaScrit代码中文字属性的方法。综合应用：能够根据网页的内容、风格选择适当的网页特效。能力目标()培养学生的自主学习、探究学习以及协作学习的能力；()培养学生的创新能力，表达能力；()培养进行学习反思的学习习惯。情感目标()培养学生与他人合作与交流的人际关系；()培养学生的信息道德素养。(四)教学重点：、掌握加入JavaScrit代码的方法；能够在指定位置加入JavaScrit代码。(五)教学难点：、修改JavaScrit代码中文字属性的方法；能够在指定位置加入JavaScrit代码。(六)教学策略设计本课是一节典型的技术操作教学课，因此充足的操作练习是必不可少的。如何让学生能够迅速掌握技巧，又不至于因练习难度太大而产生畏难情绪呢？我选择将练习任务细化，安排两个大的任务，大任务中又包含分层任务。通过难度逐层深入的练习任务，引导学生在“做”中发现知。

6、让成功感促使学生继续学习。用任务驱动学生进行探究，将问题留给学习小组，让学生在“做”中发现方法，用实践经验帮助学生理解知识、消化知识。将练习资源划分难度，并安排不同层次的任务，让不同层次的学生均能得到提高。加入学习反思环节。下课前预留分钟，让学生完成教学调查，方便教师及时收集学生的学习情况。同时指导学生进行学习反思，帮助学生梳理本课知识体系，同时方便学生之间共享学习成果。练习点评应加入错误操作分析。在教学过程中我发现有不少学生在粘贴代码时出现重复粘贴或者粘贴到错误位置等等的错误操作，这些都是我在课前预计到。练习点评的时候我也有重点提及这方面的问题，但我仅仅是罗列事实、分析原因，结果部分学生无法理解。如果在分析原因前，能够先展示某种错误操作后的具体表现，再来分析原因找出解决办法，这样学生更容易接受和理解。由此我认为在类似技术操作教学课中，错误操作的点评绝不能蜻蜓点水似地带过，帮助学生分析错误找出解决方法与传授正确的操作同样重要。这能够一定程度上让学生少走弯路，。

7、教学模式的成功探索。《让网页动起来动态HTML》教学案例一、案例背景信息模块、章节：《网络技术应用》(选修)第五章第一节教材版本：广东教育出版社年级：高二二、教学设计(一)教学内容分析本课内容主要是动态HTML中的JavaScrit脚本语言的应用。JavaScrit代码能够令网页中出现动态的效果，这是比较受学生欢迎的学习内容。对于普通高中学生，仅需要了解如何在网页中适当位置加入JavaScrit代码即可，无需深入了解JavaScrit代码的组成以及原理。因此我将本课的重点定为：、掌握加入JavaScrit代码的方法、能够在指定位置加入JavaScrit代码。(二)教学对象分析本课的教学对象是桂城中学的高二学生。在学习本课之前，他们已经学习了用Dreamweaver制作网页的基本方法，能够制作简单的网页，但不熟悉HTML标记语言。因此在学习粘贴JavaScrit代码前，应先讲解HTML的基本结构，让学生对HTML有一个基本的认识。(三)教学目标分析知识目标掌握。

8、调查及学习反思的帖子，学生可以通过投票的方式选出自己还未掌握的知识点。通过教学调查，可以让学生对本课的学习效果进行一次评价。学习反思的实现：有效的学习反思有助于学生梳理知识体系，为此我在下课前预留分钟让学生通过回复帖子进行学习反思，主要做三项内容：、教学调查；、写出本课的学习感受；、粘贴出精彩的JavaScrit代码。在帖子中，我明确告诉学生可以从哪些方面思考本课的学习感受，这样能够科学地引导学生回顾本课的学习过程、评价自己的学习行为。%的学生反映对“找到指定位置粘贴代码”感到困难；大部分学生回复表示对本课很感兴趣，希望深入学习。约有位学生粘贴了其他精彩的JavaScrit代码。四、教学反思从整体来说，本课的教学目标均能按预期效果实现。我认为本课最大的两个两点在于任务的设置以及学习反思的实现。回顾整个教学过程以及分析教学调查情况，我感觉在练习点评以及个别知识点的讲授方面仍需改进。任务细化、难度逐层深入、由“点”到“面”。让学生从简单任务入手，使学生感受成功，。

9、高学习效率。通过分析教学调查结果，我发现有%的学生未能掌握“找到指定位置粘贴代码”这个知识点。这并不是本课的重点，因为要解释清楚为什么要在某些指定的位置粘贴JavaScrit代码，需要涉及很多JavaScrit脚本语言的知识。因此我认为下一节课可以从“在哪里粘贴JavaScrit代码”出发，适当讲解JavaScrit脚本语言的基础知识，这样既能解决本课的教学遗留问题，又能让学生了解更多的网页编程内容，激发学生的学习欲望，有助于学生利用课余时间主动学习。五、点评：南海桂城中学林启明这是一个成功的信息技术教学案例，成功之处在于教学目标定位准确、分层探究策略高效、学生主体地位突出、总结反思到位。本章节教材内容对于普通高中学生来说，概念抽象、技术难度较高，讲授者选择“JavaScrit特效”作为“动态HTML”的讲授内容，是出于对教学条件深思熟虑的决定，比较符合高中信息技术教学的实际。同时讲授者也清楚明白，编写JavaScrit代码也是超出普通高中学生认知水平的要求。

10、，因此把“JavaScrit的应用迁移”作为本案例的知识技能目标，本人认为是比较准确的定位。在教学策略上，讲授者采取了分层探究、任务驱动的教学策略，让学生“自主发现”学习问题并通过“协作讨论”寻求解决方法。在本案例中，讲授者有选择地给出难度系数不同的“JavaScrit特效”，学生通过层层深入，一步步掌握“JavaScrit应用迁移”的基本技术，可以说是符合学生认知规律的设计安排。本案例中，学生之间协作讨论、学生演练解题方法，都是学生主体性的突出表现，讲授者摒弃“传统模式”，把课堂归还给学生，抓住了学生面对新知识的学习心理，充分利用学生的主体作用，一方面让“做得快”的学生起到引领作用，另一方面又以此刺激“做得慢”的学生。学生主动的求知，比起被动地“手把手”学习，效果明显提高。“调查反馈”的设计目的性很强，效果立竿见影，和学生的总结反思一样，能让教师及时了解课堂教学效果，有助于后面教学的调整。纵观整个案例，课堂结构合理、节奏紧凑、教学效果明显，是新课标理念下有。

11、特效，明确本课学习目标。学生普遍能发现第二张页面的不同，但未能完全找出所有的特效，因此我需要点出三种特效，为下面的知识讲解做铺垫。展示两种网页；用幻灯片展示本课课题知识铺垫、范例演示(分钟)指出实现动态HTML的方法之一：加入JavaScrit代码解释什么是JavaScritHTML的基本结构：展示教学范例网页的源文件，分析其HTML标记语言的组成。演示在网页中加入鼠标跟随文字特效的操作过程，并板书总结操作步骤。结合教学范例，观察HTML的基本结构。观看教师的操作演示，了解其具体操作步骤。用幻灯片展示知识点；在教学论坛提供幻灯片的内容供学生参考；任务探究任务探究、合作学习(分钟)提出问题：如何修改鼠标跟随文字的大小、颜色等等相关属性?布置任务一：制作一段鼠标跟随文字效果。(见附件)指导学生完成练习、开展小组学习，引导学生间进行讨论，发现问题、总结方法。完成任务一，相邻的两位学生为一个学习小组，共同探究在JavaScrit代码修改文字属性的方法。各自完成不同的 。

12、修改操作，讨论找出异同，总结方法。学生基本上能够找到修改跟随文字的方法，但对如何修改文字颜色感到困惑，主要是不知道具体某种颜色应该用哪个数字表示。部分学生能够联系之前所学，找到颜色代码。学生之间有讨论，但不善于总结方法。在教学论坛中提供练习资源下载；用幻灯片展示任务一的具体要求学习反馈、练习点评(分钟)邀请其中一个学习小组演示修改文字相关属性的操作，引导两位成员总结出修改JavaScrit代码的方法。总结在JavaScrit代码修改文字属性的方法。同组的两位同学合作回答教师的问题。观察同学的操作演示，听取同学的学习小结。负责回答问题的两位学生是做得比较快的两位，能够明确的告诉其他同学如何找到颜色代码，学生们对修改颜色及字体大小这部分比较留意。这是他们普遍感到困惑之处知识延伸、分层练习(分钟)布置任务二：学习在网页中加入其他网页特效的方法(见附件)。指导学生完成练习。根据自己的水平选择适当难度的代码进行练习。再次修改JavaScrit代码，找出修改JavaSc