高中信息技术选修3《建立超链接》教学设计（教科版网络技术应用）

高中信息技术选修3《建立超链接》教学设计（教科版网络技术应用）高中阶段的信息技术课程承担着培养学生信息意识、计算思维、数字化学习与创新、信息社会责任四大核心素养的重任。教科版高中信息技术选修3网络技术应用模块中的4.3.3节建立超链接，是学生从浏览网页走向制作网页、从信息消费者转变为信息发布者的关键一步。本课以FrontPage或Dreamweaver类可视化工具为载体，引导学生理解超链接的本质，掌握建立文字超链接、图片超链接、书签锚点链接和电子邮箱链接的方法，并通过给班级网站添加导航系统的真实任务，体验Web信息组织的基本逻辑。一、教材分析本节内容位于教科版选修3第四章网站设计与评价的第三节，承接前面网页规划、版面设计与素材制作的知识，为后续网站发布与评价奠定基础。超链接是区别于传统媒体的根本特征，蒂姆·伯纳斯李在设计万维网时提出的核心思想，正是通过超文本把离散的信息节点编织成可漫游的网状结构。教材安排了文字链接、图片链接、锚点链接、邮件链接四类基本任务，知识梯度由浅入深，操作性与思维性兼备。教学中如果仅停留在菜单按钮的演示层面，学生很快就会遗忘；只有把链接与信息结构、用户体验联系起来，学生才能理解为什么链接是网站的灵魂。二、学情分析授课对象为高中二年级学生。学生日常上网频繁，点击超链接的感性经验丰富，能熟练地在网页间跳转，但从未审视过跳转背后发生了什么。前两课学生已经完成了网页的基本编辑，能够插入文字、图片和表格，保存站点文件，具备动手基础。学生的认知难点有三：一是相对路径与绝对路径的概念区分，容易在移动文件后出现链接失效的断链现象；二是锚点链接中命名与指向两步操作的逻辑关系；三是面对真实网站时，如何依据内容结构设计链接网络而不是随意连接。教学中需借助对比实验制造认知冲突，让学生在失败与修正中建构知识。三、教学目标能够从信息组织的角度阐述超链接的作用，说出绝对地址与相对地址的区别，理解URL的基本构成。能够熟练地在网页中建立指向外部网站、站内页面、页面锚点和电子邮箱的四类超链接，并能检测和修复断链。在为班级网站设计导航的任务中，能根据内容模块之间的关系规划链接结构，使站点可被无障碍地完整浏览。体会作者与浏览者双重角色的不同视角，养成发布前测试链接的习惯，树立对他人数字体验负责的意识。四、教学重点与难点教学重点是文字超链接与图片超链接的建立方法，以及超链接在网站信息组织中的作用。教学难点是相对路径的理解和锚点链接的制作，前者关乎网站的健壮性，后者关乎长页面的浏览效率，两者都是学生日后独立建设网站的必备能力。五、教学方法与准备采用情境导入、任务驱动、对比实验、小组协作相结合的教学方法。课前准备半成品班级网站素材包，内含首页、班级相册、学习园地、联系我们四个页面及若干图片素材，统一放置于classweb文件夹并分发至每台学生机；机房安装网页编辑软件，保证局域网内文件传输畅通，教师机配置广播演示环境。六、教学过程（一）情境导入（约5分钟）教师广播展示两张网页截图。第一张是一个纯文字的班级介绍页，信息完整但全部堆在一页里；第二张是同样的内容，拆分成四个页面并通过清晰的导航栏互相连接。教师提问：假如你是来访者，只能从这两份作品中选一份继续浏览，你选择哪个，理由是什么。学生一般会指出第二份条理清晰、容易找到想看的内容。教师追问：让信息散而不乱、一点即到的魔法师是谁。由此引出课题——建立超链接。教师进一步点拨：超链接表面上看是一个可点击的文字或图片，本质上是一份承诺——承诺点击之后会到达某个确定的地方。一个网站好不好，很大程度上取决于这份承诺兑现得是否准确、及时。带着这个认识进入学习任务，学生就不再是把链接当作装饰，而是当作网站交通体系的规划问题来对待。（二）任务一：认识超链接的真面目（约5分钟）学生在教师指导下打开任意门户网页，将鼠标悬停在一条带下划线的文字上，观察浏览器状态栏显示的地址变化；再随意点击一个链接，观察地址栏的变化。教师板书整理学生观察到的结论：链接有源、有目标，源可以是文字或图片，目标是某个URL。教师顺势区分两类地址：形如完整写法、包含协议和域名的叫绝对地址，适合指向站外资源；形如folder/page.htm这样只写站点内部相对位置的叫相对地址，适合站内链接。教师埋下一个伏笔：两种方式都能成功跳转，但有一种会让你的网站搬家后集体瘫痪。这个问题留到任务三用实验揭晓。（三）任务二：建立文字链接与图片链接（约10分钟）教师演示一次完整操作后淡出，由学生动手。具体操作路径为：在首页选中导航文字班级相册，执行插入菜单中的超链接命令，在对话框中选择站点内的album.htm，确定后预览网页，点击测试。随后让学生给页面中的班级合影图片添加链接，目标指向相册页，体会图片同样可以作为链接源。学生操作期间，教师巡视并收集共性问题。最常见的问题有两类：一类是选错目标文件，跳转到不存在的页面弹出错误提示；另一类是链接文字缺乏指向性，比如全部写成点击这里。针对后者，教师在屏幕上对比展示两种写法——“点击这里查看相册”与“班级相册（本周更新了运动会照片）”，让学生评选哪种更能帮助浏览者做决定，自然引出链接文字应具有自解释性的设计规范。（四）任务三：对比实验——相对路径与绝对路径（约8分钟）教师组织学生做一个刻意设计的实验。第一步，每人把相册页面复制一份，一份用绝对地址链接、一份用相对地址链接，预览确认都能打开。第二步，把整个classweb文件夹重命名剪切到另一个磁盘分区，再次分别点击两个链接。结果一目了然：绝对地址的链接失效报错，相对地址的链接依然正常。教师引导学生解释现象。绝对地址像把好友家的地址精确到门牌号抄在本子上，好友搬家就找不到人了；相对地址则像记住“我家隔壁第三家”，无论整个小区整体搬到哪里，只要邻里关系不变就能找到。网站上传服务器就是一种搬家，所以站内链接必须使用相对地址，而指向站外资源无法用邻居关系描述，只能使用绝对地址。经过失败体验得来的规则，远比教师照本宣科的叮嘱牢固。这一环节也直接回应了导入环节埋下的伏笔，形成首尾呼应。（五）任务四：锚点链接——长页面内的快捷电梯（约7分钟）教师打开学习园地页面，这是一篇汇总了十条学习建议的长文章。提问：如果只想看第九条建议，必须滚动很久，能不能在页面顶部做一份目录，点哪条看哪条。学生带着问题学习锚点链接两步法：先在第十条建议标题旁插入书签并命名，例如tip10；再回到页面顶部，选中目录文字“十、善用错题本”，建立超链接时选择本文档中的书签tip10。教师强调这像坐电梯——先在楼层按钮上贴标签，电梯才能带你到那一层，命名与指向缺一不可。学生完成目录式锚点链接后，教师补充邮件链接作为拓展：在联系我们页面选中班长邮箱文字，建立目标形如mailto开头后接邮箱地址的链接，点击即可唤起邮件程序。至此四类链接全部出场，教师用一张表与学生共同梳理：外部链接用绝对地址，站内链接用相对地址，页内跳转用锚点，写信联系用mailto。（六）任务五：综合实践——为班级网站搭建导航系统（约10分钟）以四人小组为单位，要求为半成品班级网站完成三项系统集成：每个页面顶部放置统一的导航栏，链向其余三个页面；相册页顶部制作图片索引，点击缩略图名跳转到对应大图位置的长页锚点；联系我们页面设置邮件链接。评价标准为三条：任意页面之间三步之内可达，无断链，链接文字命名清晰。小组完成后，采用交换浏览的方式互测：A组成员以访客身份打开B组作品，不交流不提示，仅凭导航寻找教师指定的三条信息，记录寻找的顺畅程度，并把发现的问题写在便利贴上交给对方。这个环节让学生第一次真正站在浏览者立场审视自己的作品，许多学生会发现自认为明显的导航对别人并不友好，这正是用户体验意识的萌芽。教师最后挑选两组具有代表性的作品进行展示点评，一组以结构清晰见长，一组以锚点运用巧妙见长，让不同完成度的学生都获得参照坐标。（七）课堂小结与延伸（约5分钟）请学生用一句话回答今天最重要的收获，教师梳理板书形成知识结构：超链接的本质是承诺，四类链接各有适用场景，站内链接坚持相对路径，发布前必须测试。教师抛出一个延伸问题供学有余力的学生思考：一个五百个页面的大型网站，靠手工逐个添加链接显然力不从心，现代网页是如何批量生成导航与链接的。这个问题指向后续动态网页与模板技术的学习内容，为有探究愿望的学生埋下引线。七、教学评价设计本课采用过程性评价与作品性评价相结合的双维结构。过程性评价关注学生在断链实验中的观察记录、小组任务中的分工参与度；作品性评价依托三条可观测指标——链接有效性、导航结构合理性、链接文字规范性，由学生互检与教师抽查各占一半权重。所有评价数据当堂反馈，让学生清楚自己与目标之间的差距及改进方向，体现教、学、评一致性的课程理念。八、板书设计主板书以网站交通图为意象：中央是首页，辐射出相册、园地、联系我们三个页面，连线上标注相对地址；页面内部用虚线标出顶部目录到各锚点的跳转关系；右下角单列mailto型邮件链接。副板书区域滚动记录学生提出的共性问题与解答关键词，课后拍照存入班级资源库供复习。九、教学反思预设从历次授课情况看，断链对比实验是本课投入产出比最高的环节，学生对相对路径的理解普遍一次到位，