下载文档原格式
本实训项目的目的与任务是使学生根据问题的要求，构思一个主题，并运用网页制作工具，制作和发布网页，并对此进行更新和维护，掌握网站发布的工作流程，了解域名申请、空间申请的方法，能在校园网及英特网上发布网页。
实训学时数：125 （5周）课外学时数：100适用方向：办公自动化、电子商务执笔者：王平露编写日期：2006年4月一、实训教学的目的与任务本实训项目的目的与任务是使学生根据问题的要求，构思一个主题，并运用网页制作工具，制作和发布网页，并对此进行更新和维护，掌握网站发布的工作流程，了解域名申请、空间申请的方法，能在校园网及英特网上发布网页。
通过设计、编辑和发布网页全过程的实际训练使学生对网页整体设计流程有一个深刻的认识，并且熟练掌握网页制作工具（Dreamweaver MX ）的使用，初步掌握HTML、CSS语法格式，能借助手册看懂代码，能进行简单的代码改写工作，了解客户端脚本和服务端脚本区别，了解在网页上进行简单代码的嵌入与改写，会与其他工具结合使用以便实现更高效高质量的网页效果，进一步提高办公自动化效率和水平。
二、实训项目的基本要求及考核标准基本要求：（一）网页内容要求：1、主题内容：创意突出，体现校园园区精神文明建设体现本班级大学生风貌，学习气氛浓厚，作品内容健康。
严禁发布反对政府、宣传迷信、传播色情、系统破坏、黑客教程等违法信息。
2、具体内容：标徽、标题、各链接页具体内容，站内搜索、计数器、留言系统、电子邮件地址、弹出窗口、漂浮广告、背景音乐、网页特效、友情链接、版权信息等。
（二）制作基本要求：1、至少有10 个页面，链接结构应有三层，下一层必须有返回上层的按钮或链接。
有整体框架结构，导航栏，表格定位，布局合理，色彩搭配协调统一。
2、主页的文件名为：index.htm 。
文件名一般用英文小写字母。
3、网页中要有文本、图像、表格、交互与链接、层与动画、表单。
4、网页主要建立站内链接，尽量少建立外部链接，至少建立一个E-mail 链接至你的邮箱。
《网页设计与制作》教案第一章：网页设计基础1.1 教学目标让学生了解网页设计的基本概念和原则让学生掌握网页设计的流程和方法1.2 教学内容网页设计的概念和定义网页设计的原则和要素网页设计的流程和方法1.3 教学方法讲授法：讲解网页设计的概念和原则实践法：学生动手实践设计简单的网页1.4 教学评价学生能回答出网页设计的概念和定义学生能理解并运用网页设计的原则和要素学生能独立完成简单的网页设计第二章：HTML与CSS基础2.1 教学目标让学生了解HTML和CSS的基本概念和作用让学生掌握HTML和CSS的基本语法和用法2.2 教学内容HTML的基本概念和语法CSS的基本概念和语法HTML和CSS的综合应用2.3 教学方法讲授法：讲解HTML和CSS的基本概念和语法实践法：学生动手实践编写HTML和CSS代码2.4 教学评价学生能回答出HTML和CSS的基本概念和作用学生能理解并运用HTML和CSS的基本语法和用法学生能独立完成简单的HTML和CSS代码编写第三章：网页布局与排版3.1 教学目标让学生了解网页布局和排版的基本原则和方法让学生掌握使用HTML和CSS进行网页布局和排版的技术3.2 教学内容网页布局的基本原则和方法网页排版的基本原则和方法使用HTML和CSS进行网页布局和排版的技术3.3 教学方法讲授法：讲解网页布局和排版的基本原则和方法实践法：学生动手实践进行网页布局和排版3.4 教学评价学生能回答出网页布局和排版的基本原则和方法学生能理解并运用HTML和CSS进行网页布局和排版的技术学生能独立完成具有良好布局和排版的网页设计第四章：网页动画与交互4.1 教学目标让学生了解网页动画和交互的基本概念和原理让学生掌握使用HTML和CSS实现网页动画和交互的技术4.2 教学内容网页动画的基本概念和原理网页交互的基本概念和原理使用HTML和CSS实现网页动画和交互的技术4.3 教学方法讲授法：讲解网页动画和交互的基本概念和原理实践法：学生动手实践实现网页动画和交互4.4 教学评价学生能回答出网页动画和交互的基本概念和原理学生能理解并运用HTML和CSS实现网页动画和交互的技术学生能独立完成具有动画和交互功能的网页设计第五章：网页优化与推广5.1 教学目标让学生了解网页优化和推广的基本概念和方法让学生掌握使用SEO和网络营销技术进行网页优化和推广的技巧5.2 教学内容网页优化的基本概念和方法网页推广的基本概念和方法使用SEO和网络营销技术进行网页优化和推广的技巧5.3 教学方法讲授法：讲解网页优化和推广的基本概念和方法实践法：学生动手实践进行网页优化和推广5.4 教学评价学生能回答出网页优化和推广的基本概念和方法学生能理解并运用SEO和网络营销技术进行网页优化和推广的技巧学生能独立完成具有优化和推广功能的网页设计第六章：网页图像处理与多媒体应用6.1 教学目标让学生了解网页图像处理的基本概念和工具让学生掌握网页图像处理和多媒体应用的技术6.2 教学内容网页图像处理的基本概念和工具（如Photoshop、Fireworks等）多媒体元素在网页中的应用（如音频、视频等）图像和多媒体的HTML和CSS标记6.3 教学方法讲授法：讲解网页图像处理的基本概念和工具实践法：学生动手实践进行网页图像处理和多媒体应用6.4 教学评价学生能回答出网页图像处理的基本概念和工具学生能理解并运用网页图像处理和多媒体应用的技术学生能独立完成具有图像和多媒体应用的网页设计第七章：网页编程技术7.1 教学目标让学生了解网页编程的基本概念和语言让学生掌握常用的网页编程技术和框架7.2 教学内容网页编程的基本概念和语言（如JavaScript、jQuery等）常用的网页编程技术和框架（如Bootstrap、React等）编程实践和项目案例7.3 教学方法讲授法：讲解网页编程的基本概念和语言实践法：学生动手实践进行网页编程和技术应用7.4 教学评价学生能回答出网页编程的基本概念和语言学生能理解并运用常用的网页编程技术和框架学生能独立完成编程实践和项目案例第八章：移动网页设计与制作8.1 教学目标让学生了解移动网页设计的基本概念和原则让学生掌握移动网页设计与制作的技术和工具8.2 教学内容移动网页设计的基本概念和原则移动网页设计与制作的技术和工具（如Responsive Design、Adobe Edge Mobile等）移动网页设计的实践和案例分析8.3 教学方法讲授法：讲解移动网页设计的基本概念和原则实践法：学生动手实践进行移动网页设计与制作8.4 教学评价学生能回答出移动网页设计的基本概念和原则学生能理解并运用移动网页设计与制作的技术和工具学生能独立完成移动网页设计与制作的项目案例第九章：网页项目实战与团队协作9.1 教学目标让学生了解网页项目实战的基本流程和方法让学生掌握团队协作的基本技巧和工具9.2 教学内容网页项目实战的基本流程和方法团队协作的基本技巧和工具（如Git、Project Management Software等）项目案例分析和实战演练9.3 教学方法讲授法：讲解网页项目实战的基本流程和方法实践法：学生分组进行项目实战和团队协作9.4 教学评价学生能回答出网页项目实战的基本流程和方法学生能理解并运用团队协作的基本技巧和工具学生能独立完成项目实战和团队协作的任务第十章：网页设计与制作的未来趋势10.1 教学目标让学生了解网页设计与制作的未来趋势和发展方向让学生掌握前沿技术和创新思维的方法10.2 教学内容网页设计与制作的未来趋势和发展方向（如VR/AR、等）前沿技术和创新思维的方法（如Blockchn、Design Thinking等）创新项目和案例分析10.3 教学方法讲授法：讲解网页设计与制作的未来趋势和发展方向实践法：学生进行创新项目和思维训练10.4 教学评价学生能回答出网页设计与制作的未来趋势和发展方向学生能理解并运用前沿技术和创新思维的方法学生能独立完成创新项目和案例分析重点和难点解析重点环节一：网页设计的概念和原则重点关注学生对网页设计的基本理解，以及如何运用设计原则进行网页创作。
网页制作教学设计（经典版）编制人：__________________审核人：__________________审批人：__________________编制单位：__________________编制时间：____年____月____日序言下载提示：该文档是本店铺精心编制而成的，希望大家下载后，能够帮助大家解决实际问题。
文档下载后可定制修改，请根据实际需要进行调整和使用，谢谢!并且，本店铺为大家提供各种类型的经典范文，如工作总结、实习报告、职业规划、职场语录、规章制度、自我介绍、心得体会、教学资料、作文大全、其他范文等等，想了解不同范文格式和写法，敬请关注!Download tips: This document is carefully compiled by this editor. I hope that after you download it, it can help you solve practical problems. The document can be customized and modified after downloading, please adjust and use it according to actual needs, thank you!Moreover, our store provides various types of classic sample essays, such as work summaries, internship reports, career plans, workplace quotes, rules and regulations, self introductions, insights, teaching materials, complete essays, and other sample essays. If you want to learn about different sample formats and writing methods, please pay attention!网页制作教学设计网页制作教学设计（通用5篇）作为一名老师，时常要开展教学设计的准备工作，教学设计是实现教学目标的计划性和决策性活动。
第1篇一、引言随着互联网技术的飞速发展，网页设计已经成为计算机科学与技术领域的一个重要分支。
为了提高学生的实际操作能力和综合素质，我国高校纷纷开设了网页设计相关课程。
本文将结合本人参与的一次网页设计实践教学，总结实践经验，分析存在的问题，并提出改进建议。
二、实践教学内容本次实践教学主要围绕以下内容展开：1. 网页设计的基本理论介绍了网页设计的基本概念、设计原则、色彩搭配、版式布局等方面的知识，使学生对网页设计有了初步的认识。
2. 网页设计工具的使用教授了Dreamweaver、Photoshop等常用网页设计工具的使用方法，让学生能够熟练掌握这些工具的基本操作。
3. 网页布局与排版讲解了网页布局的基本方法，如表格布局、框架布局、浮动布局等，以及排版技巧，使学生能够根据需求设计出美观、实用的网页。
4. 网页特效制作介绍了网页特效的制作方法，如CSS3动画、JavaScript脚本等，使学生在网页设计中能够运用各种特效，提升网页的互动性和美观度。
5. 网页优化与SEO讲解了网页优化的方法，如页面加载速度优化、代码优化等，以及搜索引擎优化（SEO）的基本策略，使学生在设计网页时能够考虑搜索引擎的收录和排名。
6. 实战项目通过一个实际项目，让学生运用所学知识进行网页设计，培养学生的实践能力和团队合作精神。
三、实践教学过程1. 理论教学首先，教师对网页设计的基本理论进行讲解，使学生了解网页设计的背景、发展历程和设计原则。
2. 工具教学接着，教师介绍常用的网页设计工具，如Dreamweaver、Photoshop等，并演示这些工具的基本操作。
3. 实战演练在掌握基本理论和技术后，教师引导学生进行实战演练，让学生在实践中巩固所学知识。
4. 项目实施教师布置一个实际项目，让学生以小组形式进行分工合作，完成网页设计任务。
5. 评价与总结在项目完成后，教师组织学生进行评价和总结，指出学生的优点和不足，并提出改进建议。
《网页制作》教学设计（优质课比赛优秀设计）《网页制作》教学设计一、教材或教学内容分析本章内容在本教材中的位置处于第五章，是在文字处理(Word2000)和网络基础及因特网应用两章之后。
学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品，在软件的使用上有很多的共通之处，所以在学习frontpage的时候，很多内容可以让学生自学，而不必面面俱到地在课上讲授。
而第四章网络基础及因特网的应用又为学生对网页的理解奠定了基础，学生对网页中的基本元素——文字、图片、动画、声音等都有所了解，而网页的制作就是将这些元素重新组合到网页上，学生要学的就是这种组合的方法。
所以说，虽然大多数学生以前都未接触过网页的制作，但有了以上这些基础，学起来就轻松多了。
本章内容按照学生已有的基础，我对教学内容分了一下类，也为教学的组织工作打下一点基础。
本章内容主要由网页基础知识、网站的建立和管理、网页的制作、创建超链接、图片的处理、网页框架。
重点是网页的制作和创建超链接，学会了这些就可以开始简单的网页制作了。
难点是网页框架，这部分相互之间关系比较复杂，必要时，老师在对各组个别辅导时，可以给予分别讲解。
这个分类可以为组长安排各个组员的任务提供参考，使分工更加合理。
二、教学对象的分析第 1 页共 6 页信息技术课虽然已经成为初中的必修科目，但是城乡学生之间掌握情况的差异却相当大，条件好一点的初中学生不仅已经熟练掌握了课本上的内容，还对一些常用软件有所了解;而差一点的可以说是从高中开始才正式接触到信息技术知识的学习，他们需要多锻炼、多指导，所以协作学习对学生的学习帮助很大。
三、教学策略的选择及媒体的使用在教学策略的选择上，我使用的是任务驱动和协作学习相结合的方法。
任务驱动就是要求本章内容学习完之后，每个小组都要完成自己班级网站的制作，并在全班进行评比，选择最好的作为班级主页挂到学校主页上去，这有助于激发学生参与学习的积极性。
网页设计与制作实训实施方案一、实训目标本次网页设计与制作实训的主要目标是让学生掌握网页设计与制作的基本技能和流程，培养学生的创新思维和实践能力，提高学生的团队协作和沟通能力，为学生今后从事相关工作打下坚实的基础。
具体目标包括：1、让学生熟悉网页设计与制作的常用工具和技术，如 HTML、CSS、JavaScript 等。
2、培养学生的网页布局和色彩搭配能力，使学生能够设计出美观、实用的网页界面。
3、提高学生的网页交互设计能力，让学生能够实现网页的动态效果和用户交互功能。
4、培养学生的团队协作精神，让学生在团队中学会分工合作、相互沟通和协调。
5、增强学生的问题解决能力和自主学习能力，让学生能够独立解决在网页设计与制作过程中遇到的各种问题。
二、实训内容1、网页设计基础知识网页的基本概念和构成要素，如网页的结构、布局、色彩、字体等。
网页设计的原则和规范，如用户体验、可用性、可访问性等。
2、 HTML 与 CSS 基础HTML 标签的使用，如标题标签、段落标签、链接标签、图像标签等。
CSS 样式的应用，如字体样式、背景样式、边框样式、布局样式等。
3、网页布局设计常见的网页布局方式，如流式布局、固定布局、响应式布局等。
使用CSS 实现网页的布局，如浮动布局、定位布局、弹性布局等。
4、网页色彩搭配色彩的基本原理和搭配原则，如色相、饱和度、明度等。
运用色彩心理学知识，为网页选择合适的色彩方案。
5、网页图像处理图像的格式和优化，如 JPEG、PNG、GIF 等。
使用图像编辑工具，如 Photoshop，对网页图像进行处理和制作。
6、网页交互设计JavaScript 基础语法和常用函数，如变量、数据类型、控制结构等。
使用 JavaScript 实现网页的动态效果，如轮播图、下拉菜单、表单验证等。
7、网页项目实践学生分组完成一个完整的网页设计与制作项目，包括需求分析、设计规划、页面制作、测试发布等环节。
三、实训方法1、课堂讲授由教师讲解网页设计与制作的相关知识和技能，通过案例分析和演示，让学生直观地了解网页设计与制作的过程和方法。
《网页制作技术》项目教学法的实践应用
摘要：在《网页制作技术》教学中采用项目教学法，为学生实践和实习作好了准备，充分体现了职业教育以“学生为主体，以能力为本位”的价值取向。
文章将结合本人在《网页制作技术》课程中进行的教学实践，从教师的“教”和学生的“学”两个方面入手进行研究，旨在探讨如何在《网页制作技术》课程中实施项目教学法，进一步提高学生的专业技能，以实现培养网站构建人才的课程教学目标。
关键词：网页制作技术；项目教学法；网站项目
《网页制作技术》是我校计算机信息管理、电子商务等专业的主干课程，具有实用性强，应用面广，操作性强、与岗位联系密切等特点。
为了更好地讲授《网页制作技术》课，我们进行了大胆的教学改革，打破了传统的教学模式，将项目教学法引入课堂教学，使学生成为学习的主体，教师在教学过程中起引导协助作用。
学生在项目的驱动下自主学习，边学边做。
有些能力突出的学生在学习过程中主动与外界联系，承接小型网站建设项目。
在完成项目的过程中，他们主动与其他同学和教师进行交流，讨论问题，促进了项目教学法的发展。
项目完成后所带来的成功的愉悦和满足感，不但提高了学生的学习兴趣和学习积极性，同时也培养了学生自主学习的能力。
笔者在担任《网页制作技术》课的教学过程中，结合学生的特点以及环境，将教学过程划分成以下五个阶段。
一、确定合适的项目，创建学习情境
项目教学法能否获得好的教学效果，与教师能否制定出合适的项目来激发学习的积极性有很大的关系。
当然要保证良好的教学效果，光有学习的积极性是不够的，还必须让学生最后能够完成既定的目标项目，拥有成就感，这就要求准备实施项目的时间要充裕，并且项目要难易适中，在进度上遵循由易到难。
只有符合以上条件的项目才能为学生创设良好的学习情境，达到最佳的教学效果。
在实践教学中，教师先让学生分成若干个项目小组，每个小组成员3-4人，有一位组长负责。
对于首次接触这门课程的学生，由教师负责选取项目，讲解知识点。
所选取的项目必须简单、典型，并且最好选择已经完成的项目，以便学生进行知识的迁移。
对于具有一定基础的学生，可由教师和学生共同讨论选定具有较高难度的项目，并且最好选择正在进行中的项目，让学生身临其境，参与创造实践活动，亲身体验实践的艰辛与乐趣。
另外，应注意根据学生具体的培养方向，
确立最适合的项目。
二、进行需求分析，制定项目计划
网站项目的计划应按照项目开发的需求加以实施。
确定项目以后，让每一组学生针对该项目进行需求分析，启发学生主动发现身边的素材。
对于已通过验收的项目，可由教师充当企业的角色，由学生向教师汇报自己所进行的关于项目需求的分析及收集到的资料：对于正在进行中的项目，可由学生直接面对企业，与企业沟通，做出需求分析。
教师在这一过程中，一方面，起到指导的作用，另一方面，在对已验收的项目实施的过程中，教师应事先对该项目内容进行定位，分析研究需要解决的问题和完成的任务，确保学生进行需求分析时，不会定位过高。
完成项目需求分析后，教师应根据学生所作的需求分析确定项目的能力模块，并将每个能力模块细分为一系列小项目，学生根据课程的时间安排，结合项目内容编写项目开发计划书。
三、网站项目实施
网站项目实施是整个项目最关键的环节。
在该过程中，教师应引导学生按时按量地完成自己负责的功能模块，保证项目顺利进行，实现课程教学目标。
参与此次课程的学生已经具备一定的网页制作软件操作基础，对此软件已经操作熟练，但不具备一些制作原则和技巧，同时，不具备ASP的相关知识，给项目的完成带来了一定的难度。
因此，应先给学生讲授网页制作软件的使用技巧以及ASP的相关功能模块，为项目的完成奠定基础，最后还要求学生撰写网站开发总结报告。
实施方法：首先，教师通过简单的小项目讲解实际操作方法，然后，让学生练习新知识、新操作，完成相应的实验项目。
通过一系列小项目地完成让学生牢固基础知识。
其次，则可以根据需求计划，小组成员之间相互探讨，找出各自的优势，按照项目计划书分配每个成员的任务，如：美术基础较好的同学可以负责前台页面的制作；在编程方面具有优势的同学可以负责后台管理模块的制作。
当然，虽然每个小组成员都有自己的任务，这样可以充分发挥小组合作学习的优势，但每个成员也必须具备完成其他成员任务的能力。
在这个过程中，教师应注意观察学生完成的进度，“查缺补漏”，要根据各小组完成的具体情况及项目计划书的具体要求对学生进行适当的指导，解决学生完成项目过程中遇到的问题，以保证学生能够按时按量地完成项目计划书中的各项需求。
同时，注意收集各小组遇到的难题，定期进行交流和总结。
最后，学生完成网站建设后，撰写网站开发总结
报告，总结完成本项目的收获和经验，改正不足之处，为下一个项目的完成做准备。
四、网站项目展示与评价
项目完成后，应对网站项目的建设效果进行展示，并加以讲解。
在讲解展示网站的过程中，学生和教师可以提出问题，并结合相应的网站项目评分表，形成学生和教师对该项目各自的评价。
在对学生进行评价时，还应结合其在项目开发过程中的学习能力、合作能力、参与程度、服务程度以及所起作用等各方面的表现情况。
在对承接的企业的开发项目进行评价时，除上述评价角度外，教师可以邀请业界专家、专业教师和学生们一起来来评价项目成果。
在实践教学中，笔者邀请了部分当地网站的负责人、从事网络研究的学者，和笔者以及各组学生一起评价各组制作的网站作品。
学生通过比较各组作品进行自测，业界专家、学者与专业教师从不同的角度来评价，让学生得到专业的指导，了解自己今后学习努力的方向。
五、网站项目验收及点评、总结
项目完成后，就要对各小组的成果进行展示、评比、学习和总结。
我们建立评比小组，根据项目计划书及小组的完成情况提出问题，小组成员回答问题的同时需展示完成的项目功能。
最后，由评比小组根据成员回答情况及项目各项功能的完成情况进行打分。
最后由教师点评，对项目完成情况加以讲解并提出更高要求。
如果有条件的话，可以邀请企业中的专业人员对学生作品进行评价，这样可以让学生了解本行业最前沿的知识，尽早了解社会对网页制作方面人才的要求，进一步提升学生的技能水平，为以后就业打好坚实的基础。
综上所述，项目教学法就是学生利用教师创设的“情境”，自主探究、分工协作，在老师的指导下，完成项目。
在此过程中可以激发学生学习的积极性、主动性。
经过教学实践，笔者发现项目教学法比传统教学法更适合《网页制作技术》课程的教学。
参考文献：
[1]董雁，网站设计课程中项目教学法的研究[J]，中国科教创新导刊，2007(3)
[2]王栋松，在计算机课程教学中开展项目教学法的研究[J]，职业教育研究，2005(11)
[3]万良，黄锦祝，网页制作技术课程改革探索，中国职业技术教育。
2007(7)
[4]贺平，项目教学法的实践探索[J]，中国职业技术教育，2006(22)。
