2022年《网页的美化》教案.docx

《2022年《网页的美化》教案.docx》由会员分享，可在线阅读，更多相关《2022年《网页的美化》教案.docx（10页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、名师归纳总结 精品学习资料 - - - - - - - - - - - - - - -细心整理 欢迎下载网页的美化教学设计教材版本青岛版网页的美化课题学校龙子心中学授课老师杨斌课型新授课授课班级初二（ 1）班课时1 课程 纲要 依据教材 分析本节课的定位在于“ 娴熟把握” 的程度上,旨在让同学通过对网页的美 化的学习,明白把握美化网页的方法、步骤,娴熟把握美化网页的操作,提 高审美意识,激发同学对网页制作进行更深化的学习和争论的爱好；结合本校同学和教学环境的特点,深化地领悟由青岛出版社出版的中学信息技术（八年级） 教材的编写意图, 设计了制作 “ 情感小屋”网站的主题活动,制作“ 情感小屋”

2、网站；初二同学已经学习了许多信息技术基础学问,并且具备了肯定的操作运算学情 分析机、上网搜寻、编辑图象的才能；通过前几周的学习,同学对网站制作有了初 步的熟悉,并建立了站点,制作了首页,而且仍通过表格归整了网页中的各元素,使网页趋于干净；但是,由于制作的网页中仍未有设置背景、背景音乐、Flash动画、字幕等元素,仍显得单调；他们期望能够通过学习新的学问,进一步美化他们制作的网页；教 学 目 标教学重点教学难点教学方法教学资源明白美化网页的常用方法,懂得美化网页对提高网站质量的作用；学会在网页中设置背景、音乐、Flash 动画和滚动字幕；提高审美意识,善于发觉美,美化生活从自身做起；在网页中设置

3、背景、音乐、Flash 动画和滚动字幕；在网页中设置音乐、Flash 动画；讲授法、自主学习法、任务驱动法、试验探究法等运算机及多媒体网络教室系统、FrontPage2003 软件等网页的美化 一、美化网页的作用 二、美化网页的方法板书 设计三、美化网页的流程 四、详细操作：1. 插入背景音乐 2. 设置网的背景3. 设置表格的背景 4. 插入 Flash 动画 5. 插入滚动字幕细心整理归纳 精选学习资料 - - - - - - - - - - - - - - - 第 1 页,共 5 页 - - - - - - - - - 名师归纳总结 精品学习资料 - - - - - - - - - -

4、- - - - -时细心整理欢迎下载教学设教 学 内 容师生计间（分）活活意动动图2 （课前 2 分钟预备）组织就坐组织寂静课堂对比提问：（ 2 分钟）展现观看设置观看图片：未细心布置的房间与布置后的房间、丑女与美女提问摸索情形回答引起提问：你更喜爱哪一个？为什么？同学（更喜爱后者,由于后者更赏心悦目,“ 养眼” ,美）爱好1 观看网页：未经美化的网页与美化后的网页导入听讲为引入新（index.htm , school.htm , Domain.htm , Neighbor.htm课做提问：你更喜爱哪一个？铺垫（更喜爱后者,由于前者相对比较单调,浏览后者使人“ 耳目一新”引出引入新课：（ 1

5、分钟）新课新课内容我们这节课就来学习并自己动手操作一下如何从前者变成后者,如何使板书观看白板网页更加具有美感；使网页更加美丽的过程就是“ 网页的美化”；文字显示教学整体 结构2 讲授新课：（ 38 分钟）一、美化网页的作用网页的美化现讲授摸索演示展现记忆观看通过刚才的比较, 信任同学们已经对美化网页的作用有了肯定的熟悉,直观在我们再来看一些网站,加深明白；讲解记忆体验3 展现一些比较优秀的网站；（百度视频、新浪、网易、搜狐、隐秘花园等）展现观看演示二、美化网页的方法一般都用哪些方法美化网页呢？直观 插入背景音乐讲解记忆体验听到自己喜爱的音乐,可以让我们排除疲惫,在网页上设置背景音乐,也可以让浏

6、览者心旷神怡；展现无背景音乐和有背景音乐的Index.htm网页；展现观看演示 设置网页背景直观在制作网页时,为网页加上背景颜色或背景图片,可以让网页更加美观、讲解记忆体验生动活泼、更能衬托网页的主题；展现无背景与有背景的Index.htm网页；展现观看演示 设置表格的背景直观讲解记忆体验我们在设计网页的过程中有时也需要对网页中某一局部的背景颜色进行设置,以达到强化有关内容的成效；对比无表格背景与有表格背景的Index.htm网页；展现观看演示 插入 Flash 动画直观讲解记忆体验我们浏览网页时,会看到许多广告形式的动画；在网站设计中, 假如在我们自己的网页上也能插入几个 会使网页增色不少；

7、Flash 动画, 确定对比无 Flash 与有 Flash 动画的 Index.htm网页；以吸引浏览展现观看演示5. 插入滚动字幕直观讲解记忆体验在网页设计中, 我们也会实行各种方式让文字或图片动起来,细心整理归纳 精选学习资料 第 2 页,共 5 页 - - - - - - - - - - - - - - - - - - - - - - - - 名师归纳总结 精品学习资料 - - - - - - - - - - - - - - -时细心整理欢迎下载教学设教 学 内 容师生计间（分）活活意动动图者的留意力； 为了让一些纯文本的内容（如标题） 更醒目, 一般通过转变字体、字号、 颜色或产生动

