第十二课 用表格为网页布局 教学设计 (5)

本资料来自于资源最齐全的２１世纪教育网www.21cnjy.com
第十二课
用表格为网页布局
教学设计
1教学目标
知识目标：学会用表格排版主页使其达到页面整洁有序；
技能目标：掌握在网页中插入表格的方法；学会分析版面并根据特定的版面设计不规则的表格；
情感目标：培养批判性思维，养成深入分析和思考问题的好习惯。
2学情分析
经过前面的网站规划、主页的设计、素材收集处理，同学们已经迫不及待要尝试制作网页。但是在没有学习表格的情况下，网页的排版非常困难，很多同学已经怨声载道。在这种情况下，再来为学生介绍表格，事半功倍。2·1·c·n·j·y
3重点难点
重点：插入表格、不规则表格的制作
难点：根据不同的版面制作表格
4教学过程
活动1【导入】学习引入
师：这几节课我们都在做网站，同学们凭借自己丰富的想象力，已经设计好了自己的主页，而且也用fp进行了制作。老师想问问同学们，用了fp，你有怎样的体验，又遇到了哪些问题呢？21世纪教育网版权所有
（前面一节课，已经有同学在抱怨，fg中图片的定位很难，没有word中方便）
师：我们来看，这是上节课一位同学的作品，但是显然这并不是他想要的效果，后来经过简单的重新排版，对比这两个网页，你有什么发现？21教育网
生：修改后的网页看起来更加舒服
修改后的网页比较有序
……
总结：相同的内容，不同的排版会呈现不同的效果，合理的排版很重要。
活动2【讲授】新课讲授
1.表格的插入
师：既然排版这么重要，这节课，老师就要给大家介绍一种网页排版的法宝：表格。首先来看一下这节课我们的第一个挑战任务。21·cn·jy·com
任务一打开网站“美，无处不在”，从自然之美、生命之美、旋律之美和运动之美四个子网页中，任选一个网页进行重新排版，是页面变得井然有序。以生命之美为例：
排版前
排版后
师：我们请一位同学来给我们分析一下，你认为完成这个任务的步骤是怎么样的？
生：插入表格，把内容拖到相应的表格当中。
师：好，接下来给大家几分钟时间来完成挑战一。
各类属性的设置
师：利用表格，我们能把一个杂乱无章的网页变得布局更加合理，那么，老师想问问大家，你觉得现在这个网页是否已经完美了呢？和一个成品的网页对比，你觉得还要修改哪些地方？www.21-cn-jy.com
生：配色、字体等
任务二：请你对布局好的网页进行加工，使其更接近一个成品网页。（提示：属性的设置）
第二学时
活动1【讲授】新课讲授
相信经过上一节课，同学们已经基本上掌握了表格的使用方法。但是啊，并不是所有的网页排版都如此简单，比如下面几个网页（打开几个具有代表性的网页页面表格的布局设计）。网页设计的时候，经常会遇到不规则的排版，这个时候就需要我们根据需要来制作不规则的表格。以第一个网页为例，首先我们来分析一下这个网页的版面（演示教学：利用画图工具对版面进行分割），分析完版面之后，我们需要利用表格在网页中实现（演示教学：单元格的合并、拆分）。21cnjy.com
活动2【活动】任务一
1、将自己设计的主页进行版面分析，并用表格的形式实现；
2、在表格中充实内容，是网页内容丰富起来；
21世纪教育网
--
中国最大型、最专业的中小学教育资源门户网站。
版权所有@21世纪教育网