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

本资料来自于资源最齐全的２１世纪教育网www.21cnjy.com
第十二课
用表格为网页布局
教学设计
1教学目标
知识与技能：
1、了解网页设计中表格的作用。
2.、掌握网页中表格的制作方法以及单元格的合并编辑方法，能够在单元格中正确插入文字和图片。
3、能够根据网页设计内容，正确布局表格的结构。
过程与方法：
通过用表格结构设计网页，使学生进一步理解表格的作用、功能及网页设计方法的多样性，培养学生的发散思维能力。
。21教育网
情感态度与价值观
通过运用表格布局网页各人根据网站主题，设计网页，进一步掌握单元格表格设置的操作，获得成就感
2学情分析
八年级的学生刚好处于小学生与初中生的中间阶段，因此在认知点的接受上已经由单一的知识点输入向更为抽象的知识的接受理解上过度。因此在对操作性较强的课程内容上刚好可以发挥学生的主观能动性，实现教学。21·cn·jy·com
3重点难点
重点：插入表格并设置表格。
难点：划分网站主页结构。美化表格。插入艺术字和图片
4教学过程
活动1【导入】导入环节
上课了，请大家放下手中的操作，把集中到老师这边，上课之前老师要先考考大家的记忆能力了，大家还记得怎么为网站新建一个站点文件夹和主页呢？现在跟着老师一起回忆一下，在哪里打开？打开fwww.21-cn-jy.com
活动2【讲授】创设新知
同学们都出过黑板报吧，在出黑板报之前我们都需要做什么呢？对进行排版设计，那我们在做网站之前是不是也应该进行布局设计呢，这样子才能做到事半功倍，接下来我们这节课我们每一个同学都说一个小小的设计师，学习如何为网页布局。2·1·c·n·j·y
首先我们来欣赏一下几个网站，在欣赏的过程中，大家注意网站的位置，内容等。第一个网站是温州大学的网站。第二个是社团网，第三个是可口可乐的官网，大家观察一下，是不是都是这三个网站哪些板块是不同的，那个是最不同的呢？【来源：21·世纪·教育·网】
做一个设计师呢
首先要了解网站的组成板块。
现在我们来具体分析一下一个网站由哪些板块组成，最上面这个我们给它起个名字，叫什么好呢，标题。下面的有很多栏目，一点呢可以分别到达不同的页面，我们叫他什么呢？平时爸爸妈妈带我们出去旅游，如果不知路线，我们会在车上装一个什么啊？对GPS，又叫导航，这个我们就叫他导航。。。。。。21·世纪
教育网
一般网页的板块由。。。。。构成的，这些模块又可以组成不同的布局，设计设们设计出不同的组成板块，我们来看一下这个设计师的作品，他叫什么名字呢，大家一起来猜猜。老师给大家一个提示，我们小学的时候语文老师教我们写字，会告诉我们这个字是上下结构，这个字是左右结构，同学们看一下这个是布局是什么结构呢。www-2-1-cnjy-com
对半包围结构，这个网页就是半包围结构的。这个设计师的作品
那网站布局就仅仅只有四种类型吗？不是的。这些网站跟我们之前讲的是不是很不一样啊，所以网站的布局不是死板的，只要能突出主题，表现网页内容就可以了。
活动3【活动】步步为营
现在轮到我们同学来设计了，各位设计师们要根据自己的网站来选择一个布局或者是发挥想象来设计，记住哦，并不拘泥于四个网页布局，我们来比比谁的设计更有新意。
下面呢我们要来完成任务一了
完成后进行点评（1分钟）
大家带这个疑问，进入我们的游戏环节，
拼图游戏。演示，编辑网页用Frontpage,打开进行编辑。观察学生发现怎么也拼不好，拼不好，提示学生打开game2,大家看看，game2比game1多了什么东西呢，我们是不是要好好利用呢，老师，发现很多同学都拼好了。通过这个游戏你能发现什么吗？在game1中，我们发现有些图片移动不了或者到不了你想要的位置，也就是在网页中图片的不是你想放哪里就放哪里的，在game2中我们利用了表格对图片进行定位，所以表格在网页布局中起到了定位的作用，便于我们进行编辑。接下来看老师设计的布局，同学算一算利用表格布局可以插入几行几列。21世纪教育网版权所有
大家看一下，我们标题栏占了几列，有什么方法把它变成一列？我们在word中已经学过了表格操作了。
接下来我们完成任务二
演示打开站点文件夹中的主页，在主页中进行布局。请学生上台演示。表格很窄进行拉伸，合并单元格，非常好。教师演示其他操作，布置选做题。21cnjy.com
活动4【活动】点评
点评学生作业，分析难点
21世纪教育网
--
中国最大型、最专业的中小学教育资源门户网站。
版权所有@21世纪教育网