网页设计与制作(HTML+CSS+JavaScript)教学全套课件（第2版）刘万辉教学资源任务2 网页的基本页面实现.docVIP

《网页设计与制作》课程教学单元设计 淮安信息职业技术学院 第 PAGE 5 页 共 NUMPAGES 5 页 《网页设计与制作》课程教学单元设计 单元2 网页的基本页面实现 授课教师：网页设计与制作 授课班级: 学时：8 教学条件 实训室、HBulider或Dreamweaver、投影设备、广播软件、互联网络 教学素材 教材、课件、实训项目单、授课录像、案例库、教学网站等 教学目标设计 知识目标： （1）掌握HTML5的基本语法； （2）掌握HTML5的基本标签； （3）掌握文字与段落标签； （4）掌握图像与超级链接标签； （5）掌握表格与列表。 能力目标： （1）能读懂HTML基本的文档结构； （2）能根据项目草图，编写基本的HTML文档； （3）能通过浏览页面效果，编写对应的HTML图文混排的页面效果。 任务描述 本任务就是依据草图结构，使用HTML5基本语法，运用文本、图像、链接、表格、列表等标签来编写门户网站的基本页面效果。 教学内容 （1）HTML5的基本语法； （2）HTML5的基本标签； （3）文字与段落标签； （4）图像与超级链接标签； （5）表格与列表标签。 重点： （1） HTML5的基本结构与标签； （2）文字与段落标签、图像与超级链接标签、表格与列表标签的使用。 难点： （1）文字与段落标签、图像与超级链接标签、表格与列表标签的使用场合； （2）图像与超级链接标签、表格与列表标签的参数设置。 任务分析与实现 （1）任务分析； （2）任务实现代码。  教学过程设计 2.1 HTML5的基本语法与基本标签、文字与段落标签（学时数：2） 主要步骤 教学内容 教学方法 教学手段 师生活动 任务描述 任务就是依据草图结构，使用HTML5运用文本、图像、链接、表格、列表等标签来编写门户网站的基本页面效果。 讲授法 多媒体 教师：分析任务 学生：信息交流 知识讲授 HTML5的基本文档格式、HTML5的基本语法、基本标记、属性。 讲授法 多媒体 课件演示 教师：讲授知识 学生：边听边练 学生实践 学生创建一个新页面进行体验基本文档格式、HTML5的基本语法、基本标记、属性。 实验教学法 多媒体 教师：辅导交流 学生：实践练习 知识讲授 文本控制标签的使用方法 标题、段落、换行、水平线 文本的格式化标签b、i、strong、s、u等。 讲授法 多媒体 课件演示 教师：讲授知识 学生：边听边练 学生实践 创建一个新页面进行体验基本文档标签的使用。 实验教学法 多媒体 教师：辅导交流 学生：实践练习 课堂 总结 （1）HTML5的基本文档格式、HTML5的基本语法、基本标记、属性。 （2）标题、段落、换行、水平线、文本的格式化标签 教师讲解 多媒体 课件演示 整理笔记 引导创新 任务拓展 浏览新闻页面，模仿实现某新闻的页面效果。 教师指导 学生自学 多媒体 布置作业 提出要求 教学过程设计 2.2 图像与超级链接标签（学时数：2） 主要步骤 教学内容 教学方法 教学手段 师生活动 知识讲授 图像标签的基本使用方法 讲授法 多媒体 课件演示 教师：讲授知识 学生：边听边练 学生实践 创建一个新页面进行体验图像标签的使用 实验教学法 多媒体 教师：辅导交流 学生：实践练习 知识讲授 超级链接a标签的基本使用方法与属性规则 讲授法 多媒体 课件演示 教师：讲授知识 学生：边听边练 学生实践 学生创建一个新页面进行体验a标签的基本使用方法与属性规则。 实验教学法 多媒体 教师：辅导交流 学生：实践练习 知识讲授 超级链接a标签中锚点的使用方法与影像地图的使用方法 讲授法 多媒体 课件演示 教师：讲授知识 学生：边听边练 学生实践 学生创建一个新页面进行体验锚点的使用方法与影像地图的使用方法。 实验教学法 多媒体 教师：辅导交流 学生：实践练习 课堂 总结 （1）图像标签的基本使用方法与属性规则 （2）超级链接a标签的基本使用方法与属性规则 教师讲解 多媒体 课件演示 整理笔记 引导创新 任务拓展 综合实例：法家庄辉的个人介绍页面。 教师指导 学生自学 多媒体 布置作业 提出要求 教学过程设计 2.3 表格与列表（学时数：2） 主要步骤 教学内容 教学方法 教学手段 师生活动 知识讲授 表格标签tabletrtd标签的基本使用方法与属性规则 讲授法 多媒体 课件演示 教师：讲授知识 学生：边听边练 学生实践 学生创建一个新页面进行体验tabletrtd标签的基本使用方法与属性规则。 实验教学法 多媒体 教师：辅导交流 学生：实践练习 知识讲授 列表标签ulolli的基本使用方法 讲授法 多媒体 课件演示 教师：讲授知识 学生：边听边练 学生实践 创建一个新页面进行体验ulol