8、态成效的方法来实现；其中成效最好的当属在网页中使用滚动字幕；3 展现无滚动字幕与有滚动字幕的index 网页；播放摸索明白三、美化网页的流程 确定主题（基调）讲解互动美化摸索：网站“ 情感小屋” 的基调,是凝重的,仍是轻松的？回答网页 搜集素材（音乐、图片、Flash 动画）的流程 加工素材（剪裁音乐,修改图片、动画,制作图形、动画） 选择美化网页工具FrontPage2003软件 美化网页（插入所需元素）8 四、美化网页布置接受培育将全班分成两组,一组同学完成任务一,二组同学完成任务二；任务任务自主任务一：设置网页背景、表格背景学习学习自主学习： 浏览教学网站（1）设置网页背景； （2）设置

9、表格背景；动手才能操作设置情感小屋 School.htm的网页背景为素材 背景 9.jpg ,表格背景设置为颜色RGBcc,99,ff；并储存,预览；完成了任务一的同学完成任务二；3 任务二：设置单元格背景、设置背景音乐巡察演示培育自主学习： 浏览教学网站（1）设置表格背景； （2）插入背景音乐；指导设置情感小屋 Neighbor.htm的单元格背景如下列图,背景音乐为组织素材友情地久天长 .mid ；并储存,预览；完成了任务二的同学完成任务一；同学演示操作：任务一或任务二；表达1 总结： 提示同学们在操作时要留意：演示操作才能总结提示1. 先打开要编辑的网页；2. 设置表格背景必需确保光标在

10、该表格中；3. 设置单元格背景必需确保光标在该单元格中；4. 看清是编辑状态仍是预览状态；3 5. 储存时留意图片、音乐的存放位置；布置整改培育反思（选择该班同学易出错的方面提示）网页意识让同学再整改；6 任务三：添加滚动字幕、Flash 动画、设置单元格背景接受培育任务任务自主自主学习： 浏览教学网站（1）设置表格的背景； （2）插入滚动字幕；学习学习（3）插入 Flash 动画；动手才能操作为情感小屋 Domain.htm添加滚动字幕 “ 海内存知已, 天际如比邻” ；插入 Flash动画素材 月亮之上 .swf ；设置纯文字单元格的背景色如下图所示；巡察 指导细心整理归纳 精选学习资料

11、- - - - - - - - - - - - - - - 第 3 页,共 5 页 - - - - - - - - - 名师归纳总结 精品学习资料 - - - - - - - - - - - - - - -时细心整理欢迎下载教学设教 学 内 容师生计间（分）活活意动动图同学演示操作：任务三；培育3 总结： 提示同学们在操作时要留意：组织演示表达演示操作才能1 1. 预备素材时要分文件夹放置（imamges , sound , swf）；总结接受探究提示2. Flash影片属性的“ 透亮” 属性；3. 字幕的表现方式、连续次数；学习6 拓展探究： 依据我们所学到的学问,看看能否将主页中的Bann

12、er 加动画提出成效,结果如下图； 素材：（）素材 rain.swf；（）素材 banner3.png；巩固问题任务记忆学习 动手 探究 操作 学习 争论 探究（留意空中雨滴,水上波纹rain.swf动画）提示：可以浏览学习网站拓展探究五、改名,复制：1 将“情感小屋” 文件夹改名为“ 情感小屋网页的美化”,并将该文件布置改名复制夹复制到自己的网盘中；（由于同学气都安装了仍原卡,所以必需储存在网盘中,以后才可以连续任务复制到自己网制作；）盘中以备总结归纳：（ 1 分钟）网页的美化播放观看以后连续1 一、美化网页的作用制作对知二、美化网页的方法总结回忆识点归纳听讲进行三、美化网页的流程梳理梳理四

13、、详细操作：1. 插入背景音乐听讲 第 4 页,共 5 页 细心整理归纳 精选学习资料 - - - - - - - - - - - - - - - - - - - - - - - - 名师归纳总结 精品学习资料 - - - - - - - - - - - - - - -时细心整理欢迎下载教学设教 学 内 容师生计间（分）活活意动动图2. 设置网的背景 记录3. 设置表格的背景 4. 插入 Flash 动画 5. 插入滚动字幕课后作业：（ 1 分钟）1 式；美化“ 情感小屋” 其他网页的Banner 及导般栏,如index.htm中样布置连续作业完成主题1. 设计理念：使用任务驱动法,让同学完成任务；分组合作探究法,让同学分组操作,并演示；2. 教学亮点：教后反思引导同学用教学网站自学,并分组合作探究；培育同学自学及合作才能；3. 待改进地方：本 课 内 容 较 多 , 学 生 学 习 时 稍 嫌 紧 张 , 可 以 设 计 为 两 课 ； 拓 展 探 究 中 的细心整理归纳 精选学习资料 Banner3.png 文件,可以试同学自己通过Banner1.jpg修改做出来； 第 5 页,共 5 页 - - - - - - - - - - - - - - - - - - - - - - - -