《网页的美化》教学设计 教学目标： 认知目标：了解美化网页的常用方法；理解美化网页对提高网站质量的作用。 技能目标：学会在网页中设置背景、插入flash动画、滚动字幕。 情感目标：提高审美能力，善于发现美、创造美并从自身做起；培养学生的规划、 创新意识。 教学重点：网页背景设置、插入flash动画、滚动字幕。 教学难点：如何用图片做网页背景及FLASH动画如何插入。 教学方法：教师主动引导，学生探究“双主”教学法，学生主动探究学习、小组 合作学习、教师点拨，全面展开教学活动。以任务驱动的教学方法，逐步帮助学 生通过自我学习的过程循序渐进地掌握知识，完成教学任务，从而培养学生自主 学习的能力，增强学生的创新意识。 教学设计思想： 本节课采用“任务一一探究”式教学方法，将学生的学习活动与任务相结合， 让学生在真实的教学情景中带着任务学习，以探究问题的方式，驱动和维持学生 学习的兴趣和动机，拓展思维，张扬个性，促进学生的自主学习，倡导创新精神 和实践能力的培养。 教学过程： 教学 步骤 教师活动 学生活动 设计意图 、 情景导 入，初步 感悟： 网页展示，引导学生分析我们以前 所设计的网页发生了哪些变化？ 教师总结：多了音乐、背景、Flash 动画和滚动字幕。那么怎样来实现这些 修饰效果呢？今天我们就来共同探讨 如何美化网页，在网页中插入音乐、背 景、动画和滚动字幕，让网页在我们的 手中将会变得五彩斑斓。 学生欣赏对比网 页，发表自己的见 解。 通过网页的对 比，让学生真切 感受到色彩、背 景音乐、动态效 果对网页的强化 作用，引发学生 的学习热情。 二、 自主探 挑战第一关：给网页设置漂亮的背景 学生根据学案提 通过分组竞赛的 方式完成教学任 务，能够激发学 创建一个新的空白网页，先设置网页的 究，合作 交流 背景为浅蓝色，再用图片"背景.jpg” 做网页的背景： 1. 单击“开始” 一所有程序一Microsoft Office— Frontpage2003,即可新建一个 空白网页。 2. 设置网页的背景颜色： “格式”菜单一 “背景” 一颜色背景 一确定。 3. 用图片“背景.jpg”做网页的背景： 单击“格式”菜单一 “背景” 一选 中背景图片一 “浏览” 一选择桌面上 “网页的美化”文件夹中的“背景.jpg” 一确定。 教师温馨提示：为了产生理想的视觉效 果，背景色应采用素淡清雅的颜色，不 宜选用图案复杂的图片，同时背景色要 与文字的颜色对比强烈一些。 示，分别设置颜色 和图片作为网页背 景，并对比二者的 视觉效果。 请最先完成的小组 代表利用多媒体教 学软件讲解并演示 过程，学生评价， 教师总结，并对表 现优秀的小组和同 学予以奖励。 学生反复练习，选 择适合的颜色或图 片作网页背景。 按照学案提示，分 小组进行讨论插入 背景音乐。 请小组代表利用多 媒体教学软件讲解 并演示过程，感受 背景音乐的作用。 学生反复练习，体 验设置“不限次数” 和“循环次数”的 效果。 生的学习热情。 进行审美能力的 渗透教育，增强 学生的创造思维 与审美能力，让 学生把美术色彩 搭配规律运用到 信息技术学习中 来。 以任务驱动的教 学方法，逐步帮 助学生掌握知识 挑战第二关：插入背景音乐 在网页中插入一首优美的背景音乐： 1. 在网页的任何位置单击右键，选择 “网页属性”命令，单击“网页属 性”对话框中的“浏览”命令，选 择一首音乐作为背景音乐，点击确 定。 2. 点击Frontpage左下角的“预览"， 可以感觉背景音乐的作用。 3. 点击FrontPage左下角的"设计”， 可返回到设计视图。 教师提示是否勾选“不限次数”对效果 的影响。 挑战第三关：插入Flash动画 在网页的合适位置插入一个Flash动画 文件： 1 .“插入”菜单一 “图片” 一 “ Flash 影片” 一选择需要的Flash动画一设置 动画的大小（选中图片，在图片边缘的 控制柄拖动即可）。 2. 点击Frontpage左下角的“预览"， 可以看到插入的Flash动画的效果。 3. 点击FrontPage左下角的"设计"， 可返回到设计视图。 按照学案提示，分 小组进行讨论插入 Flash动画o 请小组代表利用多 媒体教学软件讲解 并演示过程。 反复练习插入 Flash动画，调整动 画大小到最佳效 果。 按照学案提示，分 小组进行讨论插入 滚动字幕。 请小组代表利用多 媒体教学软件讲解 并演示过程。 反复练习插入滚动 字幕，通过修改“字 幕属性”中的种参 数值，体验不同的 动态效果。 采用启发引导、 自主探究、小组 合作式教学。 让学生动手操 作，通过观察参 数对显示效果的 影响强化对知识 点的理解。 挑战第四关：插入滚动字幕 插入滚动字幕“初家中学欢迎您” 1. 单击“插入”一 “Web组件”一 “字 幕” 一完成一在字幕属性对话框中 输入文本“初家中学欢迎您” 一高 度40像素一背景色绿色一样式一格 式一字体一楷体，加粗，大小36pt, 颜色红色一确定一确定一确定。 2. 点击FrontPage左下角的“预览"， 可以看到插入的滚动字幕的效果。 3. 点击FrontPage左下角的"设计"， 可返回到设计视图。 教师温馨提示：双击滚动字幕，可修改 字幕属性。 三、 巩固提 升 1、 反复练习在网页中设置背景、音乐、 Flash动画和滚动字幕，做到运用自如。 2、 组际间互测：小游戏"让谁干啥就 干啥” 学生练习，组际间 游戏 巩固训练学生所 学技能进一步加 深学生对知识的 了解与掌握 四、 实践创 请你以“母亲节” / “儿童节” / “生 日快乐”为主题，设计一个网页，要求 学生设计网页，相 互欣赏，评价学生 作品 培养学生积极动 手的能力。 新，大显 身手： 设计合理、有个性、有创新。 五、作品 展示台： 选择部分学生设计的网页班内展 示，供大家分享，对作品进行适时点评。 学生欣赏、点评学 生作品。 让不同层次的学 生体验成功的快 乐 【教学反思】: 纵观全课，以任务驱动为主线，充分发挥学生的自主学习和小组合作能力， 教师适时点拨指导，让学生的个性得以张扬，创新能力得到培养。学生的个体差 异性，是信息技术学科普遍需要面对的一个难题。在课堂中，我采以小组捆绑式 的管理与评价，对于很快完成任务的学生，为了小组的集体荣誉，去帮助操作困 难的同学，这种学习效果在课堂中非常有效。因此，在今后的备课、上课中，我 将一切从学生主体出发，让学生成为知识技能的“探究者”、难点问题的“突破 者”，使学生真正的成为学习的主人。 因本课的学习在很大程度上决定于学生对美的鉴赏能力，这就要求学生要在平时多注意 身边的色彩、版面设计的方法，如：电视广告、杂志封面、街头广告牌等，并将它们应用到 自己的网页设计中来。有的同学在这方面有所欠缺。 学生对照课本分组去自己的任务，小组内讨论、合作学习。设置网页的背景、设 置表格的背景、插入背景音乐、插入Flash动画、插入滚动字幕理论上都学会了。 但在上机过程中出现一点意外。 1、 学生在操作过程中，有的时间不够用的，致使有的同学没完成今天这节课的 学习任务。 2、 在插入动画的时间，插入的不合适动画没有删除。 本课的主要教学内容为：设置网页的背景、设置表格（单元格）的背景、设置背景音乐、 插入Flash动画和插入滚动字幕等几个知识点，以实现对网页的美化。 网页是否美观大方、给人以美感，很大程度上决定于网页中各元素的色彩搭配是否合谐、 得当，色调是否与网站的主题相吻合，以及网站中的元素是否能满足网站要表达的感情等等。 对网页进行美化是每一个网站建设者不懈追求、永无止境的探索过程。 《网页的美化》导学案 学习目标： 1. 知识目标：了解美化网页的常用方法，理解美化网页对提高网站质量的作用。 2. 技能目标：学会在网页中设置背景、插入背景音乐、Flash动画、滚动字幕。 3. 情感目标：提高审美能力，善于发现美，美化生活从自身做起。 学习重点及难点：网页背景设置、插入背景音乐、Flash动画、滚动字幕。 一、自主探究，合作交流: 闯过第一关，你的网页会吏羡规 挑战第一关：设置网页的背景 1. 单击"开始”-►所有程序TMicrosoft Off iceT FrontPage2003,打开一个 空白网页。 2. 设置网页的背景颜色： “格式”菜单T “背景” T颜色：背景（选择你喜欢的颜色）T确定。 3. 用图片做网页的背景: 单击“格式”菜单T “背景” ■►选中背景图片-►“浏览” -►选择桌面上“网 页的美化”文件夹中的“背景.jpg” T确定。 J 调过第二关，你的网页更优岌唯/ 挑战第二关：插入背景音乐 — 1. 在网页的任何位置单击右键,选择“网页属性”命令,单击“网页属性”对 话框中的“浏览”命令，选择一首音乐作为背景音乐，点击确定。 2. 点击FrontPage左下角的''预览”,可以感受背景音乐的作用。 3. 点击FrontPage左下角的“设计”,可返回到设计视图。 r ■ - 调过第三英，你的网页吏业初/加油咐/ 挑战第三关：插入Flash动面二m 1. “插入”菜单T “图片" Flash影片” -►选择需要的Flash动画T设 置动画的大小（选中图片，在图片边缘的控制柄拖动即可）。 2. 点击FrontPage左下角的“预览”，可以看到插入的Flash动画的效果。 3. 点击FrontPage左下角的“设计”，可返回到设计视图。 ■ 调过第四关，你的网页更醴目 挑战第四关：插入滚动字幕二M 插入滚动字幕“初家中学欢迎您” 1. 将光标放在合适的位置 2. 单击“插入” T "Web组件” T “字幕” T完成-►在字幕属性对话框中输入 文本“初家中学欢迎您” T高度40像素T背景色绿色T样式T格式T字体T楷 体，加粗，大小36pt,颜色红色-►确定-►确定T确定。 湿馨1、提示:-双击滚动宇签可修改是卷属性 3. 点击Frontpage左下角的“预览”，可以看到插入的滚动字幕的效果。 4. 点击Frontpage左下角的“设计”，可返回到设计视图。 二、 巩固提升： 1、 反复练习在网页中设置背景、音乐、Flash动画和滚动字幕，做到运用自如。 2、 组际间互测：小游戏"让谁干啥就干啥" 三、 实践创新，大显身手： 请你以“母亲节” / “儿童节” / “生日快乐”为主题，设计一个网页，要求 设计合理、有个性、有创新。主要内容包括： 1、 新建一个网页。 2、 设置合适的背景：用你喜欢的颜色或图片做网页的背景。 3、 在网页中插入优美的背景音乐。 4、 在网页中插入合适的Flash动画，设置好动画的长度和宽度。 5、 输入滚动字幕，设置字幕背景、字体、字型、颜色及其他效果 6、 保存你设计的网页，保存在桌面“网页的美化”文件夹中。 四、 作品展示台： 展示部分学生设计的网页，供大家分享，对作品进行点评。 五、 兴趣性作业： 有兴趣的同学根据自己的爱好与特长设计网页，美化独具特色，个性突出。 纵观全课，以任务驱动为主线，充分发挥学生的自主学习和小组合作能力， 教师适时点拨指导，让学生的个性得以张扬，创新能力得到培养。学生的个体差 异性，是信息技术学科普遍需要面对的一个难题。在课堂中，我采以小组捆绑式 的管理与评价，对于很快完成任务的学生，为了小组的集体荣誉，去帮助操作困 难的同学，这种学习效果在课堂中非常有效。因此，在今后的备课、上课中，我 将一切从学生主体出发，让学生成为知识技能的“探究者”、难点问题的“突破 者”，使学生真正的成为学习的主人。 网页美化是对前期所做的网页在视