还剩2页未读,继续阅读
文本内容:
高中信息技术选修网络技术应用认识动态网页教学设计
5.1
一、教学目标
1.知识目标1了解动态HTML,动态网页的概念2能够实现简单的动态HTML效果,能够插入简单的javascript代码3掌握动态网页的特性
2.能力目标1培养学生的探究学习能力2进一步提高学生的审美能力
3.情感目标1培养学生正确评价、选择、运用信息的价值观2培养学生的版权意识3使学生正确认识技术的两面性
二、教学重点与难点重点1动态HTML和动态网页的概念2插入简单的动态HTML特效难点插入javascript网页特效
三、教学过程一动态HTML的概念
1.情景创设教师展示做好的网页,网页中有许多动态HTML的效果,问请观察以下网页,注意哪些地方发生了动态的变化?学生仔细观察,发现有文字移动,背景颜色随鼠标变化等特效,兴趣大增教师引导同学们想不想学呢,这是什么技术呢?
2.动态HTML DHTML的概念教师给出概念在脱离网络环境下,网页下载到浏览器以后仍能够随时变换的HTML
3.教师演示在FrontPage中,提供了一些动态HTML效果,教师演示操作步骤例1实现简单的动态HTML效果演示鼠标特效方法格式-------动态HTML教师只演示其中一个,其他例子先让学生自己探索培养学生的自学能力学生探索研究后,老师请先完成的同学出来演示,并讲解难点,如鼠标悬停效果
4.学生练习教师讲解完后,让学生继续巩固动态HTML特效,做练习一练习一实现简单的动态HTML效果1网页加载效果2鼠标悬停效果提供背景图片3单击4双击
5.学生成果交流与评价问是不是动态效果越多越好呢培养学生审美观让学生相互评价,哪些地方加得恰到好处,哪些地方加得不大合适?教师总结frontpage2000自带的动态HTML特效,实质上是在原网页上自动增加了一些代码,那么,除了frontpage2000自带的动态HTML特效,还有更丰富更具个性化的特效吗?
6.引伸为进一步理解动态HTML,不仅仅是ftontpage自动产生的那些,还有更加丰富更加全面各种特效,教师提供一些简单的javascript小程序,对动态HTM L作一些引伸,例2插入简单的javascript网页特效教师演示怎样插入“显示当前日期”的代码强调难点一定要注意插入代码的位置练习二请插入以下几个网页特效1记数器2显示当前时间3跟随鼠标的时钟4礼花背景教师事先准备好这几个小程序,学生分组练习,分四组,每个组只要完成其中一个特效
7.学生作品交流与评价教师小结这里只是插入的最简单的代码,还有一些复杂的代码在以后的章节中有要求进一步学习,javascript小程序是实现动态HTML特效的主要工具,还有css等等注意使用别人代码时,要注意别人的版权信息同学们还想更多特效,教师提供以下网址,课外资源七色风网页特效网页特效观止网页特效你知道乱用javascript特效的后果吗?有些人专门编制了这种小程序,对网页产生了一些破坏作用,这是非常不道德的同学们对于动态HTML非常感兴趣,特鼓励同学好好专研,成为javascript的编程高手过渡进一步理解动态网页的概念动态网页不仅局限于动态HTML还包括采用CGI、ASP、JSP、PHP、Perl等技术动态生成的页面二动态网页的概念这里所谓的动态主要强调的是人机关系,即,按照访问者的不同需要对访问者输入的信息作不同的响应,并提供相应的信息教师展示网站,让学生体验良好的人机关系,这些网站主要是由asp、php等技术生成的例3认识几种动态网站http://www.baidu.com搜索引擎http://www.xingyun.org.cn/zm/exam/在线考试系统.kl
2.com.cn/platform/index.phpt=book_index_firsthttp:〃www.taobao.com购物网站.czedu.gov.cn/default_login,asp数据检索,后台数据库.
163.com/jswzb博客系统通过演示,让学生体会到本节所说的动态网页这个“动”字的涵义,主要强调的是一种人机交流,而不是一种动画技术
(三)总结静态网页和动态网页的比较请学生讨论完成以下表格静态网页动态网页是否支持动态显示效果无法实现动态显示效果能实现个性化的交互功能,能否及时更新和响应维护繁琐,不便人机交互,信息反馈更少的刷新、更快的响应并减轻了服务器负担,维护简单,交互功能强,交流方便是否能支持数据库无法支持数据库支持数据库,查询修改数据方便。