《网页的链接》

教学设计

一、教学内容分析

　　1、课程标准内容

　　了解超链接的相关知识，掌握设置超链接的基本方法；

　　2、教材作用与地位

　　这部分的主要内容是理解超链接的概念，掌握建立超链接的多种方法。重点在于让学生掌握超链接的类型和创建方法。在本节之前，根据建站时的规划，单个网页都已完成，而如何利用超链接将这些独立的页面“串”起来，形成一个有机的整体，就显得尤为重要。可以说这部分内容在这一单元中起到了画龙点睛的作用。

　　二、教学对象分析

　　在前面的学习中，学生都能独立的完成单个网页的制作，所以对软件的环境已很熟悉。同时在建站时有过规划，所以学生对站点内各页面以及相互联系也比较熟悉。

　　三、教学目标：

　　1、知识与技能

　　（1）了解超链接的基本概念

　　（2）掌握同一站点内不同网页间及不同对象上的超链接的制作方法

　　（3）掌握同一页面中超链接的制作方法

　　（4）掌握不同站点间超链接的制作方法及email链接的制作方法

　　2、过程与方法

　　通过设置超链接的操作，使学生掌握网页中超链接的制作方法，总结出操作的规律，培养学生自主学习和协作学习的能力。

　　3、情感态度

　　通过利用设置超链接将独立的网页串成一个有机的整体，使学生感受成功的喜悦。

   四、教学重点：

　　（1）超链接的含义；链接源、链接目标的含义

　　（2）根据需要选择适当超链接类型

　　五、教学难点：

　　（1）书签链接的名称及对应链接位置的设定

　　（2）图片中热点链接的设置

　　六、教学方法：

　　讲解与演示法、任务驱动法、讨论法、自主探究法

　　七、教学准备：

　　为每位学生准备网站内部链接结构图一张

　　八、教学过程：

（一）             情景导入

　　师：请同学们来欣赏一个网站，这是xx年全国中小学电脑制作优秀作品之一。

生：做的真漂亮

师：大家在浏览网站时靠什么在各个不同的网页之间跳转呢？

生：超链接

师：我们今天这节课的任务就是运用超链接将我们做好的零散页面组合成一个有机的整体，形成一个真正意义上的网站。

　　（二）新授

　　师：（启动frontpage，打开站点，请大家观察手中的网站内部链接结构图）前面我们在规划和设计站点的时候，希望整个站点的8个页面有图中所示的链接。以图中第一个链接为例：我们希望单击首页中的“奥运发展历程”这几个字，能够迅速跳转到“发展（fazhan.htm）”这个页面，这里涉及到两个对象，我们分别称之为“链接源”、“链接目标”。（提问）从字面上来理解，这里的“奥运发展历程”几个字是链接……、页面“发展（fazhan.htm）”是链接……，而中间用来连接链接源和链接目标的这根线就是超链接，下面我们来看具体如何实现：（操作）选中链接源、插入超链接、确定链接目标，在统一资源定位符url框中显示的就是我们刚刚选中的链接目标。

　　下面大家自己来尝试一下。

　　生：分三组分别实现从首页到子页奥运福娃（fuwa.htm）、奥运场馆（changguan.htm）和火炬传递（huoju.htm）的链接。

　　设计意图：给出创建超链接的一般方法，以推动学生探索知识的意愿并将其转化为动力，提高学生的学习主动性和积极性，随后让学生自主探究，为他们终身学习打下基础。

　　师：（巡回指导），提示：发给大家的表中首页和子页之间的链接是双向的。每个子页面最下方都有个返回的箭头，大家尝试看能不能通过这个图片实现从子页面到首页的链接，（学生操作时教师适当提示，此处链接源和链接目标分别是什么）。（在巡视过程中找出每组最先做好的同学，请他充当小老师）

　　设计意图：在这里设置一个小组活动，让最先做好的同学充当小老师，既激发了学生的学习兴趣、提高了学习效率，又能兼顾到操作不熟练的同学。

　　师：让学生演示他们的成果，即：从首页到福娃页面的链接及返回效果。边演示边总结：（点击首页上的文字）链接源不但可以是文字，（点击子页上的返回图片）也可以是图片。

　　师：我们再仔细观察福娃这个页面，发现页首列出了五个福娃的名字，下面是具体介绍，如果我想先了解福娃晶晶，应该怎么办？

　　生：拖动滚动条

　　师：（拖动）方便吗？有没有更快捷的办法？

　　生：……

　　师：是否可以尝试用我们今天学的超链接解决这个问题？

　　生：能

　　师：那么这里的链接源和链接目标分别是什么？

　　生：链接源是标题：晶晶，链接目标是福娃晶晶所在的位置

　　请一位同学到前面来尝试，下面同学给予提示帮助。（学生操作）选择链接源、插入超链接、在选择链接目标时停住了。

