《网页的美化》教案

《《网页的美化》教案》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、《网页的美化》教学设计教材版本青岛版课题《网页的美化》学校龙子心中学授课教师杨斌课型新授课授课班级初二（1）班课时1课程纲要依据本节课的定位在于“熟练掌握”的程度上，旨在让学生通过对《网页的美化》的学习，了解掌握美化网页的方法、步骤，熟练掌握美化网页的操作，提高审美意识，激发学生对网页制作进行更深入的学习和研究的兴趣。教材分析结合本校学生和教学环境的特点，深入地领会由青岛出版社出版的初中《信息技术》（八年级）教材的编写意图，设计了制作“情感小屋”网站的主题活动，制作“情感小屋”网站。学情分析初二学生

2、已经学习了很多信息技术基础知识，并且具备了一定的操作计算机、上网搜索、编辑图象的能力。通过前几周的学习，学生对网站制作有了初步的认识，并建立了站点，制作了首页，而且还通过表格归整了网页中的各元素，使网页趋于整洁。但是，由于制作的网页中还未有设置背景、背景音乐、Flash动画、字幕等元素，还显得单调。他们希望能够通过学习新的知识，进一步美化他们制作的网页。教学目标①了解美化网页的常用方法，理解美化网页对提高网站质量的作用。②学会在网页中设置背景、音乐、Flash动画和滚动字幕。③提高审美意识，善于发现

3、美，美化生活从自身做起。教学重点在网页中设置背景、音乐、Flash动画和滚动字幕。教学难点在网页中设置音乐、Flash动画。教学方法讲授法、自主学习法、任务驱动法、实验探究法等教学资源计算机及多媒体网络教室系统、FrontPage2003软件等板书设计网页的美化一、美化网页的作用二、美化网页的方法三、美化网页的流程四、具体操作：1.插入背景音乐2.设置网的背景3.设置表格的背景4.插入Flash动画5.插入滚动字幕-5-时间（分）教学内容教师活动学生活动设计意图2123（课前2分钟预备）对比提问：（

4、2分钟）观看图片：未精心布置的房间与布置后的房间、丑女与美女提问：你更喜欢哪一个？为什么？（更喜欢后者，因为后者更赏心悦目，“养眼”，美）观看网页：未经美化的网页与美化后的网页（index.htm,school.htm,Domain.htm,Neighbor.htm）提问：你更喜欢哪一个？（更喜欢后者，因为前者相对比较单调，浏览后者使人“耳目一新”）引入新课：（1分钟）我们这节课就来学习并自己动手操作一下如何从前者变成后者，如何使网页更加具有美感。使网页更加漂亮的过程就是“网页的美化”。讲授新课：（

5、38分钟）网页的美化一、美化网页的作用通过刚才的比较，相信同学们已经对美化网页的作用有了一定的认识，现在我们再来看一些网站，加深了解。展示一些比较优秀的网站。（百度视频、新浪、网易、搜狐、秘密花园等）二、美化网页的方法一般都用哪些方法美化网页呢？⒈插入背景音乐听到自己喜欢的音乐，可以让我们消除疲劳，在网页上设置背景音乐，也可以让浏览者心旷神怡。展示无背景音乐和有背景音乐的Index.htm网页。⒉设置网页背景在制作网页时，为网页加上背景颜色或背景图片，可以让网页更加美观、生动活泼、更能衬托网页的主题

6、。展示无背景与有背景的Index.htm网页。⒊设置表格的背景我们在设计网页的过程中有时也需要对网页中某一局部的背景颜色进行设置，以达到强化有关内容的效果。对比无表格背景与有表格背景的Index.htm网页。⒋插入Flash动画我们浏览网页时，会看到很多广告形式的动画。在网站设计中，如果在我们自己的网页上也能插入几个Flash动画，肯定会使网页增色不少。对比无Flash与有Flash动画的Index.htm网页。5.插入滚动字幕组织展示提问导入新课板书讲授展示讲解展示讲解展示讲解展示讲解展示讲解展示

7、讲解就坐安静观看思考回答听讲观察思考记忆观看记忆观看记忆观看记忆观看记忆观看记忆观看记忆组织课堂设置情景引起学生兴趣为引入新课做铺垫引出新课内容白板文字显示教学整体结构演示直观体验演示直观体验演示直观体验演示直观体验演示直观体验演示直观体验-5-383136在网页设计中，我们也会采取各种方式让文字或图片动起来，以吸引浏览者的注意力。为了让一些纯文本的内容（如标题）更醒目，一般通过改变字体、字号、颜色或产生动态效果的方法来实现。其中效果最好的当属在网页中使用滚动字幕。展示无滚动字幕与有滚动字幕的ind

8、ex网页。三、美化网页的流程⒈确定主题（基调）思考：网站“情感小屋”的基调，是凝重的，还是轻松的？⒉搜集素材（音乐、图片、Flash动画）⒊加工素材（剪裁音乐，修改图片、动画，制作图形、动画）⒋选择美化网页工具——FrontPage2003软件⒌美化网页（插入所需元素）四、美化网页将全班分成两组，一组同学完成任务一，二组同学完成任务二。任务一：设置网页背景、表格背景自主学习：浏览教学网站——（1）设置网页背景；（2）设置表格背景。设置D:情感小屋School.ht