- 相关推荐
《网页制作》教学设计（精选8篇）
作为一名优秀的教育工作者，通常会被要求编写教学设计，借助教学设计可以提高教学质量，收到预期的教学效果。那么写教学设计需要注意哪些问题呢？下面是小编整理的《网页制作》教学设计，欢迎阅读与收藏。
《网页制作》教学设计 篇1
一、教材或教学内容分析
本章内容在本教材中的位置处于第五章，是在文字处理（Word2000）和网络基础及因特网应用两章之后。学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品，在软件的使用上有很多的共通之处，所以在学习frontpage的时候，很多内容可以让学生自学，而不必面面俱到地在课上讲授。而第四章网络基础及因特网的应用又为学生对网页的理解奠定了基础，学生对网页中的基本元素——文字、图片、动画、声音等都有所了解，而网页的制作就是将这些元素重新组合到网页上，学生要学的就是这种组合的方法。所以说，虽然大多数学生以前都未接触过网页的制作，但有了以上这些基础，学起来就轻松多了。
本章内容按照学生已有的基础，我对教学内容分了一下类，也为教学的组织工作打下一点基础。本章内容主要由网页基础知识、网站的建立和管理、网页的制作、创建超链接、图片的处理、网页框架。
重点是网页的制作和创建超链接，学会了这些就可以开始简单的网页制作了。
难点是网页框架，这部分相互之间关系比较复杂，必要时，老师在对各组个别辅导时，可以给予分别讲解。 这个分类可以为组长安排各个组员的任务提供参考，使分工更加合理。
二、教学对象的分析
信息技术课虽然已经成为初中的必修科目，但是城乡学生之间掌握情况的差异却相当大，条件好一点的初中学生不仅已经熟练掌握了课本上的内容，还对一些常用软件有所了解；而差一点的可以说是从高中开始才正式接触到信息技术知识的学习，他们需要多锻炼、多指导，所以协作学习对学生的学习帮助很大。
三、教学策略的选择及媒体的使用
在教学策略的选择上，我使用的是任务驱动和协作学习相结合的方法。
任务驱动就是要求本章内容学习完之后，每个小组都要完成自己班级网站的制作，并在全班进行评比，选择最好的作为班级主页挂到学校主页上去，这有助于激发学生参与学习的积极性。
协作学习则是让学生在学习过程中互帮互助，用较短的时间、教少的精力学到更多的东西，完成一个集体项目，让他们在学习之后获得成就感。因此在媒体的选择上，我们使用的.是TOP2000系统。TOP2000系统有利于教师进行分组教学和学生作品的点评及成果的展示。教学过程开始之前，教师把学生按座位分成四组，每个组都按学生对计算机的掌握程度平均分配，保证每个组都有计算机操作方面比较突出的，也有相对比较差的，使其形成能够互帮互助的学习小组。并由他们自己选出组长各一名，然后由组长根据组员的情况，确定在班级主页制作过程中主要完成什么任务，也就是说起到一个组织者的作用。做过网页的人都知道，做网页是一项比较费时的工作，而要学生在较短的时间内制作出像样的网页是比较困难的，而在这个过程中，网页的设计占去了相当多的一部分时间，组长把任务分到各组员头上以后，组员就可根据自己要完成的任务相对集中的做某方面的工作，做完以后，组员之间进行经验交流，告诉组员自己的网页是如何制作出来的，在完成自己的网页后，再重复一遍制作过程花费的时间的不多的。这样，其他组员就可在较短的时间之内掌握比较先进的网页制作方法，而不必再花那么多时间去探索。因为每位组员都必须自己完成一个任务，所以在这个过程中，也同样有自己探索学习的机会和介绍自己经验的机会，使组内的每个学生都在学习中获得成就感。
四、教学过程
教学进程
教师活动
学生活动
1、课前准备
课前将本章内容的基本结构、内容的归类、网页基础知识、网页素材做成一个网站，供学生参考，网站上的内容可根据学生以后在学习中的要求添加。根据学生对已有的网页制作的情况进行分组。
学生根据自己的分组情况选出组织能力较强、计算机水平较高的人做组长，协作小组形成。
2、教师布置任务，作必要讲解
第一节课，教师简单介绍网页基础知识，并给各小组布置任务——用下面的时间完成班级网页的制作，并对组长进行本章基本内容及本章内容的分类的介绍，让他们对本章内容有总体上的把握。
在教师对网页基础知识讲解的基础上，浏览教师制作的网站，继续学习；
课后各组设计自己的班级主页，组长根据网站上教师对本章内容的分类给学生布置任务。
3、教师指导分工情况，学生开始自主学习
第二节课教师对组长对全组的分工情况给予检查，提出意见和建议。
学生根据分工制作网页，学习可以跟着课本上自学，也可根据以前学习Word的经验自己摸索制作过程，不懂之处可向会的同学请教，还可以相互之间讨论，在网页的设计方面也可以相互之间多商量，发扬互帮互助的精神。
4、学生自主学习，教师指导、监督
下面三节课，老师在每组各用10分钟时间检查他们上节课的网页制作情况，并对他们碰到的问题给予提示或解决，起指导和监督作用。
学生继续学习、制作网页。
五、阶段总结
四节课的制作以后，各组员所制作的网页都初见雏形，所以教师组织一堂课，由各组展示自己的作品。教师在学生评讲完后，给予总结。
各组分别展示自己的作品，其他组对他们可以提出意见或建议，也可从其他组的学到好的创意。由组长在课后写一份阶段总结，从而指导以后的工作。
六、学生自主学习，教师指导、监督
下面四节课，老师仍然对每组各花10分钟时间轮流检查他们上节课的网页制作情况，并对他们碰到的问题给予提示或解决，起指导和监督作用。
学生继续学习、制作网页。
七、各组将内容汇总，形成班级主页
教师对各组出现的问题提出建议或意见。
组长或组长安排人将各组的主页进行汇总，形成一个完整的班级主页，对欠缺的地方进行修补。
八、班级网站制作完成，展示与总结
老师请其他信息技术教师来做评委，对各组做的网站提出意见或建议，评出最佳网站、最佳创意等奖，让大家的付出都有所收获。
各组分别展示自己组所制作的班级主页。
课后：
大家集中各组的优势，将班级主页完成，挂到学校主页上。
《网页制作》教学设计 篇2
一、教学目标：
1、知识与技能：
（1）了解框架结构网页的概念及在网页中的作用，了解它与表格网页的区别。
（2）掌握框架结构网页的建立、框架结构的拆分、框架的删除等。
（3）掌握框架中页面设置及保存的方法，如设置初始网页按钮、新建网页按钮等。
2、过程与方法：
（1）能够区分框架结构属性设置与网页属性设置的不同点。
（2）通过框架结构网页设计，使学生对网页的整体结构有更进一步的认识。
3、情感态度与价值观：
（1）能够将表格与框架结构网页结合使用，在创作中体验乐趣。
（2）培养学生网页设计的审美意识、创新意识。
二、教学重点难点：
1、教学重点：
（1）框架网页的作用和功能，框架的建立与属性设置。
（2）框架中各个页面之间的关联，每个框中页面的设置方法。
（3）框架网页的保存方法。
2、教学难点：
（1）框架结构网页中框架属性与页面属性的`设置方法。
（2）理解框架结构的多页面存储方法及各页面之间的关联。
三、教学过程：
1、创设情境、导入新课
（1）教师展示一组表格制作的网页，引导学生找出它们的共同特点。并提问如何快捷地制作这种网页（学生回答：使用复制、粘贴快捷地制作）。
（2）教师又提问：有没有更好的方法呢？相同的区域我们能否只做一遍呢？从而导入新课——框架网页的制作。
设计意图：通过对比、比较，引导学生思考，激发学生学习的乐趣。
2、任务驱动、自主学习
（1）教师展示一个框架网页，引导学生理解框架网页的概念。
（2）出示任务一：框架网页的新建与保存。教师要求学生先阅读教材中的操作步骤，再尝试完成书本第227页的实践学习。
（3）教师讲解框架结构中的每个框都是一个独立的选项文件，即网页文件，因此当框架确定之后，需要为每个框分别指定其网页文件的来源，可以通过每个框中的“新建网页”按钮和“设置初始网页”按钮进行选择。
（4）学生理解框架网页的概念，通过阅读教材中的内容，自学新建框架网页的操作，初步了解“新建网页”和“设置初始网页”两个按钮的不同，并认真聆听教师的讲解，注意观察，按要求模仿操作。
（5）出示任务二：相关页面的制作与设置。教师要求学生先阅读教材中的操作步骤，再尝试完成书本第228、229页的实践学习。
（6）学生制作相关页面，同时也是对前面所学内容的复习和回顾。教师反馈学生的操作情况，开展评比活动，对表现好的学生给与表扬。
（7）出示任务三：框架网页属性的设置。学生自主探究学习，有问题可向教师寻求帮助。教师基础扎实的同学完成任务后可进行拓展学习。
（8）教师请学生示范操作，并说明自己设置的方法和原因。同时鼓励做的比较好的学生。
设计意图：培养学生的自主学习能力，对于课堂教学难点，学生在教师的讲解后模仿操作，有效突破难点。
3、展示作品、课堂小结
（1）教师给出一些常见的框架结构应用界面，如Web邮箱页面等，引导学生总结本课内容，并让学生分组，推进一些优秀作品在全班展示。
（2）教师点评，并鼓励完成作品比较好的学生。
设计意图：拓展学生的视野，使学生了解框架的应用方法。展示优秀作品鼓励学生，激发学生的创作欲望。
四、教学反思：
1、本节课是在学习完简单网页、表格布局网页、交互式网页的基础上，进一步页的设计方法。由于学生已经具备了一定的网页设计基础知识与技能，所以教师可以根据学生的实际情况，采用更灵活
的教学方法。教师可以简单介绍框架结构网页的功能及框架的建立与编辑方法，以及框架属性设置与网页属性设置的方法与区别。然后由学生根据教师提供的学案及演示动画，完成框架网页设计任务。
《网页制作》教学设计 篇3
教学目标：
1、让学生掌握在网页中插入表格的方法以及表格的修改
2、学会利用表格来规划网页
3、培养学生创新的能力以及动手操作的能力
教学重、难点：
利用表格来规划网页，从中培养学生的创新能力
教学过程：
一、情境导入
同学们你们善于观察吗？老师先考考你们，我们一起来看一组图片，你们看看在那里看过呢？学校缓台的窗台上。你们的观察能力真的很强啊，对，这些都是我们学校美术的特色作口，盘画。其实，我们做过很多作品：有手工作品，语文课中的作文、书法等都是作品，这节课我们以绘画作口品为例，做一个学习园地网页，把我们的作品展示到自己的班级网站中，以便我们更好的努力学习。现在我们就一起来制作吧！
二、新知探究
首先我们来打开上节课的班级网站，在这个网站中新建一个网页，并保存成“学习园地”。
教师讲解：如何制作学习园地网页。
1、制作网页的标题：输入文字，并设置文字的格式。
2、插入表格：单击“表格”中的“插入表格”并对表格属性进行设置。如：行、列的操作，对齐方式等。同时讲解什么是行，什么是列，以及单元格的概念。
3、修改表格：调整表格行高和列宽。
4、在学生学会插入表格的基础上，来设计网页，展示作品。并讲解在单元格中可以插入图片、文字。那我们就一起快快去做吧！插入图片，并在图片的上面或下面进行图片的注释。
5、进一步设置单元格的背景，来美化网页。
6、设置超链接：通过导航栏目，设置文字超链接。选中文字，点击右键选择超链接在列表中选择你要链接的.网页，单击“确定”按钮。
7、学生在教师的讲解后，学生自己动手操作制作网页。教师进行指导。（伴随音乐）
三、作品评价
1、生评：从网页设计上，美观程度上，知识落实上重点评价。
2、师评：对学生作品进行评价，并对其它学生的评价加以更完整的解释。
四、总结
我们这节课主要是利用了表格来设计网页，以使来美化我们的网页，通过绘画作品的展示，学习更多的知识。
《网页制作》教学设计 篇4
教学目标：
1、知识与技能：
（1）理解框架的概念及用途。
（2）掌握框架网页的新建、制作、编辑与保存，了解框架的拆分方法。
（3）初步掌握将框架结构与表格布局结合使用来制作网页。
2、过程与方法：
（1）通过对表格网页的分析，体验新知识（框架结构网页）的优点，从而促进其学习新知识。
（2）理解框架的概念与组成，学会分析网站的结构。
3、情感态度与价值观：
（1）通过以"人与动物"为主题的框架结构网页制作活动，了解更多有关人与动物和谐相处的知识，通过故事趣闻，增强学生关注动物的兴趣和意识。
（2）能够将表格与框架结构网页结合使用，在创作中体验乐趣。
教学重、难点：
1、重点：框架的概念、用途， 创建、编辑与保存框架网页的方法。
2、难点：框架的拆分。
教学方法：
对比教学法、探究学习法、模仿学习法。
教学准备：
整理、归类相关素材，并按要求摆放。
教学过程：
1、引入
老师展示一组利用表格制作的网页，要求学生仔细观察，找出它们的一个共同特点（学生答：网页上方和左侧内容都是相同的，仅右下部分内容不一样），并提问如何快捷地制作这种网页？（学生答：使用复制粘贴快捷地制作）
尽管复制、粘贴能为我们节省时间，但有没有更好的方法呢？相同的区域我们能否只做一遍呢？今天我们要学习的内容——框架网页制作，就能给我们带来更多便捷。（让学生明确框架网页使用的场合）
2、 新授
（1）框架网页概念
由以上例子入手，再展示一个框架网页，教师引导学生理解框架网页的概念
（2）框架网页的新建与保存
教师要求学生先阅读教材中的操作步骤，再尝试进行探究操作。
任务1 创建"横幅和目录"结构的框架网页，新建top和left页面，并学会保存。
框架结构中的每个框都是一个独立的选项文件，即网页文件，因此当框架确定之后，需要为每个框分别指定其网页文件的来源，可以通过每个框中的"新建网页"按钮和"设置初始网页"按钮进行选择。在top和left页面中，单击"保存"按钮，随即开始保存。
此处为教学难点，可先由框架的概念入手，再针对保存页面中的蓝色部分，教师进行讲解，教会学生注意观察。
学生要理解框架网页的概念，通过阅读教材中的内容，自学新建框架网页的操作，初步了解"新建网页"和"设置初始网页"两个按钮的不同，并认真聆听教师的讲解，注意观察，按要求模仿操作。
设计意图：培养学生自主
学习能力，课堂教学难点在教师的讲解后模仿操作，有效突破难点。
（3）相关页面的`制作与设置
框架网页中相关页面的制作，需要结合表格来布局，插入文字、图片和交互式按钮。
任务2 top和left页面的制作。
要求：
○1top页面内插入1行2列的表格，左边单元格插入logo图片，右边单元格插入banner图片。
○2 left页面内插入5行1列的表格，在每个单元格内依次插入交互式按钮（共4个），交互式按钮文字为展示介绍的相关内容概括，在第5个单元格内插入一个邮箱指示的图片。
○3调整表格边框的粗细。
○4为main区域设置初始页面。（该网页由教师提供现成的）
学生制作相关页面，同时也是对前面所学内容的复习和回顾。老师反馈学生的操作情况，开展比一比、评一评活动，对表现好的学生给予表扬。
（4）框架网页属性的设置
创建好框架网页后，可以根据实际需要改变框架的属性。
任务3 调整框架的大小、设置框架的边框、设置框架窗口中的滚动条等。
提高任务：框架的拆分。
学生自主探究学习，可向老师寻求帮助。完成设置后请同学示范操作，并说明自己设置的方法和原因。操作基础扎实的同学完成任务后可进行扩展学习。
3、 总结与评价
老师可以给出一些常见的框架结构应用界面，如Web邮箱页面等，引导学生总结本课内容，梳理课堂知识，并让学生分组，推荐一些优秀作品进行全班展示。
设计意图：开拓学生的视野，使学生了解框架的应用，教会学生要善于总结，要学会学习的方法。
《网页制作》教学设计 篇5
教学目标：
1、知识与技能
（1）了解超级链接的含义及链接源和链接目标的含义，掌握同一站点内以及不同站点间网页超级链接的创建方法。
（2）掌握网页内书签的作用及创建书签链接方法，掌握交互式按钮、框架网页内超级链接的设置方法。
（3）理解热区链接的含义及创建方法。
2、过程与方法
（1）通过创建网页超级链接的操作，使学生了解网页中创建超级链接的基本方法，破除对网页链接的神秘感。
（2）通过对不同对象设置超级链接的操作，使学生总结出操作的规律，培养学生自主学习与操作的能力。
（3）通过网页不同的超级链接方法，拓展学生思维，创建多种形式的网页链接。
3、情感态度与价值观
（1）通过链接我国主要自然保护区网页，激发学生热爱祖国、热爱自然、热爱生命的激情。
（2）完成超级链接，使学生感受成功的喜悦和快乐。
教学重、难点：
1、教学重点：
（1）超级链接的.含义及链接源和链接目标的含义。
（2）超链接的制作方法——给文字、图片制作超链接，制作书签链接，给交互式按钮制作超链接，框架页面内的超链接，图片区域制作超链接等。
2、教学难点
（1）书签链接中名称及对应链接位置的设定。
（2）在框架页面中制作超链接时，目标对象所选择的显示窗口形式。
教学方法与教学手段：
任务驱动法、讨论探究法、讲解与演示法、类比知识迁移法。
教学准备：
"动物——人类的朋友"站点，包括未链接的网页，如欢迎页、表格页、框架页，表单页等。
教学过程：
1、引入
展示两个主页，一个已经创建了链接，一个没有创建链接，让学生进行比较并找出区别，引出本课课题——超级链接。
提出：我们在先前的学习中，哪个软件中的相关操作与它类似？什么是超级链接？找一个例子，分析链接源和链接目标分别是什么？
学生展开交流，通过对比找出不同点，并积极思考，回答老师的问题。
设计意图：通过对比操作、交流，再辅以知识迁移，明确本节课教学内容。
2、新授
（1）站内超级链接
引导学生回顾PowerPoint中超链接的制作方法（教师提示：右击链接源，利用快捷菜单制作超链接），辅以教材中的内容，让学生自行探究并完成以下操作：
任务1同一站点内不同页面之间的链接
○1制作首页（欢迎页）到表格页的超链接。
○2给表格页内交互式按钮设置超级链接，链接到相关页面。
○3给框架页内交互式按钮设置超级链接，链接到相关页面。
教师巡视，及时指导，安排学生示范操作并讲解如何制作超链接。
交互式按钮的超链接制作要求在框架网页中演示操作。老师可以提问学生：演示者操作的对吗？有没有问题？
引导学生发现问题：超链接制作完成后需要检验（保存后预览）。
教师讲解，突破难点，再交由学生操作。
以上是同一站点内不同网页之间的链接，有时一个页面中内容过多，需要不断拖动滚动条实现阅读，能否实现快速跳转呢？
任务2同一站点内同一页面内的跳转（链接）：在"动物趣闻"页面内制作书签链接。
教师讲解：由生活中的书签引入，介绍"书签链接"的概念，然后再演示如何操作。
提示：书签链接的双向性问题（返回）。
学生认真听讲后模仿制作，教师巡视进行指导并反馈学生的完成情况。
（2）站间超级链接
仅凭我们课堂上制作的这些页面还不足以详细介绍我们的主题，此时我们还可以借助超链接，链接到因特网上的其他网站，以丰富我们的内容。
任务3借助热区链接，为"友情链接"页面制作超链接，链接我国一些自然保护区网站。
有了以上基础，可安排学生自学教材中有关热区链接的相关内容，学生探究操作后教师再安排学生进行演示，辅助以提问的形式检验学生的自学情况。
3、总结与评价
开展同学间的互助，检验其链接完成情况，推荐优秀同学做展示。引导学生分类总结本节课的知识点。
《网页制作》教学设计 篇6
1、教学目标知识与技能：灵活运用添加超链接和在网页中插入表格方法，根据网页内容进行页面布局，完善网页,掌握网页布局的技能和技巧。
过程与方法：培养学生加工信息和应用信息的能力及培养学生思维能力，规划能力、创新能力、及合作能力。
情感与态度：使学生感受中国源远流长的历史文明，并通过网页传递给世界；帮助学生树立良好的信息道德意识；让学生享受成就感，树立自信心。
2、学生分析初中二年级学生感知能力较强,理解能力和抽象思维较弱；学生基本学会使用在网页中插入表格的方法，但分析信息、处理信息和应用信息能力较弱；对教学内容的了解程度较强。
3、内容分析
教学重点：利用表格对网页页面进行布局。
教学难点：怎样合理、美观地设计网页页面布局。
此部分教学内容在整个网页设计知识体系中处于综合处理信息的重要部分。
4、教学策略设计
（1）．教学方法设计
我根据教学主题及其教学目标确定的教学指导思想是以学生为主体，以学生自己的亲身体验展开探究式小组合作学习。本节课采用研究体验式教学法,建构主义模式下的任务驱动式教学法组织教学。首先设计“总任务”，再细分成若干“小任务”，实现教学目标。
（2）．教-学流程和教-学活动的设计思路
整个教学活动，尤其是学习活动，我采用探究式学习法，又称研究性学习，我强调的是学生在教师指导下，根据各自的兴趣、爱好和条件，再结合与自己有相同或相近的兴趣、爱好的同学组成合作伙伴，共同选择西安不同的旅游景点，确定研究课题，借助“表格布局”功能规划七天的旅游行程，独立自主结合小组合作开展研究，进行合理的网页布局设计，达到从中培养创新精神和创造能力及审美能力的一种学习方式，实现“双赢”。建构主义学习理论认为，学习过程不是学习者被动地接受知识，而是积极地建构知识的过程，把学过的网页设计知识综合应用起来，由于建构主义学习活动是以学习者为中心，而且是真实的，并且以完成特定的任务为动力，因而学习者就更具有兴趣和动机，能够鼓励学习者进行批判型思维，能够更易于提供个体的学习风格，展现自己的独特思维，不受现有网页模式的拘束。基于构建主义的探究性学习模式，我的设想是整个教学过程是动态的，学生是学习的主体，教师是学生学习环境的'创设者、学习动力的激发者、学习过程的指引者和学生学习的协作者。
（3）．应用信息技术的依据或考虑
信息技术在本次教-学活动有不可替代的功能。利用信息技术中计算机技术进行网页设计，实现教学目标，完成让世界各地的人实现“网上游古都”。在教学中计划通过探究式教学方式，小组合作学习方式和“任务驱动式”教学策略，自主设计网页，发布网页，运用网络使信息技术的这些潜在优势发挥作用并真正促进学生能够结合实际应用，通过自主实践，完成“网上游古都”任务，并同时完成了学习任务，进一步建构了自己的知识体系，并实时地享受到巨大的成就感。
（三）、教与学的过程
1．教与学的过程
活动内容
教师活动
学生活动
设计意图
创设情境
激发兴趣
［创设情境］
“要想了解中国上下五千年文明历史，请到西安来！”近几年，越来越多的外地游客涌向西安。“十一黄金周”即将来临，大家想不想用网页形式向外地游客介绍宣传西安，让更多的人来西安，领略其古老的魅力！我们上节课把利用搜索引擎找到的有关西安的历史文物古迹的文字信息和图片信息整理制作成有关不同景点的网页，但信息是否显得很零散？怎样把景点信息整合规划，让人们先在网上一饱眼福，轻松网上游古都？
设计一个含有指向各旅游景点网页的超链接的主页。
提供信息活条件，激发起学生的兴趣。
［导语］
我们可在主页中制作一个西安旅游景点导航栏，但怎样合理规划各旅游景点，并且使页面布局美观，整洁，分类清晰？
利用“表格”。
为细化任务埋下伏笔；并且激发学生的认知冲突。
［出示课题］
今天我们就围绕“西安七日游”，在主页中利用表格规划设计旅游行程，本节课的课题是《“黄金周”—规划网上西安七日游》
学生明确本节课课题，初步了解任务。
出示课题，介绍总任务。
［分组方法］
根据对各旅游景点的兴趣及当初搜索信息的分工情况及本节课任务分工，四人一小组。
学生进行分组
为细化任务做准备
出示任务
明确分工
［出示总任务］
每个组围绕主题，利用表格规划设计旅游行程，并建立好超链接，利用主页展示出来。
学生明确任务
明确总任务
［作品形式及分工参考］
形式：创建并完善主页，并展示整个网站。
分工参考：
内容版式规划
整理七个旅游景点网页
超链接的建立与维护
作品演示解说
学生明确汇报形式，分工参考。
使学生明确各自任务后，通过研究，探讨，操作，通过电脑媒体来完成任务。
活动内容
教师活动
学生活动
设计意图
出示任务
明确分工
[角色分工]
学生自由分组后,共同研究选组长，组长进行给组员分配任务。
学生共同研究选组长,并协调分配好任务.
锻炼学生自主协调分工能力。
［出示作品评价标准］
教师出示作品评价标准：
作品内容：设计含有七个链接网页的主页，资料丰富，内容准确。
技术表现：页面布局设计合理，颜色搭配和谐，主题突出，作品演示运行正常，操作熟练。
创新特色：作品布局规划有独特之处，有新意。
提示学生有三条帮助热线：
1、组长2、邻座学习伙伴3、教师4、自学课件
学生明确要求。
培养学生的创新能力，规划能力，思维能力和合作能力。
学生研究探索合作交流创作作品
［创作作品］
播放舒缓音乐，为学生营造自由和谐气氛。
（提示学生利用网上邻居把各组员的作品组合在一起，共同完成此任务。）
学生根据角色分工，按小组形式开始完善网站。
学生体会了超链接的作用，练习了超链接的使用，理解了表格强大的页面布局功能；培养学生处理信息和应用信息的能力；通过学生间交流合作，老师及时点拨与指导，培养学生发现问题和解决问题的能力。
［展示作品］
下面请各组派代表，到教师机前展示以下你们的旅游行程。其他同学观察后，可提意见或建议。
由小组代表展示组内作品，并详细说明旅游景点规划的呈现形式，内容选择及整体构思。
锻炼学生口语表达能力和分析说明问题能力。
合作成功展示作品成果汇报交流探讨
［交流探讨］
教师引导学生探讨页面布局的方法和技巧；谈看完作品后，对其改进意见；进行组间互评和组内自评。
评出“最受欢迎奖”（即如果此网站上传到网上，点击率最高），“最具创意奖”“最佳布局奖”作品。
学生间相互交流探讨。
培养学生合作交流能力。
［教师点评及检测］
教师从页面布局，整体规划合理性，创意等几方面进行点评。
学生思考，怎样完善作品。
教师鼓励学生发展创新思维，页面布局规划能力，逻辑思维能力及合作能力。
教师或其他同学提问页面布局的方法。
学生代表演示
及时检测学生对表格的掌握情况。
你受到的最大启示和收到的最大收获？成功经验和失败教训？
学生回答
巩固知识，培养情感
[完成旅游规划，培养情感]
同学们已熟练掌握表格的使用方法，并且加工和应用信息的能力增强。
悠久的历史积淀和丰富的人文资源，使西安居中国六大古都之首，是世界四大文明古都之一，著名的旅游中心城市。希望你们热爱中国博大精深的历史，感受西安古老的魅力！
学生感悟。
全课总结，培养道德情感。
全课总结知识延伸
［达到目标，知识延伸］
网站制作好了，怎样让世界各地的人都看到你们的网站呢？
想当我们的故乡—大庆的小导游吗？赶快制作一个“铁人故乡—大庆”的网站吧！
学生思考。
学生课后实践。
为激发下一节课内容（上传主页）的兴趣奠定基础。
让学生可把本课内容应用到实际生活中去。
培养学生自发探究能力。
2．关键环节提炼
利用信息技术创设情境，播放一段自拍的录像，内容大体是：一位外国友人，想要来中国四大古都之一“西安”旅游，但想要自助游，想借助因特网，先在网上了解一下西安，并参考一下旅游行程。通过此录像激发学生兴趣并利用信息技术呈现问题，使学生产生认知冲突，培养学生发现问题、分析问题、解决问题的能力。我通过学生利用信息技术完成此项任务，促进学生对基础知识、基本技能的学习。我利用信息技术，尤其是网络提供的有关“西安”丰富的旅游景点介绍资源，帮助和拓展学生的学习。让学生借助信息技术手段开展探索、总结并进行创作。我利用信息技术展示学生自评，学生互评，教师评价的评价表，为学生的学习提供评价、反馈和矫正。我利用网页自学课件和网络教室教学广播系统支持师生间、生生间的交流对话。
3.教学反思
本节课主题明确、集中，让学生分成小组，合作探究学习，给出特定的总任务，有利于学习效果评判的可比较性，也便于学生之间的广泛交流和良性竞争。通过利用信息技术规划规划网上西安七日游，对西安七个主要景点的介绍，让世界了解西安，每个学生在共同完成“网上游古都”网站作品后，让每个学生都有完成任务和宣传中国源远流长的文明历史的成就感，并感到自豪。
本节课，在小组合作学习过程中，学生之间互学互教，彼此交流探讨，经历了提出问题、分析问题和解决问题过程，每个学生都承担一定学习任务，防止滥竽充数，促进了学生的参与程度、认知深度，高质量地实现了课程的目标，增强学生的责任感。但个别学生没有认识到合作学习的重要意义，自主探究能力较弱，容易丧失信心。
教学实际实施过程，有学生提出：我对中国的少数民族文化感兴趣，能否制作一个宣传中国五十六个少数民族文化的特色网站？于是我了解到学生对中国的不同文化感兴趣，可在课外活动小组完成此任务或作为课外自主探究性学习课题来探究。
本节课让学生掌握了“表格”的妙用，还提高了加工信息和应用信息的能力，而且使学生感悟到了中国上下五千年的博大精深，对祖国更加热爱。
（四）、教学评析：
在新课程标准的理念中，明确提出要关注全体学生，建设有特色的信息技术课程。在教材因篇幅的限制，提供给学生感知的背景材料极其有限，“信息”且都处于“静止、储存”状态，不利于学生的感知和抽象概括。因此，允许教师在不改变教材内容、体系、结构的前提下，经教学法的加工，营造引入新课的“情境问题”的氛围。学生在积极的参与、体验、研究并在已有知识经验的支持下，自主能动地探索，实现知识的再创造。
教学活动在面向全体的同时更注重学生情感的交流协作意识与因材施教。更注重学生个性培养和创新智能的开发。
学生自主性学习，需要有一个适应的过程，开始阶段，布置任务要明确具体。
学生之间的交流和帮助比较少，自主学习的能力还要不断提高等。
附：学生学习过程及典型成果
另附：小组成员分工表
第________组组长________作品题目______________
小组成员
主要负责工作
《网页制作》教学设计 篇7
【教学目标】
了解用FrontPage制作课件的优势与不足，学会用FrontPage制作网页型课件，用FrontPage制作网页课件
授课教案：
【重点难点】
重点是如何在FrontPage插入多媒体素材，难点是课件交互性的实现和网页源代码的应用。
【教学策略】
教师实例演示，学生上机操作，教师辅导和点评。
【媒体选择】
主要采用FrontPage示范课件和实际操作讲解相结合，并辅以文字教材、网上学习资源和教学光盘。
【教学内容】
现在越来越多的课件是用网页制作工具来制作，并结合数据库、 ASP等技术来加强课件的交互性。
网页形式的课件可以集成丰富的多媒体信息，具有交互性强、制作简易、体积小、便于在网络上发布、传播和更新等优点，适合于个别化学习、课堂教学和网络教学。
网页课件的开发工具软件有很多，包括： 语言编程如 HTML 、 DHTML 、 ASP 、 JSP 、 PHP 、 JAVA 、 JavaScript 、 VBScritp 、 VRML等。
所见即所得的可视化编辑工具，如 FrontPage 、 Dreamweaver 、Flash 、 Authorware 、 PowerPoint 、 CourseBuilder 等。
对于一般都有繁重教学任务在身的学科教师来说，没有太多的精力去学习复杂的编程语言。
可视化网页编辑工具由于源代码自动生成，使教师可以有更多的精力关注内容的表达和教学设计。
用FrontPage编制的网页课件有较易操作的界面（与上网浏览网页完全相同），一门课程或一堂课的脉络结构（知识结构）可以在主页上用菜单（树形菜单或弹出菜单）或导航条的形式清楚地表明，可以列出教学目的、内容、重点难点、引言、概念性质、例题、练习、小结、作业等等，甚至操作注意事项。
FrontPage 被公认为最好的入门级的网页编辑工具。
一、FrontPage基本操作
启动 FrontPage ： 双击桌面上的 FrontPage 快捷方式图标； 开始→程序→Microsoft FrontPage ；右击一个扩展名为 htm 或 html 网页文件，选“编辑”。
2. 打开或隐藏视图栏、文件夹列表和网页文档
a. 点“视图→ 视图栏”打开或隐藏视图栏。
点“视图 → 文件夹列表”打开或隐藏文件夹列表。
b. 右击扩展名为 htm 或 html 网页文件（ 如 index.htm ） ，选“编辑”，系统默认用 FrontPage打开网页。
c. 点“文件→打开”或点 常用工具栏中的“打开”按钮， 从本地磁盘或网络驱动器中打开网页文档，从任意 Web网站打开网页，打开最近打开过的网页文档。
3. 在 FrontPage 编辑器中预览网页 a.点普通视图按钮，观察刚才打开的 index.htm 网页。
b. 点HTML 视图按钮，观察 index.htm 网页。
c.点预览视图按钮，观察 index.htm 网页。
4.FrontPage 视图方式：网页视图，文件夹视图，报表视图，导航视图，超级链接接视图，任务视图。
5. 保存网页： 点“文件 →保存（另存为）”或点常用工具栏中的“保存”按钮，将新建的网页或从万维网上打开的网页保存到本地磁盘，把自己喜欢的网页作为模板保存。
6. 关闭网页： 点“文件 →关闭”或文档窗口 中的“ X”按钮，关闭当前网页。
二、设计网页课件的框架结构
三、在网页中插入表格、图像、背景、 剪贴画、声音、视频和动画等多媒体对象
1. 插入表格 插入到网页上的文本、图片、音频、视频、动画等元素，往往看起来显得不够整齐，为了使网页更美观，我们利用表格来控制复杂的网页布局，即 用表格来定位 网页元素 。
（1） 点“表格→ 插入 → 表格”，输入行数、列数（如 3 列 5 行），插入一个规则表格， 设置表格的属性。
（2）用“表格”工具栏上的 按钮或“表格”菜单上的“插入行或列”命令来增加 表格的 行或列。
（3）用“表格”工具栏上的按钮删除一个单元或多个单元，删除一行、多行或一列、多列，删除整个表格，表格删除后立即按“常用工具栏”中的“撤消”按钮或按“Ctrl+Z ”恢复表格；选择单元格或单元格中的内容用鼠标把选择的内容拖到新位置进行移动；按住 CTRL键，再用鼠标把选择的内容拖到新位置进行复制。
（4）选中需要拆分的单元，单击“表格”工具栏上的按钮或使用“表格”工具栏上的“笔”拆分单元格；选中需要合并的单元，单击“表格”工具栏上的按钮或单击“表格”工具栏上的`（擦除 ） 按钮合并单元格。
经过处理， 3 列 5 行的表格 变成 1 列 4 行。
2. 插入图像和背景图象将鼠标定位到要插入图片的位置（如某个单元格内），单击“常用工具栏”上的“插入图片”按钮，从已建站点的图片文件夹中 选择 合适的图片，点击“确定”。
也可以 在“图片”对话框中点击“插入一个计算机中的图片”按钮， FrontPage编辑器将打开“选择文件”对话框，从本地磁盘中指定一个图像文件。
右击网页空白处，选“ 网页属性 ”快捷命令，单击“ 网页属性”对话框的“背景”选项卡，先选中“背景图片”复选框，选择合适的图像作为背景图插入网页，点击“确定”按钮。
3. 插入剪贴画点“插入”→“图片”→“剪贴画”命令，选择一幅剪贴画，单击“插入”按钮，或直接双击剪贴画。
4. 插入声音或视频剪辑选择“插入”→“高级”→“插件”命令，打开“插件属性”对话框，单击“浏览”按钮，打开“选择插件数据源”对话框，从站点文件夹或本地计算机上指定要播放的声音或视频文件。
调整网页中插件图标到合适的尺寸。
5. 修改图像属性右击网页中的图像，选“图片属性”命令，在“常规”选项方式下指定图像的格式（例如 jpg 和质量 75）；在“文本”框内简单地描述图像；单击“外观”选项卡，指定图像无边框即边框线宽度为 0，指定图像与相邻的文字或图像之间的水平间隔和纵向间隔，要改变图像的大小，首先选中“大小”框内的“指定大小”复选框，然后分别指定图像的宽度和高度。
熟悉“图片”工具栏：创建自动缩略图；调整图像的黑白对比度和亮度；给图像加上斜面边界；把彩色图像变成黑白图像；把图像翻转；修正图像；裁剪图像；淡化图像；把图像恢复原样；在GIF 格式的图像上写文字；使 GIF 图像透明等。
6. 插入水平线美化网页网页水平线用于把网页分隔成几个部分。
新建或打开网页文档，把插入点移到要插入水平线的地方，单击“插入”菜单上的“水平线”命令。
要把水平线插入在下一行，就把插入点定在行尾。
在水平线上单击鼠标右键，在弹出的菜单中选择“水平线属性”命令，也可直接双击该水平线，设置水平线的宽度、 水平线的对齐方式和水平线的颜色。
四、在课件网页中使用书签和超级链接接
1. 书签的作用书签用于在长网页内部快速跳转和定位。
2. 创建书签网页 从 Web网页上复制一篇比较长的文本，粘贴（选择性粘贴：无格式文本）到新建网页中。
选择要标记的位置，单击“插入”菜单中的“书签”命令。
FrontPage编辑器将显示“书签”对话框。
在“书签”框中键入书签名称（最好用西文命名），书签名称应具有较好的描述性，然后单击“添加”按钮。
可看到标签小旗出现在期望定位的位置上。
用同样的方法创建其它书签。
在网页顶端创建系列提纲（目录）文本，选中其中一个，右击文本，选“超链接”，在“链接到”栏中点“本文档中的位置”，在书签列表中选中合适的书签，确定。
用同样的方法给其它的提纲（目录）文本建立超链接。
保存网页，在IE 中预览。
3. 超级链接 使用超级链接，不仅可使站内的网页成为一个有机整体，还可使不同的站点之间建立联系。
例如，在制作“网上学习资源”网页时，需要给所列出的大量的网上学习资源的标题文字设置超链接，以便访问者通过点击网页上的标题文字打开相对应的学习资源。
首先选中标题目文字，然后单击标准工具栏上的“超级链接”按钮，在弹出的“创建超链接”对话框中指定超级链接所对应的网页，或在URL 文本框中填入网页的地址即可。
4.创建图像热点作为超级链接接新建或打开包含有复杂图片（如地图或大型仪器图片）的网页。
练习创建图像热点作为超级链接接。
例如，在世界地图片上的“国家地区”区域处创建一个热点，指定它跳转到“按国家地区查询”的主页上。
方法是：首先单击图像，编辑器将显示“图片”工具栏，选择“图片”工具栏上的“图片”按钮，把光标移到图像上，光标将变成笔状，按住鼠标左键在图像上画出热点。
释放鼠标后，FrontPage 编辑器自动打开“创建超级链接”对话框，在此指定该热点要跳转的目标网页或网址。
制作好后在 IE浏览器中预览。
5. 改变超级链接的外观选择某文字超级链接，单击“格式”菜单上的“背景”命令，打开“网页属性”对话框的“背景”选项。
把该超级链接的颜色改为另一种更醒目的颜色，预览一下，看超级链接文字是否发生变化。
试着用不同的颜色表示未访问过的超级链接（Hyperlink） 、访问过的超级链接 （Visited Hyperlink） 和将要访问的超级链接 （ActiveHyperlink） 。
看看改变超级链接的外观的效果。
6. 编辑超级链接属性右击超级链接，选“超级链接属性”，FrontPage编辑器将打开，在URL框内键入新的网页文件名或网址。
观察改变后的效果。
7. 取消超级链接右击超级链接，选“取消超级链接”命令。
五、插入活动元素 - 让课件网页活起来
1. 制作悬停按钮定位插入点，单击“插入” / “组件” /“悬停按钮”，打开“悬停按钮”对话框。
把动态按钮默认标签“按钮文本”，改成所需的按钮文字，单击“字体”按钮，在打开的“字体”（字体）对话框里设置您所需标签的字体。
要为动态按钮创建超级链接，可直接在“链接到”框内键入要跳转的URL ，也可单击“浏览”按钮，从当前打开的网站、 WWW、本地磁盘中指定跳转目标。
可重新指定按钮的前景颜色，不过如果按钮显示的是图像，前景颜色无效。
当用户把鼠标移到动态按钮上时，按钮的颜色将自动发生变化，这是动态按钮最大的特色，至于颜色是怎样变化的，可通过“效果”和“效果颜色”框设定。
还可改变按钮的宽度和高度（以像素为单位）。
《网页制作》教学设计 篇8
一、教材分析
首页之外的其他网页在结构上很相似，为了给这些网站增加一些亮点，故在网页中插入了交互式按钮，交互式按钮不仅具有超链接功能，在使用过程中还会发生变化，更能引起学生的学习兴趣。
二、教学目标
1、知识性目标
（1）了解交互式按钮的功能；
（2） 了解计算机主机包括的部件；
（3）了解网页动态效果。
2、技能性目标
（1）会设置网页的目录；
（2）学会插入、修改交互式按钮；
（3）学会复制表格。
3、情感性目标
（1）加深对计算机硬件的认识；
（2）培养学生分工协作的精神。
三、教学重、难点
1、教学重点
（1）交互式按钮的功能；
（2）插入、修改交互式按钮。
2、教学重点
（1）交互式按钮；
（2）复制表格。
四、教学准备
制作一个具有几个漂亮交互式按钮的网页。
五、教学过程
1、导入
教师：现在我们的首页已经做好了，可是其他的网页还没做，但是一节课内无法做太多的，今天呀我们就来学习制作“主机”网页吧！其余的以后在做.
2、学习新课。
（1）指导学生用表格布局；
教师：用表格对网页进行布局方法，前一堂课我们学习了，现在就请同学们，对照课本用表格给 “主机”网页进行设置。
学生看书练习。
（2）指导学生学习插入交互式按钮；
教师：在网页内经常会插入具有超链接功能的按钮，单击这些按钮，便可打开其他网页，请同学们看下面具有交互式按钮的'网页。
屏幕展示。
教师：下面我们就来学习如何制作交互式按钮。
教师示范讲解，学生观察。
学生练习、老师巡视指导。
3、巩固练习。
请同学们试着完成书中本课的“试一试”中的练习，在遇到困难时可小组同学相互帮助，也可以举手问老师。
4、总结评价。
教师总结后，请同学根据自己掌握的知识情况和收获，在本节课的“评一评”中打上自己的成绩。
【《网页制作》教学设计】相关文章：
制作网页设计的心得体会11-29
制作网页设计的心得体会(9篇)12-02
制作网页设计的心得体会9篇11-29
制作网页设计的心得体会精选9篇02-21
制作网页设计的心得体会汇编9篇04-11
制作网页设计的心得体会(合集9篇)12-26
网页设计心得12-22
网页制作心得体会12-12