admin 管理员组文章数量: 887021
2023年12月19日发(作者：把html文件改成jsp文件)
第2章 使用HTML5搭建旅游公司网站首页结构
课程名称
任务名称
项目性质
授课班级
Web前端开发
HTML5标签
项目名称
课时
使用HTML5搭建网页
2
□演示性 □验证性 □设计性 √综合性
能力目标：
授课日期
授课地点
1. 具备熟练使用HTML标签的能力
2. 具备使用HTML标签搭建网页基本结构的能力
知识目标：
教学目标
1. 掌握网站目录结构规划的方法
2. 掌握使用HTML5标签搭建网页基本结构的方法
素质目标：
1. 培养学生信息搜集能力
2. 培养学生团结合作、互帮互助的能力
1. 任务描述
2. 任务展示与实现
（1）创建云景旅游公司首页目录结构
（2）使用HTML5标签搭建云景旅游公司首页顶层结构
教学内容
（3）使用HTML5标签添加网页内容
（4）学生动手操作
3. 教师讲解本任务涉及的知识点
4. 任务小结
教学重点
1. 网站目录结构规划
1
2. 使用HTML5标签搭建网页基本结构
教学难点
1. HTML5标签搭建网页结构的方法
1. 装有Sublime或者Hbuilder的电脑
教学准备
2. 教学课件PPT
3. 教材：《Web前端技术项目式教程》
作业设计
1．制作广东云景旅游公司二级页面“公司概况”的HTML5页面。
教学过程
教学
环节
课前组织
课程
说明
教学内容与过程
（教学内容、教学方法、组织形式、教学手段）
做好课前“5分钟”教学管理（多媒体、实训室），做好上课前的各项准备工作（打开电脑、打开课件、打开软件、打开U盘中的素材位置、打开授课计划、教案等），吸引学生注意力。
【课前说明】
分别介绍网站目录规划的方法、分析根据网页效果图搭建HTML5网页结构的流程。
【目的】
使学生从了解本单元的学习目标、学习重点、考评方式等方面明确学习本单元知识的要求和目标。
2
课程
内容
描述
一、规划网站目录结构
二、分析首页文档结构
三、构建首页结构
HTML5提供网页文档内容的上下文结构和含义。因此要尽可能使用语义化分段元素写出网页的结构代码。在对首页结构分析的基础之上，写出首页的结构代码。
四、添加网页内容
(1) 添加
3
(2) 添加
(3) 添加
(4) 添加
四、任务拓展
制作旅游公司网站二级页面
课堂
实训
1、制作“华阳湖景区”页面
4
关于华阳
群山中的华阳湖如一颗璀璨的明珠
景区以高山截流的华阳湖为中心，随境造景，分别建有水上游乐区、 民俗园区、茶文化园区、野果采摘区、会务区、别墅区等各种功能齐备的观光游览服务区。景区建筑红墙黄瓦，独具文化特色，在大自然的碧水青山映衬下，俨然托出了一片充满魅力的人间仙境。 景区内，游人或可乘小艇劈波于华阳湖上，或可迈步湖畔长堤听山泉喷涌和松涛轰鸣，或可登临拜佛台感悟华阳大佛的广博心境，或可循小径去探索“望夫石”、“观音洞”等美丽的传说中的中华民族的深厚文化底蕴。
华阳美景
- 花海田园
- 种植花卉形成花海和花坡景观，种植蔬菜、水果形成农田景观,游客可以采摘新鲜水果品尝
5
- 水上森林
- 营造湿地水上森林景观，游客可以乘船在森林水道中划行，也可以漫步于森林
中
- 花船巡游
- 各种花争妍斗艳，让游人目不暇接。沿蜿蜒的水道，花船驶入花丛中，让游客与花亲密接触
- 花海田园
- 龙舟比赛常态化，游客可以观赏到专业的龙舟赛事，同时也可以参加龙舟拓展
项目
- 水上森林
- 种植花卉形成花海和花坡景观，种植蔬菜、水果形成农田景观,游客可以采摘新鲜水果品尝
6
- 花船巡游
- 各种花争妍斗艳，让游人目不暇接。沿蜿蜒的水道，花船驶入花丛中，让游客与花亲密接触
总结
评价
通过学习，学生能够掌握使用HTML5标签搭建网页结构的基本方法。
本节课主要运用案例教学法，通过对HTML5标签的深入理解，掌握HTML5基本标签的使用方法，达到能够独立熟练运用HTML5标签来搭建网页基本结构的能力。教学评价方式以小组为单位，以完成案例的质量为评价标准，形成任务驱动，小组协作，质量与速度并存的课堂评价方式 ，促进学生的自主、创新学习的方式。
8
版权声明：本文标题：Web前端技术项目式教程(HTML5 CSS3 Flex Bootstrap)教案-使用HTML5搭建 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.freenas.com.cn/free/1702929719h436356.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论