中小学教育资源及组卷应用平台 第1课《探索网页数据呈现》教学设计 课题 探索网页数据呈现 单元 第四单元 学科 信息科技 年级 七年级上 核心素养目标 信息意识：通过学习、交流、对比分析等活动，能够解释万维网、浏览器、网页等概念，能主动利用其探索和关联所需知识。计算思维：探索网页数据呈现，初建宣传网页，认识代码指令如何控制网页呈现，深入理解超链接技术，简要描述互联网信息呈现的主要过程。数字化学习与创新：运用记事本创建基础HTML文件，观察浏览器解析效果，体验网页内容与结构代码的关系。信息社会责任：了解中国WWW网站发展历程，关注网络技术进步；认识https等安全协议，初步形成个人信息保护意识。 教学重点 理解浏览器通过“发送请求-接收数据-解析渲染”的基本工作流程实现网页访问。认识网页文件的本质是包含代码指令的文本文件，而非直接存储多媒体素材。 教学难点 掌握超链接是万维网非线性组织信息、实现自由跳转的核心技术特征。引导学生建立“源代码文本指令”与“浏览器渲染后多媒体效果”之间的认知联系。 教学过程 教学环节 教师活动 学生活动 设计意图 导入新课 本课要点互联网时代，网页成为人们获取信息的重要途径，同时设计和发布自己的网页，也是宣传自己的重要手段。为助力学校科技节活动，社团的同学们计划以科技节为主题设计制作相关宣传网页。本节课，我们将了解用于呈现网页的浏览器的工作过程，体会网页的非线性浏览带来的便利；探索网页文件的本质，并创建一个包含文本内容的简单网页。浏览器到底是干啥用的呀？浏览器就像个“万能翻译官+画师”！它负责向网站“要”数据，把看不懂的代码“翻译”并“画”成咱们能看的文字、图片和视频，没它可不行。为啥网上点一下字或图就能跳到新页面？像有魔法！信息海洋的“时空航行”我们常说互联网是“信息的海洋”，万维网（WWW）就是这片海洋中最璀璨的明珠。在这片海洋中航行，我们乘坐的“船”是什么？（停顿）没错，是浏览器！更奇妙的是，海洋中的“岛屿”（网页）之间，有一种神奇的“任意门”———超链接，让我们能瞬间穿梭。今天，我们就化身小小探险家，驾驶“浏览器号”，学习航行原理，并研究一下这些“岛屿”和“任意门”是如何建造的！播放视频《网址到网页：神奇的变身之路》。 分析3个简单网页源代码，用荧光笔标注文本标签（

``

）和链接特征（），完成元素-标签连线卡。记录首次/二次访问同一网站的加载速度差异，分析缓存对图片/文字加载优先级的影响。用F12开发者工具模拟“航海日志”，记录访问网页时的请求头、响应状态码及资源加载顺序。观看视频 培养学生通过逆向工程分析网页源代码的能力，帮助学生理解网页本质为标记语言。培养学生数据分析能力，帮助理解浏览器缓存优化机制，引导思考前端性能与用户隐私的平衡。培养学生实验记录能力，帮助理解浏览器作为“航船”如何与服务器通信，引导学生分析HTTP协议在信息海洋中的导航作用。了解网址与网页的关系。 讲授新课 新知讲解：一、探索浏览器是用户浏览网页时使用的特定软件，它的工作过程是怎样的？相较于文档、演示文稿等文件，网页文件又有哪些特点呢？输入网址时，通常会输入WWW这三个字母，这是为什么？万维网（World Wide Web，WWW）是互联网提供的重要服务之一。畅游信息海洋：互联网的神奇世界互联网之所以被称为信息的海洋，是因为网络中有海量信息在快速传播并跨时空共享与交流。万维网是大规模的信息储藏所，是由存储在网络中不同计算机上的数以千万计的网页所构成的。二、议一议万维网中不同网页通过超链接连接。点击超链接可跳转至新网页，重复此过程就能找到所需内容。超链接是一种按信息关系非线性组织信息的计算机技术。它允许用户点 ... ...