应用表格布局网页结构

应用表格布局网页结构教学实录 作者：阜宁县明达中学姜秀菊来源：本站原创点击数：1078更新时间：2010-6-12文章录入：yc_chl 知识与技能目标：1、了解表格在网页设计中的作用。2、掌握网页中表格的制作方法、表格属性的设置方法以及单元格的修饰与编辑方法，能够在单元格中正确插入文字和图片。3、区分表格属性和单元格属性，并掌握属性的设置。4、能够根据网页设计内容，正确布局表格的结构，掌握表格嵌套的设计方法。过程与方法目标：1、利用对比学习，形成知识迁移的能力2、通过用表格布局网页，进一步理解表格的作用、功能3、通过对比学习与自主探究，了解并掌握软件学习的一般方法及规律，提升自主学习能力4、通过任务驱动学会情感态度与价值观目标：1、通过对用表格布局网页的学习，增强审美观，提高对学习网页制作的兴趣。2、通过“保护动物”网站的制作，激发学生关爱动物、保护动物的责任感，从而进一步树立共同改善人类生存环境的意识。教学重点与难点：1、重点。（1）了解表格在网页设计中的重要作用。（2）掌握插入、编辑表格的方法及表格的属性设置方法。（3）掌握单元格的修饰属性的设置。2、难点。表格的嵌套在网页设计的重要作用。教学准备：各自制作的站点文件夹，整理、归类相关素材并按要求摆放。教学过程 一、导入：播放歌曲“一个真实的故事”，激发学生兴趣，与学生互动。师：这首歌里讲的是什么样的故事呢？生回答。一个姑娘救丹顶鹤的故事师：丹顶鹤，它是一种珍稀动物，同学们还知道哪些珍稀动物呢？是从哪里知道这些珍稀动物的呢？生抢答。扬子鳄，大鲵，金丝猴，丹顶鹤师：很好，同学们知道的可真多啊，是从哪里知道这些珍稀动物的呢？生回答：书，报纸，网络师：同学们知道，但是很多人不知道呢，更不知道人与动物要和谐相处，我们是不是有必要做些宣传。为保护珍稀动物尽一份力？生：对师：但是这么多珍稀动物在网页上应该如何分布呢？展示：两张素材相同布局不同的网页（动物人类的朋友）。（然后将两个页面并排显示在投影上）提问：同学们，请大家比较一下这两个网页，相互之间可以讨论一下，那一个网页布局更合 理，哪张较美观？较美观的那张网页是怎么布局的？（请学生回答，请坐。）【设计意图】展示作品，激发学生兴趣；引导学生发现问题，并学会分析问题。观察和比较两张素材相同布局不同的网页，分析布局网页页面的元素。这两个网页，通过比较会发现：一个是页面工整，文本、图片摆放对称且有一定规律，使用表格布局，但表格边框隐藏（看不出表格痕迹）；一个是页面凌乱，有图有文，摆放杂乱，提出问题，有什么办法可以达到第一个页面的效果？二、新授：1、分析表格结构布局展示一些由表格布局的网页，引导学生分析其表格结构，自然过渡到书本例子（biaoge.htm），分析结构，得出表格的布局（几行几列，哪些行做了哪些处理）。（1）归纳：较美观的一组是利用表格来布局的。提问：谁能看出这张网页中所隐含的表格是几行几列的？ 展示：分析网页中所隐含的表格结构。 （2）学生讨论、交流，FrontPage中表格的插入和编辑与Word中的表格操作雷同，教师无需讲解，引导学生知识迁移。 任务一、学生操作：插入10行一列的表格。2、编辑表格并完成页面布局 演示：进行插入表格和编辑表格（合并、拆分单元格）任务二、学生观察示范，学生与教师进行合并、拆分单元格的实践操作。3、充实网页内容：任务三、在表格中插入图片、输入文字展示学生作品，引导学生发现表格页面中存在的问题，教师提出需要做哪些修改？ 学生回答：图片的大小，对齐方式，边框线、背景的设置。 4、 表格嵌套生：图片调整后，其它单元格随之变化，如何解决这个问题？师：这就要用到表格的“嵌套”。【设计意图】这是本节课的重点，布局主要就是通过插入表格、表格嵌套、拆分单元格来实现的。让学生动手制作，体验表格的作用；以任务驱动形式自主学习，然后让学生自己发现问题，并解决问题，推动学生的探索意识和交流能力。教师讲解，表格嵌套的含义，并演示。任务四：表格嵌套，把第一和第二行的单元格各自合并后，分别插入表格。5、 调整表格属性，美化页面教师演示：表格、单元格属性的调整。 任务五：表格属性以及单元格属性的编辑。调整图片大小、位置，设置单元格与表格属性。 A、表格属性的调整去除网格线、设置表格背景色等 B、使用不同的颜色区分各版块单元格属性的调整 强调：鼠标右键快捷菜单。辅导：教师巡视各小组的实践操作练习，对特殊学生给予较多的个别辅导机会。 学 生以小组为单位，进行“表格布局网页页面”的实践操作练习并进行交流展示。 一般学生： 模仿课本中例子完成一张网页的表格布局。 优秀学生： 自主设计网页的页面布局，教师给予一定的辅导。6、保存、预览网页 任务五：保存、预览网页，并互相评价、学习。7、提高内容：请做的好的学生尝试做出拓展作业里的网页的表格布局。【设计意图】鼓励学有余力的学生自主探索；鼓励学生质疑，疑问是学生探索、创新的动力源泉三、作品的展示交流评价：（教师评价与学生评价相结合） 展示表格页面制作完成的优秀作品，表扬完成任务的同学，对未完成的同学给予激励，鼓励他们利用中午以及下午放学时间抽空到机房继续完成。四、小结本节课我们学习了在FrontPage中插入表格、编辑表格以及表格嵌套的基本方法。请同学们回答几个问题，并演示几个基本操作。在网页制作中，我们经常利用表格来布局和规划网页的版面。表格在网页制作中能很好的控制文本和图片，表格能让你的页面具有良好的易读性。利用表格的详细设置，你能创建符合页面需要的表格。 五、教学反思信息技术课是一周上一节，网站的制作上过一次，学生对网页编辑工具和打开站点都已经生疏了，所以，在学生操作之前我先演示如何打开站点，这样学生就能快速的回忆原来的知识，上手比较快。应用表格布局网页是网站制作的第三课时。本节课的重点应该是首先让学生了解表格在网页设计中的作用，所以在课的一开始，我通过对比引入，加上复习回忆Word中的表格，了解表格的不同的功能，让学生明白表格的网页设计中的重要性。重点之二就是掌握网页中表格的制作方法及其基本编辑方法。FRONTPAGE中表格的制作方法与WORD有很多相似之处，所以学生应该都是有表格制作的基础的，我运用了知识的迁移，适当的和学生一起回顾一下，这样可以使学生知道不同软件之间是有互通性的，突破以往满堂灌的形式。重点之三就是区分表格属性和单元格属性，并掌握属性的设置。这一部分主要是让学生知道打开对象属性的方法，掌握操作共性。表格属性和单元格属性参数的设置并不难，主要是让学生带着问题自己探索，从而区分表格属性和单元格属性。对于难点部分“表格的嵌套”，我让学生自己发现问题，先思考，然后教师解答并操作。这样学生就掌握了。最后通过拓展任务体现分层教学。考虑到学生的差异，本人还提供了学案加以辅导，学生的任务达成率比较高。在整个教学过程中时时引导学生去探索问题、解决问题，从而引动和维持学生学习的兴趣和动机。教学过程看起来比较多，但环环相扣，层层递进。本节课也有一些不足之处，一是学生还不习惯小组的合作，很多的同学自己忙自己的。在以后课堂中要想办法激发学生小组合作意识。二我高估了学生的基础，本应在上节课学会的东西，比如调整图片的大小等，学生并没有很好的掌握，所以导致部分同学表格不太好