《制作框架网页》教学设计.docxVIP

《制作框架网页》教学设计

*演示效果，说明`iframe`与`frameset`的主要区别和适用场景。

（三）学生实践与教师巡视指导（约40分钟）

*任务布置：

1.基础任务：参照教师演示1和演示2，创建一个简单的两栏（左窄右宽）或两栏（上窄下宽）框架页面，并为每个框架指定不同的内容页。

*学生操作：学生独立或小组合作完成任务，教师巡视，对学生遇到的问题进行个别指导和集中讲解。重点关注：

*标签书写是否规范，属性是否正确。

*框架分割比例或尺寸设置是否合理。

*作品展示（可选）：选取几份学生作品进行简单点评，肯定优点，指出不足。

（四）课堂小结（约15分钟）

1.回顾知识点：师生共同回顾本节课学习的主要内容：框架网页的概念、`frameset`与`frame`标签、框架的分割与嵌套、`target`属性的应用、`iframe`标签。

2.强调注意事项：

*`frameset`与`body`不能共存。

*框架的合理规划与命名的重要性。

*框架技术的优缺点及现代网页设计中框架的替代方案（如DIV+CSS布局）。

3.答疑解惑：解答学生在学习和实践过程中遗留的问题。

（五）作业布置（约5分钟）

2.选做题：研究`iframe`的更多属性（如`scrolling`、`marginwidth`、`marginheight`），并尝试制作一个带有多个内联框架的页面，模拟一个简单的信息聚合页面。

3.思考题：结合本节课所学和自己的上网体验，谈谈框架网页有哪些明显的缺点，为什么现在很多网站不再大量使用传统框架布局？

六、教学评价

1.过程性评价（60%）：

*课堂参与度：学生的提问、回答、讨论情况。

*实践操作表现：能否独立完成教师布置的基础任务和进阶任务，代码书写是否规范。

2.作品评价（40%）：

*对学生提交的作业（框架网页作品）从布局合理性、代码规范性、功能完整性、页面美观度等方面进行评价。

七、教学反思与备注

1.框架技术虽然在现代主流网页设计中已较少作为主要布局手段，但对于理解网页的模块化和早期网页技术发展有一定意义，同时`iframe`在特定场景下仍有应用。教学中应客观评价其价值与局限。

2.实践环节是本节课的重点，应给予学生充足的动手时间，并加强个别指导，确保大部分学生能够掌握基本操作。

3.可以引导学生思考框架布局与后续将要学习的CSS布局（如Flexbox、Grid）的异同，为后续课程做铺垫。

4.注意提醒学生，在使用框架特别是`iframe`嵌入外部网站时，可能会遇到跨域访问限制等问题。

本教学设计注重理论与实践相结合，通过案例演示和学生动手操作，旨在帮助学生较好地掌握框架网页的制作方法，并培养其网页设计的基本素养。教师在实际教学过程中，可根据学生的具体情况和课堂氛围灵活调整各环节的时间和内容。