工学一体化课程教学课页NO2
课程
网站设计与开发
学习任务
项目二：利用HTML5搭建网页结构
使用学材
《HTML5+CSS3网站设计基础教程》、辅助学习资料
任课教师
XXX
班级
XXX
所属专业
XXX
实施地点
实施日期
总课时
周课时
学材处理
采用一体化教学模式，以学生为主体，围绕课程标准、以典型工作任务展开，知识点够用、适用为原则，并配合相关教辅学习资料，同时根据学生特点自行设计的课后补充任务进行强化实践用。在辅助知识和技能点学习时加入一些思政元素（安全、心理健康教育等内容在网页内容中）。
任务分析
明确任务要求后，查阅相关辅助学习资料，如HTML5框架新增的结构元素、分组元素、页面交互元素、文本层次语义元素以及常用的标准属性等内容的相关用法，确定该网页框架所需元素，在规定时间内制作一个“青少年健康教育页面”。
HTML5中引入了很多新的标记元素和属性，这些新增元素使文档结构更加清晰明确，属性则使标记的功能更加强大，掌握这些元素和属性是正确使用HTML5构建网页的基础。本项目将HTML5中的新增元素：结构元素、分组元素、页面交互元素的综合应用，搭建出结构清晰地网页框架。
教学目标
（包含知识与技能、过程与方法、情感态度与价值观等三个目标）
知识与技能：
掌握列表元素的用法，能够用列表元素制相关列表页面内容；
掌握结构元素的使用，能够利用结构元素搭建网页框架。
理解分组元素的使用，能够建立简单的标题组。
掌握页面交互元素的使用，能够实现简单的交互效果。
理解文本层次语义元素，能够在页面中突出所标记的文本内容。掌握全局属性的应用，能够使页面元素实现相应的操作。
过程与方法：
1.学生通过自主探究、小组合作，培养学生协作解决问题的能力和主动性。
2.通过小组之间的沟通、作品展示汇报等，锻炼学生与人交流合作的的能力；
3.通过教师引导学习，锻炼学生自主学习能力；
4.通过最后的总结点评分析，锻炼学生分析、总结的能力。
情感态度与价值观；
让学生感受HTML5与CSS3的神奇之处；
在学习制作网页过程中，培养学生探索、创新、实践、协作的职业素养；
让学生从网页内容中汲取一些安全、心理健康教育的知识，达到协同育人的目的；
让学生通过项目网页内容的无形渗透，培养学生热爱生活的态度。
教学重点
教学难点
重点及突出策略：
教学重点：列表元素、结构元素、分组元素、页面交互元素的综合使用。
措施：通过教师引导、学生上机操作加强学习和补充案例进行巩固。
难点及解决方法：
教学难点：结构元素与页面交互元素。
措施：通过教师台上演示、学生上机操作加强学习和补充案例进行巩固。
教学方法
项目教学，小组讨论，一体化教学
教学条件
准备
计算机、VSCode软件、教学PPT
教学组织
（简述并备注每一流程所需课时）
一、明确任务
教师给定任务，引导学生思考，明确任务要求（0.5课时）
二、制定工作计划（3课时）
分析任务后确定以下工作计划
教师引导学习，学生完成所需知识点学习；
按任务要求，制定工作计划
三、计划实施（5课时）
能正确使用所需HTML5新增元素，并按各模块效果图进行代码编写，并实现效果。
四、检查验收（0.5课时）
检查任务完成情况，正确填写检查报告
五、总结反思与评价（1课时）
以小组为单位，用演示文稿向全班展示、汇报制作成果；教师针对各组任务工作过程及汇报情况分别作评价；工作过程回顾及总结。
教学反思
教学实施（次页）
教学环节
教学内容
学生活动
教师活动
评价点
资源
用时
一明确工作任务
工作任务的阅读与分析；
明确工时、工作内容和人员分组；
接收任务并进行阅读分析；
根据任务要求进行人员分工；
3、与小组成员讨论网页中所需效果等要求；
1、发放任务并说明要求；
2、指导各小组进行任务分工；
3、察看、记录学生小组讨论情况及所存问题；
4、引导学生讨论所存实际问题（分工明确性）
5.检查学生填写工作页的正确性
1、是否明确任务、工时；
2、小组任务分工是否合理；
3、对任务理解、表达是否到位；
4、工作页完成是否到位；
5、小组积极性。
工作任务
0.5课时
二制定工作计划
HTML5中的新增元素：结构元素、分组元素、页面交互元素和文本层次语义元素的应用方法学习与实践
制作页面效互效果的方法、步骤及注意事项
认识并选择HTML5元素
工作计划的制定
查阅教