《网页制作》教学设计(优质课比赛优秀设计)
高中信息技术《网页制作》优质课教学设计、教案
《6.2 网页制作》--好客青岛欢迎您1教学内容分析本节内容是浙教版《信息技术基础》第6 章第2 节内容，是本章的重点。
本章教学任务完成与否，要看学生能否通过小组合作的学习方式来完成一个主题网页的设计和制作。
通过本节内容的学习，学生将切实掌握网页的设计与制作方法，体验小组合作学习的乐趣和积极作用，同时，也是一次美育与德育（发现家乡的美，热爱家乡的美，宣传家乡的美）的过程。
2教学目标①知识与技能：了解网页策划和设计的基本过程。
②过程与方法：学会设计和制作简单网页。
③情感态度与价值观：体验小组合作学习的乐趣，感受家乡人文的魅力。
3教学重点图文混排和设置超链接、网页布局及网页元素的科学合理运用4教学难点图文混排和设置超链接5教学课时安排本小节理论上分4 课时进行。
1.①第1 课时“网站的策划和构思”（课余完成）：学生完成分工，明确本组及个人任务，初步完成网站的总体构思，并给出了手绘版的网页设计图。
②第2 课时“素材的收集与整理”（课余完成）：学生查找和收集素材，进行了初步处理。
③第3 课时，学生了解FrontPage2003 的基本操作方法，初步掌握了网页制作的简单技巧。
④第4 课时，学生分组完成主题明确的网页的制作。
（本次授课内容）6教学过程 1 学时教学活动1【活动】课前准备1. 将收集整理的素材发送到学生电脑。
2. 将学案发到学生手中。
3. 每组设定一个共享文件夹。
要求负责本组的主页制作的同学就坐于有共享文件夹的电脑前。
2【导入】课程导入好客山东视频播放网络时代如何更好的宣传自己美丽的家乡？从而导出本节课的主题-网页制作！3 玩游戏，识布局1、通过拼图游戏，让学生认识到网页布局的重要性。
盖楼——设计图纸网页——布局图2、了解常见的网页布局样式：封面型、国字型、拐角型、标题正文型等4【练习】活动一：制作简单的网页。
要求：1. 每组须完成：1 个主页,至少1 个子网页。
并在学案上画出网页布局2. 主页要有链接到子网页的文字。
《网页制作》教学设计（5篇）
《网页制作》教学设计（5篇）作为一名优秀的教导工，通常会被要求编写教学设计，借助教学设计可以提高教学质量，收到预期的教学效果。
则写教学设计须要留意哪些问题呢？下面是我收拾的《网页制作》教学设计〔精选5篇〕，欢送阅读与收藏。
《网页制作》教学设计1一、教材或教学内容分析本章内容在本教材中的位置处于第五章,是在文字处理(Word2000)和网络根底及因特网应用两章之后。
学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品,在软件的使用上有无数的共通之处,所以在学习frontpage的时候,无数内容可以让学生自学,而不必面面俱到地在课上讲授。
而第四章网络根底及因特网的应用又为学生对网页的理解奠定了根底,学生对网页中的根本元素——文字、图片、动画、声音等都有所了解,而网页的制作就是将这些元素重新组合到网页上,学生要学的就是这种组合的办法。
所以说,虽然大多数学生以前都未接触过网页的制作,但有了以上这些根底,学起来就轻巧多了。
本章内容根据学生已有的根底,我对教学内容分了一下类,也为教学的组织工作打下一点根底。
本章内容主要由网页根底学问、网站的建设和管理、网页的制作、创立超链接、图片的处理、网页框架。
重点是网页的制作和创立超链接,学会了这些就可以开场容易的网页制作了。
难点是网页框架,这局部互相之间关系比拟冗杂,必要时,教师在对各组个别辅导时,可以赋予分离解说。
这个分类可以为组长支配各个组员的任务提供参考,使分工越发合理。
二、教学对象的分析信息技术课虽然已经成为初中的必修科目,但是城乡学生之间控制状况的差别却相当大,条件好一点的初中学生不仅已经娴熟控制了课本上的内容,还对一些常用软件有所了解;而差一点的可以说是从高中开场才正式接触到信息技术学问的学习,他们须要多锻炼、多指导,所以配合学习对学生的学习帮忙很大。
三、教学策略的挑选及媒体的使用在教学策略的挑选上,我使用的是任务驱动和配合学习相结合的办法。
网页制作教案
网页制作教案
教学目标：学生能够掌握基本的网页制作技巧，能够制作简单的网页。
教学重点：网页布局、文本编排、插入图片、添加链接等基本网页制作技巧。
教学准备：计算机、网页制作软件、相关教学资料。
教学过程：
1. 介绍网页制作的基本概念和流程。
2. 教授网页布局的基本原则，包括顶部导航栏、页眉、侧边栏等。
3. 演示如何使用网页制作软件进行网页布局设计，通过拖拽图形元素实现。
4. 说明文本编排的基本规则，包括字体、字号、字距等。
5. 指导学生使用文本编辑工具进行文本编排，实现网页中各部分的文字内容。
6. 指导学生如何插入图片，并讲解图片格式的选择和优化方法。
7. 演示如何添加链接，并介绍超链接的作用和使用方法。
8. 分组训练，学生根据所学知识制作简单网页。
9. 学生展示自己的作品，并相互评价。
10. 总结网页制作的要点和注意事项，并激发学生对网页制作
的兴趣。
教学扩展：
1. 引导学生学习其他网页制作技术，如CSS样式设置、JavaScript交互效果等。
2. 组织学生参加网页设计比赛，激发学生创造力和团队合作精神。
评估方式：观察学生的学习过程和展示作品，给予评价和建议。
教案精选：高中信息技术《网页制作》教学设计
教案精选：高中信息技术《网页制作》教学设计教案精选：高中信息技术《网页制作》教学设计1、任务驱动本单元的学习通过完成网页作品来实现。
班级网页的信息来自学生生活的班集体，每个热爱班级、关心班级的同学都能产生一种急切地完成任务的动机，而完成任务又能给他们带来成就感和满足感。
这种心理上的内在动力驱使学生自觉地把计算机作为一种信息处理的工具来使用，由“要我学”变成“我要学”。
在教学中，教师通过创设情境，激发学生的创作欲望，把总任务划分到每节课，按照学生的制作进度来布置子任务，使学生在教师的引导下逐步达成教学目标。
2、小组协作制作班级网页是个大任务，具有一定的开放性和综合性。
因此采取小组协作学习的方式是非常必要的。
小组成员的知识程度、学习能力和思维方式都有差异，可以通过讨论、交流与合作，取长补短、拓展思路。
每个学习小组由6-8人组成，每人负责制作1-2个页面，组合成一份班级网页。
最后，各小组作品集中评比，选出优秀作品，上传到校园网上公布。
基于资源要培养学生的信息能力，就必须为他们提供大量处理信息的机会。
基于资源的学习就是让学生接触到丰富的学习资源，为学生的知识构建提供支撑。
笔者采用ASP技术自主开发了一个信息技术学习网站，该网站具有强大的交互功能，不仅能为学生创设丰富的资源环境，还为每个注册用户提供个人空间，支持作品的上传或下载，并开辟了学生论坛和教师答疑，供师生们交流和讨论。
网站的使用不仅方便学生的学，还能改善教师的教，也为师生间的交流提供了虚拟空间。
三、学习目标本单元的认知、情感和动作技能三种目标分述如下：认知目标1、能简要陈述FrontPage2000主要功能，熟悉其操作界面2、能用自己的话解释下列术语：HTML，URL，网页，主页，超链接3、能主动获取、收集班级信息，并加以分类和整理4、能客观评价网页的内容和风格，具备一定的审美能力情感目标1、具有集体荣誉感，愿意为班级的网页建设出谋划策2、具有乐于助人、团结协作的精神3、能尊重他人的劳动成果，有保护知识产权的意识动作技能目标1、能熟练地建立、打开、保存、浏览网页文件2、能按照需要建立框架网页，设置各框架中的初始网页3、能在网页中熟练地插入文字、图片、动画、水平线4、能使用简单的表格编排网页内容，使网页的结构清晰，内容整齐5、能选择合适的网页背景图案和背景音乐6、能根据实际需要使用不同的超链接，合理地组织网页7、能在网页中插入悬停按钮、滚动字幕和横幅广告管理器，使网页具有动感8、能够插入简单的表单，使网页具有初步的动态交互功能四、学习资源设计在基于资源的学习中，教师的任务就是收集、设计和管理学习资源，引导和帮助学生自主地查找并获得学习指导，通过师生间、生生间的交流与合作，完成知识的建构和技能的提高。
《网页制作》项目式教案
《网页制作》项目式教案一、教学目标1. 了解网页制作的基本概念和流程。
2. 掌握HTML、CSS和JavaScript的基本语法和应用。
3. 能够独立完成一个简单的网页制作项目。
二、教学内容1. 网页制作基本概念：网页、网站、HTML、CSS、JavaScript等。
2. HTML基本语法及应用：创建网页结构、添加图片、、表格等。
3. CSS基本语法及应用：设置字体、颜色、布局、样式等。
4. JavaScript基本语法及应用：实现动态效果、交互功能等。
5. 网页制作流程：需求分析、设计、编码、测试、发布等。
三、教学方法1. 讲授：讲解网页制作的基本概念、语法和应用。
2. 示范：展示实际操作过程，让学生跟随操作。
3. 练习：学生独立完成练习题，巩固所学知识。
4. 项目实践：学生分组完成一个简单的网页制作项目。
四、教学准备1. 教室环境：多媒体教学设备、网络连接。
2. 教学素材：教案、PPT、示例代码、练习题、项目任务书等。
3. 学生设备：电脑、编程环境（如VS Code、Sublime Text等）。
五、教学安排1. 课时：20课时（每课时45分钟）。
2. 教学进度安排：第一课时：介绍网页制作基本概念和流程。
第二课时：讲解HTML基本语法及应用。
第三课时：讲解CSS基本语法及应用。
第四课时：讲解JavaScript基本语法及应用。
第五课时：讲解网页制作流程。
后续课时：学生分组完成项目实践，教师辅导。
六、教学评价1. 课堂参与度：观察学生在课堂上的发言和提问情况，评估学生的参与度。
2. 练习题完成情况：检查学生完成练习题的情况，评估学生对知识的掌握程度。
3. 项目实践：评估学生在项目实践中的表现，包括网页设计、编码、测试等环节。
4. 小组合作：观察学生在小组合作中的角色和贡献，评估学生的团队合作能力。
七、教学反思1. 课堂讲解：反思教学过程中是否清晰、生动地讲解知识点，是否及时解答学生的疑问。
2. 实践环节：反思项目实践的设计和指导是否合理，是否能够激发学生的创新和解决问题的能力。
《网页制作》课程教学设计
《网页制作》课程教学设计一、教材分析《网页制作》是我校学生的主修科目。
在这之前，学生已经学习了《网络应用基础》，已初步掌握了因特网信息的浏览、检索、下载及电子邮件的使用等基本操作技能。
因此，学生已经具备了获取信息的能力，《网页制作》的教学则侧重培养学生对信息的组织和表达能力，这对于加强学生的信息意识，提高信息处理能力有着重要作用；网页设计给学生提供了展示个性、自主创新的舞台；网页评价使学生了解内容编排的原则，页面布局和色彩搭配的重要性，提高他们的艺术修养和审美情趣。
教学过程中使用的网页制作软件是Dreamweaver8。
由于Dreamweaver8采用了图形化的操作界面，并且可以根据用户创建的网页对象自动生成HTML代码，所以，在整个教学过程中，可以采用“任务驱动”的教学模式；学生通过“小组协作”的学习方式，在教师的指导下自主学习新知识和掌握新技能。
二、设计思想1、任务驱动“任务驱动”的教学原则是：学生的学习活动与大的任务或问题相结合，以探索问题来引发和维持学习者的学习兴趣和动机；创建真实的教学环境，让学生带着真实的任务去学习，在整个过程中，学生拥有学习的主动权，教师不断引导和激励学生前进，从而使学生真正掌握所学的内容，并通过此任务举一反三，收到更好的学习效果。
《网页制作》可以将创建一个“班级网页”作为教学的主线，教师通过创设情境，激发学生的创作欲望，把总任务划分到每个单元知识的学习中去，按照学生的制作进程来布置和调整子任务，使学生在教师的引导下逐步达成教学目标。
由于整个任务是以学生的学习生活为题材，相关的信息来自学生生活的班集体，所以能够激发学生的学习兴趣和创作欲望，使他们的学习态度从“要我学”到“我要学”发生巨大转变，从而顺利地完成学习任务。
2、小组协作协作学习是指学生以多人为单位分组协作学习，以培养协作精神和提高学习效率。
在协作学习过程中，个人学习的成功与他人学习的成功是密不可分的，学习者之间保持融洽的关系和相互协作的态度，共享信息和资源，共同负担学习责任，完成学习任务。
高中信息技术《网页的制作》优质课教学设计、教案
4.3 网页的制作， 课题名称 用Frontpage 制作网页练习课 科目 信息技术 授课学校 宁阳一中班级26教师徐丽娜壱、教材内容分析： 《网页的制作》是粤教版网络技术应用第四章第三节的内容，涵盖了网页制作的基本过程；网页制作对提高学生的信息综合处理能力非常重要，是对必修部分信息的加工与表达内容的检验；网页制作也给学生提供了展示个性、自主、协作的机会，促使他们合作、主动、创造性学习。
二、学生特征分析本课的授课对象是高二年级学生，他们求知欲强，思维活跃，视野开阔，富有个性，他们的感知能力和思考能力较强，通过前一阶段的学习已掌握了网络技术知识和技能，他们渴望学到更多实用而有趣的网络技术知识。
FrontPage 是一个所见即所得的网页制作工具，易学易用，与Word 文字处理软件类似这种软件有利于树立学生制作网站的信心，对提高学生的信息综合处理能力作用较大。
同时又注重学生情感态度、价值观，在练习中体会信息技术带来的有利影响，提升信息素养。
三、教学目标（知识，技能，情感态度、价值观） 1、知识与技能：学习并掌握利用 frontpage2003 软件来制作网页的常用操作和技巧，能举一反三、融会贯通。
2、过程与方法：通过对调查网站的操作，网页形式答题的提交体会信息技术的广泛使用；通过对练习的操作，提高动手能力及小组合作能力。
3、情感态度与价值观：通过小组协作和问题研究活动，培养学生协作的意识和团队探索的精神，从而激 发创作热情。
四、教学重点与难点教学重点： 利用 FrontPage 新建网页并编辑；使用表格进行网页的页面布局；超链接有关内容及组件属性。
教学难点： 书签、热点超链接五、教学策略选择与设计1、采用情境教学的方式促进学生积极参与多媒体所创设情境下的建构知识活动，建立一定的探索情境，让学生观摩、思考、讨论，培养学生的观察、发现及思考的能力，激发学习兴趣。
2. 采用讲授、演示、问题启发式、任务驱动的方式，将教学重点、难点逐个攻破，并运用分层递进教学 法促进各层学生不断进步，开发学生潜能、发展个性、关注每位学生，全面提高学生的信息素养。
《网页制作》项目式教案
《网页制作》项目式教案一、教学目标1. 了解网页制作的基本概念和流程。
2. 掌握HTML、CSS和JavaScript的基本语法和用法。
3. 能够独立设计并制作一个简单的网页。
二、教学内容1. 网页制作的基本概念和流程。
2. HTML的基本语法和常用标签。
3. CSS的基本语法和常用样式。
4. JavaScript的基本语法和常用函数。
5. 网页设计的原则和技巧。
三、教学方法1. 讲授法：讲解网页制作的基本概念、HTML、CSS和JavaScript的基本语法。
2. 案例分析法：分析经典网页案例，引导学生掌握网页设计的原则和技巧。
3. 实践操作法：让学生动手实践，制作一个简单的网页。
四、教学环境1. 计算机教室：每台计算机都安装有网页制作相关软件。
2. 网络环境：教室内的计算机可以正常连接互联网。
五、教学评价1. 课堂参与度：学生参与课堂讨论和提问的情况。
2. 课后作业：学生完成的网页设计作品。
3. 实践操作能力：学生在课堂上的实际操作表现。
六、教学资源1. 教材：《网页制作教程》2. 课件：教师准备的PPT3. 案例库：收集的各种经典网页设计案例4. 在线资源：互联网上的网页制作相关教程和素材5. 辅助工具：网页制作软件（如HTML编辑器、CSS预处理器等）七、教学安排1. 课时：本课程共计32课时，每课时45分钟。
2. 教学计划：第1-4课时：讲解网页制作的基本概念和流程第5-8课时：学习HTML的基本语法和常用标签第9-12课时：学习CSS的基本语法和常用样式第13-16课时：学习JavaScript的基本语法和常用函数第17-20课时：分析经典网页案例，掌握网页设计的原则和技巧第21-24课时：实践操作，制作一个简单的网页第25-28课时：学生作品展示和评价八、教学步骤1. 引入：通过展示经典网页案例，引发学生对网页制作的兴趣。
2. 讲解：详细讲解网页制作的基本概念、HTML、CSS和JavaScript的基本语法。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
《网页制作》教学设计（优质课比赛优秀设计）《网页制作》教学设计
一、教材或教学内容分析
本章内容在本教材中的位置处于第五章，是在文字处理(Word2000)和网络基础及因特网应用两章之后。
学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品，在软件的使用上有很多的共通之处，所以在学习frontpage的时候，很多内容可以让学生自学，而不必面面俱到地在课上讲授。
而第四章网络基础及因特网的应用又为学生对网页的理解奠定了基础，学生对网页中的基本元素——文字、图片、动画、声音等都有所了解，而网页的制作就是将这些元素重新组合到网页上，学生要学的就是这种组合的方法。
所以说，虽然大多数学生以前都未接触过网页的制作，但有了以上这些基础，学起来就轻松多了。
本章内容按照学生已有的基础，我对教学内容分了一下类，也为教学的组织工作打下一点基础。
本章内容主要由网页基础知识、网站的建立和管理、网页的制作、创建超链接、图片的处理、网页框架。
重点是网页的制作和创建超链接，学会了这些就可以开始简单的网页制作了。
难点是网页框架，这部分相互之间关系比较复杂，必要时，老师在对各组个别辅导时，可以给予分别讲解。
这个分类可以为组长安排各个组员的任务提供参考，使分工更加合理。
二、教学对象的分析
第 1 页共 6 页
信息技术课虽然已经成为初中的必修科目，但是城乡学生之间掌握情况的差异却相当大，条件好一点的初中学生不仅已经熟练掌握了课本上的内容，还对一些常
用软件有所了解;而差一点的可以说是从高中开始才正式接触到信息技术知识的学习，他们需要多锻炼、多指导，所以协作学习对学生的学习帮助很大。
三、教学策略的选择及媒体的使用
在教学策略的选择上，我使用的是任务驱动和协作学习相结合的方法。
任务驱动就是要求本章内容学习完之后，每个小组都要完成自己班级网站的制作，并在全班进行评比，选择最好的作为班级主页挂到学校主页上去，这有助于激发学生参与学习的积极性。
协作学习则是让学生在学习过程中互帮互助，用较短的时间、教少的精力学到更多的东西，完成一个集体项目，让他们在学习之后获得成就感。
因此在媒体的选择上，我们使用的是TOP2000系统。
TOP2000系统有利于教师进行分组教学和学生作品的点评及成果的展示。
教学过程开始之前，教师把学生按座位分成四组，每个组都按学生对计算机的掌握程度平均分配，保证每个组都有计算机操作方面比较突出的，也有相对比较差的，使其形成能够互帮互助的学习小组。
并由他们自己选出组长各一名，然后由组长根据组员的情况，确定在班级主页制作过程中主要完成什么任务，也就是说起到一个组织者的作用。
做过网页的人都知道，做网页是一项比较费时的工作，而要学生在较短的时间内制作出像样的网页是比较困难的，而在这个过程中，网页的设计占去了相当多的一部分时间，组长把任务分到各组员头上以后，组员就可根据自己要完成的任务相对集中的做某方面的工作，做完以后，组员之间进行经验交流，告诉组员自己的网页是如何制作出来的，在完成自己的网页后，再重复一遍制作过程花费的时间的不多的。
这样，其他组员就可在较短的时间之内
第 2 页共 6 页
掌握比较先进的网页制作方法，而不必再花那么多时间去探索。
因为每位组员都必
须自己完成一个任务，所以在这个过程中，也同样有自己探索学习的机会和介绍自
己经验的机会，使组内的每个学生都在学习中获得成就感。
四、教学过程
教学进程教师活动学生活动
课前将本章内容的基本结构、内
容的归类、网页基础知识、网页学生根据自己的分组
素材做成一个网站，供学生参情况选出组织能力较
一、课前准备考，网站上的内容可根据学生以强、计算机水平较高的
后在学习中的要求添加。
根据学人做组长，协作小组形
生对已有的网页制作的情况进成。
行分组。
在教师对网页基础知
识讲解的基础上，浏览第一节课，教师简单介绍网页基
教师制作的网站，继续础知识，并给各小组布置任务—
学习; —用下面的时间完成班级网页
二、教师布置任务，
的制作，并对组长进行本章基本课后各组设计自己的作必要讲解
内容及本章内容的分类的介绍，班级主页，组长根据网
让他们对本章内容有总体上的站上教师对本章内容
把握。
的分类给学生布置任
务。
三、教师指导分工第二节课教师对组长对全组的学生根据分工制作网
第 3 页共 6 页
情况，学生开始自分工情况给予检查，提出意见和页，学习可以跟着课本主学习建议。
上自学，也可根据以前
学习Word的经验自己
摸索制作过程，不懂之
处可向会的同学请教，
还可以相互之间讨论，
在网页的设计方面也
可以相互之间多商量，
发扬互帮互助的精神。
下面三节课，老师在每组各用10
分钟时间检查他们上节课的网
四、学生自主学习，学生继续学习、制作网
页制作情况，并对他们碰到的问
教师指导、监督页。
题给予提示或解决，起指导和监
督作用。
各组分别展示自己的
四节课的制作以后，各组员所制作品，其他组对他们可
作的网页都初见雏形，所以教师以提出意见或建议，也五、阶段总结组织一堂课，由各组展示自己的可从其他组的学到好
作品。
教师在学生评讲完后，给的创意。
由组长在课后
予总结。
写一份阶段总结，从而
指导以后的工作。
六、学生自主学习，下面四节课，老师仍然对每组各学生继续学习、制作网教师指导、监督花10分钟时间轮流检查他们上页。
第 4 页共 6 页
节课的网页制作情况，并对他们
碰到的问题给予提示或解决，起
指导和监督作用。
组长或组长安排人将
各组的主页进行汇总，七、各组将内容汇教师对各组出现的问题提出建
形成一个完整的班级总，形成班级主页议或意见。
主页，对欠缺的地方进
行修补。
老师请其他信息技术教师来作
评委，对各组做的网站提出意见
八、班级网站制作各组分别展示自己组
或建议，评出最佳网站、最佳创
完成，展示与总结所制作的班级主页。
意等奖，让大家的付出都有所收
获。
课后:大家集中各组的优势，将班级主页完成，挂到学校主页上下面是我所做出的评价:
【优点】:
1、对教学内容分析得体，对教学重难点把握准确，使用的软件难易适中!
2、对学生的基础分析到位，这样可以更好的把握教学进度!
3、任务驱动法及小组合作学习的方法进行，特别在小组协作中分工相当明确，
组长做什么，每位组员做什么都很明确，充分调动了学生的学习积极性，同时也锻
炼学生们的团结协作精神!
第 5 页共 6 页
4、做到了学生为主体，教师为主导，教学过程中有师生活动和生生活动，课堂气氛活跃，使得人人参与课堂教学。
【建议】:
1、信息技术教学应更多培养学生的信息素养。
2、布置课堂任务要分易、难至少两个，这样可有效调动不同层次学生的学习积极性。
3、提交教学任务后，应让学生通过教学软件或网络进行上传，并将其展示给学生，进行互评，从而调动学生的学习积极性，提高任务的完成质量。
4、建立良好的评价体系，包括教师评价学生的作业，学生对教师教学内容及方法的评价，学生互评等。
第 6 页共 6 页。