《《应用表格布局网页结构》教学设计.docx》由会员分享，可在线阅读，更多相关《《应用表格布局网页结构》教学设计.docx（14页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、应用表格布局网页结构教学设计 应用表格布局网页结构教学设计 一、教学目标 学问与技能： 1、了解表格在网页设计中的作用。 2、能够依据网页的内容，正确布局表格的结构。 3、驾驭网页中表格的制作方法，能够在单元格中正确插入文字和图片，驾驭表格属性的设置方法以及单元格的修饰与编辑方法。 过程与方法：通过观看优秀网站表格布局，动手设计表格等环节，帮助学生进一步了解表格的作用、功能以及网页设计方法的多样性，培育学生的发散思维实力；通过学生自主地编辑和修饰表格等环节，培育学生自主探究学习的实力。 情感、看法与价值观： 1、提高学生自学和探究的实力，培育学生应用表格布局网页结构的爱好。 2、提高学生语言表
2、达实力，学会客观的评价作品。 二、教学重点与难点 重点：了解表格在网页设计中的重要作用 驾驭插入、编辑表格以及表格，单元格的属性设置方法。 难点：表格的嵌套 表格，单元格，网页属性的设置 三、教学方法 讲解演示教学法，小组合作学习法，自主探究学习法 四、教学设计说明 本节课是初中信息技术（下册）2007年7月第一版第11单元设计主题网站其次节的内容，教学面对的是初二年级的学生，该年龄段的学生已具备了肯定的信息素养，驾驭了基本的信息技术学问和技能。 初中的学生喜爱新、奇、特的事物，接受实力和理解实力比较快。而直观、醒目的网站示例图片则可以培育学生对于本课题的爱好，但是学生对于如何应用表格布局网页
3、结构的操作是比较模糊的。因此本节课充分地发挥学生了的主动性，让学生随着学案所设置的环节，探究完成一个又一个的应用表格过程。而学案则是在敬重学生解决问题的思维过程方式的基础上设置的，注意学生的学习体验和情感的体验。整节课以学生为主体、老师为主导的架构下，搭建以生为本的情景学习近平台，帮助学生自学、沟通探讨、深化探究，以不断的完成应用表格布局网页结构的过程为手段，一步步完成学习任务。 五、教学过程 课前将素材和网站站点发送到桌面，指导学生解压缩。并带领学生熟识本节课所要制作的网页的素材。 （一）设置情境，引入课题 师：我们知道，地球是人类赖以生存的家园，然而，近几年来，地球的环境却越来越恶劣：全球
4、性气候变暖、暴雨、雪灾等灾难性天气频繁出现，给我们的生活带来严峻威逼。因此，我们每一位同学，都有责任去爱护环境，那么我们应当如何去爱护环境呢？我想首先是宣扬环保、提倡环保。那上一节课呢我们已经建立了以环保为主题的站点，学习制作了网站的欢迎页。今日这节课，我们将一起学习制作网站的主页面来宣扬环保，那如何来设计主页面呢？首先我们先来观赏几个闻名网站的主页。（播放课件） 师：你们能看出这些是哪些网站的主页吗？ 生：网易，新浪，搜狐 师：很好，它们分别是网易、新浪、搜狐的主页面。我们知道这些网站的主页面包含的内容都相当丰富，但给我们的视觉感受却是繁多而不杂乱，紧凑而不单调。这些页面设计是如何做到这一点
5、的呢？ 师：我们以搜狐主页面为例，（呈现搜狐主页面的图片），来探究一下如何设计网站的主页面。首先这一页面的左上角有一张的搜狐的LOGO图片，使我们一眼能认出这是搜狐页面。在图片的右边呢，是网站中的导航，通过导航链接到其它的页面。下面的主体部分，分成了几个区域，我把它标示出来，这样我们不难看出，中间部分，是一些小信息的链接。上面这一部分以广告信息为主，下半区域分成了四个部分，分别是新闻，消遣，体育以及广告图片。通过标示，我们会发觉这呈现出来的其实就是一张表格的摸样（可启发学生回答）。 师：因此，运用表格来布局网页结构，是使页面清楚紧凑，整齐大方的简便有效的方法。那今日这节课，我们就一起来学习应用
6、表格布局网页结构，也做出这样一张页面出来。 设计意图：所选的网页学生都比较熟识，师分析页面，呈现本节课的课题，激发学生的学习爱好。 （二）新课学习 环节一：依据素材，小组合作设计表格。 师：课前同学们已经熟识了素材。既然我们要应用表格布局网页结构，那就要先进行设计。 师：刚才同学们也观赏了搜狐等网站的主页面的表格布局。 师：下面呢，请同学们拿起笔在老师供应的纸上来设计表格。以相邻的四个同学为一个小组，比照素材，探讨沟通，在纸上画出你们将要制作的页面的表格布局，并对表格中将要添加的内容进行标示。 学生以小组为单位，设计表格。 师：许多小组已经完成了，下面我们选择一些小组的同学到前面来展示一下你们
7、的设计，并简要说明你们的页面布局。其他同学留意看，留意听，看看有没有值得借鉴的地方应用到自己小组设计的表格中去。 展示几个小组所设计的表格 设计意图：以小组为单位动手设计表格可以培育学生的合作探究实力。让学生通过沟通探讨后设计表格，可以集结多人的才智，让轻松的氛围中设计出表格。 环节二：动手实践，编辑表格 师：同学们都已经将表格设计好了，下面我们就来动手实践，将表格在网页中绘制出来。 师：首先，请同学们打开FrontPage，从文件菜单中打开站点“huanbao”，并新建一个页面。 师：那如何来绘制表格呢？请同学们参照学案，先尝试看看如何插入表格？（学生探究） 生依据学案，自己先探究完成表格的
8、插入 师：哦，这里供应了一个特地供表格运用的菜单。我们这边可以运用表格菜单，打开表格对话框，就涉及到添加的表格是几行几列的了。这里呢，老师有一个建议：暂且以最多行，最多列来计算表格的行列数。举个例子，请同学们留意看老师这里的一张表格样例。同学们数数看，这里的表格是几行几列。 生：9行5列（学生思索） 师：同学们可以很清晰地看出，9行，那列数呢？我们这里暂且以最多列计算。 生：5列 师：同学们的表格也是这样的。请同学们依据你所设计的表格的行列数插入表格。 师：表格插入好了以后，同学们，我们一起来看一下，这个插入的表格跟我们在图纸上设计的表格一样吗？ 生：不一样 师：哪里不一样？ 生：插入的表格是
9、分成若干个等分的小单元格，而我们在图纸上设计的表格中有许多不等分的小格子。 师：那这里呢，就要对表格进行编辑了。因为刚刚我们是根据最多行，最多列来计算的，那这里只须要对多余的单元格进行合并。 师：那如何对单元格进行合并呢？同学们有没有学过在word里编辑表格（假如有，可实现学问的迁移；假如没有的话，老师送一把万能钥匙右击法），请同学们编辑表格。（与学生互动，尝试让学生讲解操作） 师：每一个小组的同学要相互帮助，帮助没有完成的同学对表格进行编辑。 师总结：我们刚刚通过表格菜单栏，打开表格对话框，插入表格。在对表格进行编辑时，是根据最多行，最多列计算的。还可以采纳其他的计数方法，同学们可以依据个人
10、状况敏捷运用。 设计意图：让学生依据本小组设计的表格布局，插入表格，再对表格进行编辑，注意了学生在课堂中主体性的体现。在编辑表格时，可以通过以前所学的WORD中表格的编辑方法，从而实现学问的迁移。 环节三：依据设计，填充表格内容 师：表格编辑好了以后，一张空表就完成了。下面就要起先填充表格内容（展示我的表格填充完成的效果）。我们这里的内容，跟据素材，主要是图片和文字。那上一节课呢，我们已经学会了在首页中添加文字和图片了，那这里的添加方法和前面是一样的，不同的是，这里须要将图片和文字添加到对应的单元格中，所以在插入之前，肯定要先定好位。下面请同学们依据素材和自己的设计添加表格内容，可参考学案。学
11、案中，也供应了文字和图片填充到表格中的方法。 学生动手填充表格内容，使网页更立体丰富。 老师视察学生操作，讲解表格的嵌套 师：在老师刚刚巡察过程中，发觉有些同学采纳了这样的表格布局，将按钮图片放在LOGO图片的右边，这里的按钮图片有五张，我们怎么实现它们的放置呢？ 学生思索 师：这里呢，老师教给大家一个方法，可以在这个单元格中再插入一个表格，5行1列，这样就可以将5按钮图片匀称地相对固定地放在这个单元格中。这就是表格的嵌套。感爱好的同学可以依据须要尝试添加。 设计意图：学生协作学案填充表格内容，体会在表格在FrontPage中的作用：定位对象 环节四：最终修饰，美化表格和单元格 师：同学们已经
12、学会应用自己的设计的表格布局网页结构，那同学们想不想你们的页面更美丽呢？ 生：想。（跃跃欲试） 师：哦，下面我们就来美化我们的网页。请同学们说说看，我们可以从哪些方面对页面进行美化呢？（抛出问题） 生：字体 生：单元格里的颜色等 师：那这里呢，老师供应一个操作，右击我们看到有三个属性，分别是网页属性、单元格属性以及表格属性。同学们可以选择不同的属性，打开相应的对话框，美化页面。 学生调整表格属性，美化页面 组中完成得较快的同学帮助本组其他同学完成表格的编辑。 设计意图：让学们动手美化页面，使学生驾驭表格属性的设置方法以及单元格的修饰方法与编辑方法。 环节五：探究实践 师：下面请同学们预览你们的
13、网页，有没有发觉页面上有表格边框，那同学们刚才看我们搜狐等网站的主页面的时有没有边框啊？ 生：没有 师：如何将边框去掉呢？请同学们探究看看。（可协作学案）师提示：可选择右击，打开表格属性对话框，对边框的粗细进行设置 师让探究出来的同学上前演示并讲解制作方法。 师：请同学们接着完成你们主页面的制作，并留意保存。 学生进一步练习，师巡察指导。 设计意图：应用表格布局网页结构的基本操作已经驾驭了，因此师让学生做进一步的探究，如如何去除表格的边框使页面更自然美观，培育学生的探究精神。对于表格的嵌套，可以让学生依据须要自主探究实现。 环节六：作品展示，进行评价 师：通过对表格进行设计，编辑，填充，修饰等
14、操作，同学们都已经制作完成了一张用表格布局的爱护环境的主页面。下面呢，我们一起来看看同学们的作品。请制作者呢，谈谈你的设计特点以及制作流程。其他同学们也可以提出自己的建议和看法。 师总结。 设计意图：展示部分同学的作品，首先自身先说说特点，其他同学做点评。可以培育学生客观的评价作品的实力。 （三）总结 本节课我们应用表格制作完成了爱护环境的主页面。通过实践操作，我们发觉布局网页结构其实并不难。正如“耳闻不如目见，目见不如足践”。正如爱护环境其实离我们也不遥远。从不乱扔纸屑，保持机房整齐，节约每一滴水，每一度电这样的小事做起，我们就能为爱护环境做出一份贡献，成为爱护地球的小卫士。 教学反思 课堂
15、教学展评活动结束了，我在响水中学开设的课题为初中信息技术下册第11章其次节应用表格布局网页结构，现将本课教化教学实践中的再相识和再思索反思如下： 一、选取课题，自主探究 接到课题时，考虑到最近环境问题造成的灾难频发，将网站的主题确定为环境爱护。通过“环境爱护”网站的制作，培育学生宣扬环保，提倡环保的意识，并将这种意识在日常的行为中体现出来。在教学流程的设置上，从设计表格制作表格（插入和编辑）填充表格内容修饰应用表格制作的网页着手，真正做到学生为主体，老师为主导的教学模式。同时，给学生供应了学案，便利学生更好地发挥小组合作实力和自主探究实力。在教学内容得选择上，因为本节内容须要2-3节课的课时。
16、所以在教学内容的选择上将Flash等动态对象的制作放到下一节课讲解。本节课的重点侧重于让学生通过本节课的学习能够学会运用表格完成一张网页的制作。 二、表格示例的讲解（不足之处） 在本节课的讲解过程中，表格的设计部分花的时间比我想象的多。学生一起先不知道从何入手。我分析了两个缘由：一是学生对于信息技术课可能更习惯于仿照学习，让他们动手自己设计有肯定的难度。二是我在课前没有考虑到将一个表格示例放在屏幕上供学生参考，之前考虑到更多地是希望学生自己设计，有自己的创意想法。我在讲解时应当带着学生将示例分析一下，并在供应给学生的学案上添加一个设计的简洁的表格示例。 三、表格嵌套的讲解 在讲解表格嵌套时，本
17、想用自己设计的一个示例讲解。在课堂教学中，巡察过程中有一个同学就遇到了须要通过表格嵌套才能解决的问题。这样对于这部分的讲解，形成了发觉问题，分析问题，解决问题的流程，对于学生来讲，这样的方式更有利于他们的理解和应用。 四、学生状况分析 对于本节课来说，学生是初学者。而且从本节课的课堂完成效果来说，学生基本的素养都具备，他们都能参加到课堂教学中，共同解决自主探究中发觉的问题。但对于学生来讲，还是更习惯于老师讲解，学生仿照的模式。这也是最终课堂作品没能达到的志向化的其中一个缘由。 五、同行听课的借鉴 由于客观缘由，25日上午只听了盐都的一位老师上的最终一节与我同课题的课的教学。她在教学过程中，用了
18、几个简洁的主题，将学生分成三个小组，完成作品。对于我这节课，我可以将环境爱护这样的主题网站进一步细分为几个部分，分小组完成其中的一个网页，这样组成一个网站，我信任效果会更好。 六、反思再教设想 假如我再教这一节课，我会更多地分析学生状况。在组织教学中，让小组合作贯彻其中。在让学生设计表格之前，对表格的分析这块讲得更细，说明得更清晰，并供应示例。在教学中，尝试让学生分小组应用表格制作网站中的不同页面，依据供应的内容完成不同的网页的制作。但这样的设置可能要考虑到因素会更多，会依据主题和素材的内容而定。 应用表格布局网页结构教学设计 应用表格布局网页结构教案 【张海燕】应用表格布局网页结构教学设计及
19、反思 教学设计(利用表格布局网页)举荐 应用表格布局网页教案设计与反思 用表格为网页布局教学设计说课稿 试验15 利用表格和框架技术进行网页布局设计 表格基础和DIV+CSS网页布局基础教案 Dreamweaver中网页布局的方法教学设计 Dreamweaver中网页布局的方法教学设计 本文来源：网络收集与整理，如有侵权，请联系作者删除，谢谢！第14页 共14页第 14 页 共 14 页第 14 页 共 14 页第 14 页 共 14 页第 14 页 共 14 页第 14 页 共 14 页第 14 页 共 14 页第 14 页 共 14 页第 14 页 共 14 页第 14 页 共 14 页第 14 页 共 14 页