《第二节 07给网页添加动态效果》参考教案.docx

学而优教有方

PAGEPage3/NUMPAGESPages3

给网页添加动态效果

一、教材分析

本课是第3章第2节第8课时，这一内容能够给原图文并茂、色彩和谐的“静止”网页以动感效果，增加网页的浏览效果，它是网页设计的重要内容。

二、学情分析

教授对象是八年级学生，通过小学阶段和初中的学习，有了一定的操作基础，但因我校地处城乡接合部，外来的借读生比较多，技术水平还存在一定的差异性，这部分内容对于学生来说是新奇的、有趣的、实用的，动手操作部分比较多，相对能够激发学生的主动性。

三、教学目标

1.知识与技能

（1）理解动态网页与网页动态效果的区别。

（2）掌握插入Flash影片的方法及设置。

（3）掌握滚动字幕、按钮等控件的插入方法及设置。

2.过程与方法

本节课通过分析网页中文字、图片、动画、按钮等元素的搭配与运用。通过任务分析——实践操作——知识小结的过程，强化和升华知识点，使学生主动构建制作和美化网页的思路。

3.情感、态度与价值观

（1）调动学生学习积极性，培养学生根据实际需要布局网站和元素的搭配。

（2）学生通过自主学习网页动态效果的制作，形成积极、主动的学习气氛，激发学生的学习兴趣，培养学生的探究意识和创新能力。

4.行为与创新

以给网页“装修”为主线，每一任务都与生活相联系，形象而生动。作品评价利用ASP技术实现网页投票排名机制，创新学生作品评价形式，从而改变以往由教师单一评价的模式。

四、教学重难点

1.重点

滚动字幕、按钮等动态效果的制作与Flash动画的插入。

2.难点

各种对象属性的设置及网页页面的综合设计。

五、教学方法

采用任务驱动、自主探究、合作学习为主，教师指导为辅的教学法。

六、教学准备

网络多功能教室、学习网站。

七、教学过程

（一）引入

1.教师活动

话题引入：装修。制作网站就像建房子，每个页面就是一个房间，那么如何让你网站更能吸引别人的眼球呢？引出课题：给网页添加动感效果。

2.学生活动

学生互动交流，并积极回答老师的问题。

3.设计意图

联系生活，拉近距离，引入课题。

（二）探究

1.教师活动

教师操作：展示两个网页作品。教师设问：两种网页,哪个更吸引你？分析网页的组成元素：文字、图片、动画、视频、音乐。

分析装修要点：色调——背景颜色，布局——表格规划，搭配——图文位置。

2.学生活动

学生积极回答自己的想法，并听老师讲解。

3.设计意图

帮助学生认识分析网页中的元素运用，为下一步的学习厘清思路。

（三）练习

1.教师活动

给墙面刷漆——设置网页背景（颜色、图片）。

2.学生活动

学生练习设置网页背景颜色。

3.设计意图

巩固旧知，为下一任务的学习培养信心。

（四）讲授

1.教师活动

添加动态效果，要有所创新，教师讲解装修网页的任务流程：（1）插入Flash；（2）插入滚动字幕；（3）插入交互式按钮。

任务一：制作Flash吊顶，在网页上方插入Flash横幅，并调整成合适大小。

拓展：将Flash设置成透明效果；用gif图片替代Flash效果。

任务二：电子滚动屏，插入滚动字幕，并设置字体大小、背景等属性。

拓展：如何让字幕滚动方向从上下方向移动？

任务三：安装控制开关，插入交互式导航按钮，设置其属性。

2.学生活动

学生根据学件完成任务，部分学生参考学件帮助，练习实践。

3.设计意图

课堂新授知识，开展教师讲解、学生探究活动，分解教学重点。

（五）评价

1.教师活动

全班同学对提交作品进行投票，最终选出最优秀作品。

2.学生活动

根据评价标准，对同学作品进行投票。

3.设计意图

学会欣赏别人的作品并做出公正评价，调动评价的积极性。

（六）小结

1.教师活动

带领学生共同回顾本节课网页动态效果的制作过程，引导学生明确动态效果制作中应图文并茂、色彩和谐、动静适宜。

2.学生活动

学生自我小结本节课所学内容，并听教师讲解。

3.设计意图

梳理本节课知识点。