　　师：（提示）福娃晶晶所在的位置应该怎样体现出来？平时我们在看书的时候，如果看到一半，去做其他事了，我们通常会在书中插入什么？

　　生：书签！

　　师：对，书签实际上是在这里做了一个标记。（演示的学生经提示后，试图在“创建超链接”对话框中找书签），但目前的书签栏中没有可选项——因为我们还没有插入书签。

　　生：（想如何插入书签）

　　师：提示：建立超链接之前，得先插入书签，作为链接目标。大家观察一下菜单栏，哪一个菜单可以帮我们插入一个书签呢？

　　生：（插入菜单）操作实现插入书签。继续由学生实现书签式链接。在操作过程中提示链接目标是书签，同时注意url框中显示的内容。

　　师：（总结）通过书签式链接我们可以实现在同一页面间的跳转。

　　生：学生分组完成“fuwa.htm”页面中“欢欢、迎迎、妮妮”的页内链接。

　　师：（巡回指导）提问：刚才我们实现了从页首标题链接到下面的具体内容，如果我想从页面底部快速返回到页首重新选择，是否也可以利用超链接直接跳转呢？

　　生：（回答并操作）

　　师：（巡回指导并请两位同学分别演示从页面下方跳转到页首，这里有两种方式实现，一位同学是通过书签完成链接，另一位直接链接到该页上。通过对比两种方式的链接源链接目标，让学生体会到虽然两种方式都能实现，但在实际操作中，以页面为链接目标更方便、快捷。）

　　师：（打开火炬（huoju.htm）这个页面）刚才第三组的同学完成的是从首页到这个页面链接。提问：在这个页面中，你可以读出哪些信息？

　　生：页面中有张图片，图片显示了火炬传递的路线，由海南入境、经各省市，最后到达北京。

　　师：能不能获取到更多信息？比如：我能不能知道火炬在具体某站的传递路程？

　　生：不能。

　　师：在我们的站点中有3个文件分别介绍了火炬在海南站、江苏站、北京站传递的具体情况。我们怎么做才能使浏览者在看到这幅图时就能快速的打开这些页面？

　　生：用鼠标点。

　　师：同样是用超链接来实现。这里的链接源和链接目标分别是什么？

　　生：是图中江苏这一块区域和jiangsu.htm这个页面。

　　师：如何选中图片中的一部分。提示：在图片工具栏的右侧有三个按钮可以帮我们实现。分别是：长方形热点、圆形热点和多边形热点。

　　生：（自己操作，教师提示）当按下“长方形热点”按钮后，鼠标指针变成笔的形状，此时可以在图中选中一块区域，松手，立即弹出“创建超链接”对话框，选择好链接目标，我们就可以实现图片中的超链接。熟练的同学可以尝试用圆形热点或多边形热点完成海南站、北京站的链接。

　　师：由于时间关系，我们这个站点中的内容还太少，有待进一步充实。如果浏览者想获取更多奥运信息怎么办？（生回答）对，我们可以上网获取。首页面右侧就有几个相关站点的图标，我们可以链接到相应站点上，为浏览者提供方便。请大家凭着刚才的操作经验，完成主页面右侧的web链接。大家可以相互讨论来完成。（提示：链接源链接目标，注意观察“创建超链接”对话框）

　　设计意图：这里让学生自己探索完成，因为前面在完成各种超链接之后，都让学生观察了url框中显示的内容，学生能理解url框中显示的就是各个超链接的链接目标，所以到了这里，学生对照网址很自然的就想到把需要链接的网址直接输在url框中。

　　师：做为一个站长，我们需要及时的了解浏览者的反馈意见以便更好的维护我们的站点。怎样才能为浏览者给站点写信提供方便，这就要靠email链接来实现了。在首页右侧有“给我来信”几个字，请大家完善它的链接，使之链接到站长的email地址：abc@bs178.com，请大家按座位分成3组，组员相互讨论，并给出你们的观点。

　　生：分组讨论

　　师：（巡视、收集学生的观点。）请某位同学演示他们的讨论结果。（总结）链接到一个email地址上，关键是email地址输入的位置要正确，借助“信封”按钮，可以帮我们找到输入email地址的位置。

　　设计意图：根据以往的教学经验，不少同学会把email地址直接写在url框中，这里让学生讨论、尝试，让他们自己意识到这样行不通，从而寻找其他途径，一是强化记忆；二是通过尝试，让他们发现问题并自己解决问题，体验到成功的乐趣。

　　（三）总结与评价

　　今天这节课，我们设置了很多的超链接，其中涉及到哪几种类型的超链接？（引导学生回答：不同页面之间的链接、同一页面内的链接、web链接、email链接等形式）通过操作，我们还知道链接源可以是哪些对象？（引导学生总结出：文字、图片甚至是图片中的一部分）。