第10课 网页的编辑与发布 教学设计 八上信息技术浙教版（2023）
文档属性
| 名称 | 第10课 网页的编辑与发布 教学设计 八上信息技术浙教版（2023） |  | |
| 格式 | doc | ||
| 文件大小 | 404.9KB | ||
| 资源类型 | 试卷 | ||
| 版本资源 | 浙教版 | ||
| 科目 | 信息技术（信息科技） | ||
| 更新时间 | 2025-08-20 16:47:10 | ||
图片预览
文档简介
中小学教育资源及组卷应用平台
八年级信息技术浙教版教学设计
课题 网页的编辑与发布 单元 第二单元 学科 信息技术 年级 八年级
学习目标 1、了解常用的网页开发工具及其特点2、学会使用记事本编写简单的HTML代码，并能保存为网页文件3、理解网站发布的一般流程和常见途径
重点 1、使用记事本编写HTML代码编辑网页；理解网站发布的一般流程
难点 1、理解网站发布的完整流程及相关配置；网页字符编码的理解与正确设置
教学过程
教学环节 教师活动 学生活动 设计意图
导入新课 提问引入：“你知道哪些软件可以用来编辑网页？”小组讨论：学生分小组讨论并上网搜索，记录讨论结果（如记事本、Notepad++、Visual Studio Code、Dreamweaver等）教师归纳：简要介绍不同类型的网页编辑工具基本文本编辑器：如Windows记事本，纯手工代码编写。增强型代码编辑器：如Notepad++、Visual Studio Code，有语法高亮和提示功能所见即所得编辑器：如Dreamweaver（以前有FrontPage），可视化设计界面 倾听老师引入相关问题 激发学生的学习兴趣，让从问题中进行思考，从而引出本节课的学习内容
讲授新课 一、网页开发工具认识HTML文件教师讲解：HTML文件本质上是文本文件2，通过浏览器解释执行2强调：使用记事本编写代码后，保存时文件类型应选择“所有文件”，扩展名必须为.html或.htm8。网页字符编码（知识链接）简要说明字符编码的作用（避免乱码）介绍常见编码：GB2312, GBK, UTF-8（强调UTF-8最常用，支持多语言）展示代码实例： 通常放在标签内。活动一：动手修改HTML代码任务：请学生使用记事本打开本单元正在制作的“人工智能”主题网站中的某个网页文件（例如先前完成的某个页面），尝试修改其中的部分HTML代码（如修改标题、段落<p>文字、更换图片路径<img src="...">等），保存后刷新浏览器观察变化教师巡视指导：提醒学生注意代码格式和标签闭合，及时解答问题。小结分享：请个别学生演示修改了哪些代码，产生了什么效果。二、编写网页（一）整理与完善网站引导学生小组合作，整理和调试本单元的“人工智能”网站检查内容：各页面内容是否完整。网页之间的超链接是否正确图片等资源是否能正常显示。（二）探究网站发布概念讲解什么是发布网站：将网站文件夹传送到网页服务器上，并进行配置，使其可通过网络访问为什么发布网站：共享内容和信息。拓展影响力和可见度。提供易于访问的信息和功能。与用户互动和建立联系。发布途径介绍教师讲解三种主要途径：使用免费个人主页空间：需在线申请，通常有一定限制。使用虚拟主机服务器：付费租用服务商提供的服务器空间，常用方式。使用专用服务器：自行购置、配置和维护服务器硬件与软件，成本高，技术要求高。（本节课采用）本地局域网服务器发布：在局域网内的一台电脑上搭建服务器软件（如IIS），其他局域网用户可通过该电脑的IP地址访问13。这是一种非常好的实验和学习方式。域名与IP地址简单说明：互联网上的网站通常通过域名（如www.）或IP地址（如192.168.1.100）访问8。本节课使用IP地址访问。设计意图：让学生理解网站发布的基本概念和常见方式，拓宽视野，同时明确本节课的任务。三、发布与访问网站教师说明发布方法：各组将完成的网站文件夹统一命名为组名（如“80401”）1。使用FTP客户端软件（或Windows资源管理器输入FTP地址）或直接拷贝1，根据教师提供的FTP服务器地址、账号和密码，将网站文件夹上传到服务器指定目录。学生操作：组长组织组员完成上传。教师提供局域网Web服务器的访问地址（例如http://192.168.1.100/组名或http://192.168.1.100/组名/index.html）。学生在浏览器中输入自己小组的访问地址查看发布的网站。互相访问：尝试访问其他小组的网站，并相互评价。可能出现的问题及引导：网页无法显示：检查文件名（主页通常需为index.html或default.html）、路径、大小写。图片无法显示：检查图片路径是否为相对路径，以及是否已上传。链接错误：检查超链接路径。设计意图：通过实际操作发布和访问，让学生体验完整的网站上线过程，获得成就感，突破难点。 了解网页的编辑与发布的整体相关的知识以及掌握相关的重点难点 通过几个学习活动让学习开始掌握本节课的重点及难点<br>课堂练习 用记事本编写网页代码，保存的文件类型是？（所有文件，扩展名为.html）探索思考：如何在互联网上申请一个免费的网页空间来发布自己的网站？ 通过活动，引导学生更全面的掌握相关知识 进一步拓展本节课的学习知识<br>课堂小结 师生共同回顾本节课所学：网页编辑工具、用记事本编写HTML、网站发布的流程和方式。强调：发布意味着责任，注意网络信息安全 引导学生总结自己本节课的学习收获 对本节课的学习进行总结<br>21世纪教育网 www.21cnjy.com 精品试卷·第 2 页 （共 2 页）<br>HYPERLINK "http://www.21cnjy.com/" 21世纪教育网(www.21cnjy.com)</div></div></div></div> <div class="dis"> <a data-sign="signin" data-toggle="modal" href="https://www.21cnjy.com/H/14/240966/23687089.shtml?from=mip" target="_blank">点击下载</a></div></div></div></div> <div class="right-wrapper"> <div class="sCard"> <div class="sCard-header"> <span class="sCard-headerText">同课章节目录</span></div> <div class="sCard-item"> <div class="sCard-itemText"> <ul class="list__tit"></ul></div></div></div></div></div></div> <div class="nav-fix" style="height: 13vw;"> <div class="nav-item" style="display: flex;" id="down" data-isvip="not_is_vip"> <div style="width:100%;" bindtap="bind_down_for_old_buy" > <div style="text-align: center;font-weight: 600;font-size: 16px;background-color: red;color: white;height: 100%;" type="primary" hover-stop-propagation="true">点击下载</div></div></div> <div style="text-align: center; font-weight: 600; font-size: 16px; color: white; height: 100%;" id="downvip" class="nav-item" data-statu="open" data-isvip="is_vip" bindtap="bind_down_for_old_buy">VIP下载</div></div></div> <section class="footer pmk_990_show pmk_1040_show"> <div class="footerCon" style="padding: 10px 0 18px;"> <div class="footerCopy" style="text-align:center">© 21世纪教育网</div> <div class="footerCopy" style="text-align:center">友情链接：<a href="https://www.21cnjy.com/" target="_blank">21课件</a> <a href="https://www.21cnjy.com/" target="_blank">21教件</a> <a href="https://paike.21cnjy.com/" target="_blank">排课软件</a> <a href="https://zujuan.21cnjy.com/" target="_blank">21组卷网</a> <a href="https://book.21cnjy.com/" target="_blank">21书城</a> <a href="https://www.5yggg.com/" target="_blank">汉字大全</a></div></div> </section> <script src="/static/new_h5/js/jquery.min.2.1.1.js"></script><script src="/static/new_h5/js/common.js"></script><script src="/static/new_h5/plugins/layer/layer.js"></script><script src="https://unpkg.byted-static.com/bridge/douyin_open/1.0.10/lib/douyin_open.umd.js"></script><script>
var _hmt = _hmt || [];(function(){var hm = document.createElement("script");hm.src = "https://hm.baidu.com/hm.js?4d3a61fa5f43aa7235738609fe3000f0";var s = document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm,s);})();</script><script src="/static/new_h5/js/login.js"></script><script src="/static/new_h5/js/zydown.js"></script> </body> </html>
八年级信息技术浙教版教学设计
课题 网页的编辑与发布 单元 第二单元 学科 信息技术 年级 八年级
学习目标 1、了解常用的网页开发工具及其特点2、学会使用记事本编写简单的HTML代码，并能保存为网页文件3、理解网站发布的一般流程和常见途径
重点 1、使用记事本编写HTML代码编辑网页；理解网站发布的一般流程
难点 1、理解网站发布的完整流程及相关配置；网页字符编码的理解与正确设置
教学过程
教学环节 教师活动 学生活动 设计意图
导入新课 提问引入：“你知道哪些软件可以用来编辑网页？”小组讨论：学生分小组讨论并上网搜索，记录讨论结果（如记事本、Notepad++、Visual Studio Code、Dreamweaver等）教师归纳：简要介绍不同类型的网页编辑工具基本文本编辑器：如Windows记事本，纯手工代码编写。增强型代码编辑器：如Notepad++、Visual Studio Code，有语法高亮和提示功能所见即所得编辑器：如Dreamweaver（以前有FrontPage），可视化设计界面 倾听老师引入相关问题 激发学生的学习兴趣，让从问题中进行思考，从而引出本节课的学习内容
讲授新课 一、网页开发工具认识HTML文件教师讲解：HTML文件本质上是文本文件2，通过浏览器解释执行2强调：使用记事本编写代码后，保存时文件类型应选择“所有文件”，扩展名必须为.html或.htm8。网页字符编码（知识链接）简要说明字符编码的作用（避免乱码）介绍常见编码：GB2312, GBK, UTF-8（强调UTF-8最常用，支持多语言）展示代码实例： 通常放在标签内。活动一：动手修改HTML代码任务：请学生使用记事本打开本单元正在制作的“人工智能”主题网站中的某个网页文件（例如先前完成的某个页面），尝试修改其中的部分HTML代码（如修改标题