《网页的美化教案.docVIP

《网页的美化》 教学设计 教材版本 青岛版 课 题 《网页的美化》 学 校 龙子心中学 授课教师 杨斌 课 型 新授课 授课班级 初二（1）班 课 时 1 课程 纲要 依据 本节课的定位在于“熟练掌握”的程度上，旨在让学生通过对《网页的美化》的学习，了解掌握美化网页的方法、步骤，熟练掌握美化网页的操作，提高审美意识，激发学生对网页制作进行更深入的学习和研究的兴趣。 教材 分析 结合本校学生和教学环境的特点，深入地领会由青岛出版社出版的初中《信息技术》（八年级）教材的编写意图，设计了制作“情感小屋”网站的主题活动，制作“情感小屋”网站。 学情 分析 初二学生已经学习了很多信息技术基础知识，并且具备了一定的操作计算机、上网搜索、编辑图象的能力。通过前几周的学习，学生对网站制作有了初步的认识，并建立了站点，制作了首页，而且还通过表格归整了网页中的各元素，使网页趋于整洁。但是，由于制作的网页中还未有设置背景、背景音乐、Flash动画、字幕等元素，还显得单调。他们希望能够通过学习新的知识，进一步美化他们制作的网页。 教 学 目 标 ①了解美化网页的常用方法，理解美化网页对提高网站质量的作用。 ②学会在网页中设置背景、音乐、Flash动画和滚动字幕。 ③提高审美意识，善于发现美，美化生活从自身做起。 教学重点 在网页中设置背景、音乐、Flash动画和滚动字幕。 教学难点 在网页中设置音乐、Flash动画。 教学方法 讲授法、自主学习法、任务驱动法、实验探究法等 教学资源 计算机及多媒体网络教室系统、FrontPage2003软件等 板书 设计 网页的美化 一、美化网页的作用 二、美化网页的方法 三、美化网页的流程 四、具体操作： 1. 插入背景音乐 2. 设置网的背景 3. 设置表格的背景 4. 插入Flash动画 5. 插入滚动字幕 时 间 （分） 教 学 内 容 教师 活动 学生 活动 设计意图 2 1 2 3 3 8 3 1 3 6 3 1 6 1 1 1 （课前2分钟预备） 对比提问：（2分钟） 观看图片：未精心布置的房间与布置后的房间、丑女与美女 提问：你更喜欢哪一个？为什么？ （更喜欢后者，因为后者更赏心悦目，“养眼”，美） 观看网页：未经美化的网页与美化后的网页（index.htm , school.htm , Domain.htm , Neighbor.htm） 提问：你更喜欢哪一个？ （更喜欢后者，因为前者相对比较单调，浏览后者使人“耳目一新”） 引入新课：（1分钟） 我们这节课就来学习并自己动手操作一下如何从前者变成后者，如何使网页更加具有美感。 使网页更加漂亮的过程就是“网页的美化”。 讲授新课：（38分钟） 网页的美化 一、美化网页的作用 通过刚才的比较，相信同学们已经对美化网页的作用有了一定的认识，现在我们再来看一些网站，加深了解。 展示一些比较优秀的网站。（百度视频、新浪、网易、搜狐、秘密花园等） 二、美化网页的方法 一般都用哪些方法美化网页呢？ ⒈ 插入背景音乐 听到自己喜欢的音乐，可以让我们消除疲劳，在网页上设置背景音乐，也可以让浏览者心旷神怡。 展示无背景音乐和有背景音乐的Index.htm网页。 ⒉ 设置网页背景 在制作网页时，为网页加上背景颜色或背景图片，可以让网页更加美观、生动活泼、更能衬托网页的主题。 展示无背景与有背景的Index.htm网页。 ⒊ 设置表格的背景 我们在设计网页的过程中有时也需要对网页中某一局部的背景颜色进行设置，以达到强化有关内容的效果。 对比无表格背景与有表格背景的Index.htm网页。 ⒋ 插入Flash动画 我们浏览网页时，会看到很多广告形式的动画。 在网站设计中，如果在我们自己的网页上也能插入几个Flash动画，肯定会使网页增色不少。 对比无Flash与有Flash动画的Index.htm网页。 5. 插入滚动字幕 在网页设计中，我们也会采取各种方式让文字或图片动起来，以吸引浏览者的注意力。为了让一些纯文本的内容（如标题）更醒目，一般通过改变字体、字号、颜色或产生动态效果的方法来实现。其中效果最好的当属在网页中使用滚动字幕。 展示无滚动字幕与有滚动字幕的index网页。 三、美化网页的流程 ⒈ 确定主题（基调） 思考：网站“情感小屋”的基调，是凝重的，还是轻松的？ ⒉ 搜集素材（音乐、图片