4.3.2超级链接

1、高中信息技术网站设计与制作教学设计 （二）超级链接 教学目标： 1.1. 知识与技能：通过网页的设计制作，知道使用表格可以清晰地划分不同的页面区域， 了解表格属性中的像素与百分比的差异。通过设置文字超级链接，感受超级链接在网站中 的重要作用。 2.2. 过程与方法：通过动手实践，了解设计、制作简单网站的基本过程。通过网站建设任 务，学会并采用任务驱动的学习方法。 3.3. 情感态度和价值观： 通过体验网站建设过程中的趣味性与成就感， 激发学习信息技术 的热情，通过网站内容的编辑，增强环保意识。 教学内容与学情分析 本节内容是上海科教出版社出版的网络技术应用的第四章第二节网站建设，本 章教学以学

2、生用网页展示研究性学习成果为案例，让学生体验网站的规划，设计，制作， 发布，经历一个网站完整的创建过程。本节课时为第 3 3 课时：网页制作与超级链接。，前 两课时教学内容为网站的规划与设计，介绍 frontpagefrontpage 软件使用，网站的建立及首页的 创建。在创建首页时，学生已经初步了解了页面制作中表格的使用，并完成了一级目录 的创建。 本节课主要任务一是设计一个带导航栏的二级子页，通过在表格单元格里再设计一 个表格来加深对表格应用的使用。任务二是利用二级子页完成首页的超级链接，通过这 一任务学会文字的超级链接创建。授课对象为高一年级的学生，估计有部分学生不能完 成二级子页的表格

3、创建，要降低要求。 教学重点：二级子页及导航栏制作，文字超级链接设置 教学难点：网页设计中表格属性的应用，超级链接设置的完整性。 教学方法：以学生需要网页展示研究性学习成果为情境，以学生完成网站建设为任务，采 用情境教学与任务驱动相结合的方法。 教学用具：多媒体网络教室学生成绩档案记录系统 教学过程： 教学过程 教师活动 学生活动 设计意图 教学过程 教师活动 学生活动 设计意图 同学们，看看下面的图片，会不会 很熟呢？ 主页 日击牙乐盘 留宣极相ffll说说个人档 分孚更孙 那么还有这些呢? 一、创设情 境，引入问 题（4 4 分 钟） *认证空间 应用中心 学生思考并 回答 复习回忆首 页

4、制作 AW 我们上节课学习并制作了一个网站和首 页，如果你们的空间或微博用自己首页 设计的风格，大家对自己的设计满意 吗？ 大家看看老师给的页面：借鉴一下。 ay 学生观摩教 师给的首页， 对比自己的 首页 让学生感受一下 网站的风格 二、分析问 题 提出任务 （1 1 分钟） 学生思考 在页面设计 中使用表格 交待布置任务, 引起学生兴趣 我们继续创建网站的历程，大家可以看 到首页上还有 6 6 个子栏目，如果这 6 6 个 栏目的页面都完成了，我们的网站第一 级的结构就完成了。如何制作二级子页 呢？ 由于电池种类比较多，我们的页面也要 做出栏目。要想清晰的划分页面区域， 使用什么方法好呢？

5、 教学过程 教师活动 学生活动 设计意图 任务 1 1 “电池种 类”子页制 作（1515 分 钟） 教师演示导航栏目录的制作。 先从主页复制一个新的页面，删除内容 后在表格中拆分成二列，然后在单兀格 中再创建一个 1010 行一列的表格。 解释宽度与像素的差异及通常的作法。 学生观摩导 航栏制作 演示表格比 较复杂的操作， 加深学生对表格 的理解。 J. 阿Hi 4上甲鼻 IfFll 4-l-d B.-471K 1 it T Rf -.VfQT 教师巡视指导 学生动手实 践 学生通过任 务 1 1 进一步学习 表格的使用。 冋：大家想一想，电池原理这个页面与 电池种类页面的版面设计能不能一

6、样？如果可以一样，那么要如何做就可 以得到电池地原理页面版面呢？ 提示：我们可以在frontpagefrontpage 中复制页 面 学生自主学 习 复制一个新 的页面 为网站模板 的引入埋下辅垫 任务二 文字超级 链接的设 置 （2020分 钟） 我们已经有了二个页面了，那么如何把 它们组织起来呢？ 教师演示“首页”文字超级链接的制作。 机 二包 Cl 曲 学生回答：超 级链接 学生观摩 按照网站建 立的流程，引出 新的任务 LU 町 怕 dctn |：FT旳 0 5ndei.hi3 IJTH) | 1 1 J 丄皑L I i haha. flL=s 1 Sufrs * - H dciT.M

7、i id dqLhii - 三_J 对于学习能力强的学生，要求使用 教师发给其它的 4 4 个页面，完成 7 7 个链 接。 教师巡视指导 动手实践完 成首页的三 个或全部 7 7 个 超级链接 不同的任务难 度，充分考虑学 生的差异性 教学过程 教师活动 大家有没有发现一个问题：我们只 能从首页出去， 能从别的页面回到首页 吗？如果要回来，要怎么做？ 提示：可以在 frontpagefrontpage 中复制首 页的链接 教师演示：复制一级栏目 is削醴翩廉.帥頤上彭也丄.迁翻 如果超级链接没设置好，会出现如下网 页 学生活动 学生思考， 提 出自己的做 法 学生动手实 践，通过一个 “ haha.htm haha.htm ” 的页面反馈， 检查自己的 超级链接。 设计意图 初步理解超级链 接的设计要求 方便学生检查 超级链接的同时 增加学习的趣味 性 三、任务上 交 课堂小结 作业布置 （3 3 分钟） 今天我们进一步学习了网页设计中表格 的使用，还学习了文字超级链接的设置 当然我们网站的内容还不够充实，老师 提供给大家的只是一个样本。下节课我 们接着创建其它的网页，考虑到大家的 时间不多