网页设计教学设计3篇 "创新设计，探索网页设计教学的更高境界"

本文主要介绍网页设计教学设计，包括教学目标、教学内容和教学方法等方面的内容。通过系统的教学设计，能够帮助学生更好地掌握网页设计的基本知识和技能，提高其实践能力和创新能力，为今后的就业和创业打下坚实的基础。

第1篇

?网页设计与制作》是中计算机专业开设的一门专业必修课，是计算机类专业的一门实践环节课程，也可以作为其他相关专业的实践课程或选修课，它是一门操作性和实践性很强的职业技术课程。本课程的主要内容为系统介绍网页编辑与制作软件dreamweaver cs3，通过这种有代表性的网页制作软件的使用，掌握网站设计的全过程，并能熟练地制作出有专业水准的网站。2、课程任务

本门课程在专业教学计划中起着十分重要的作用，通过这门课程，学生可以掌握以下技能和知识：

* 掌握网站的开发流程，如建站规划、效果图制作、建立站点等相关知识。

* 掌握各种网页元素在dreamweaver cs3中的使用。例如表格、文本、图像、超级链接、层和表单等。

* 熟悉一些网页设计辅助软件的功能和使用方法。例如flash、fireworks、photoshop等。* 掌握测试和发布网站的方法。包括网站测试的内容和方法。* 能够解决一些网页设计中的常见问题。

* 了解asp开发平台的搭建，dreamweaver cs3在动态网页制作方面的应用。

（1）使学生通过本课程的学习，掌握dreamweaver cs3的使用方法，学会使用dreamweaver cs3制作web网页的技术。

（2）本课程学习结束后，学生应能自行设计各种网页、开发一定规模的网站，使学生通过本课程的学习，熟练掌握其基本制作方法和技巧，并最终设计一个综合性的网站并且编制简单的脚本上传到互联网上。

深入了解internet，理解、http、html等概念及作用；掌握网站设计和发布的1 流程。理解网站维护管理的意义及重要性，理解服务器、客户端、浏览器的概念和作用；了解多种网页制作软件和图像处理软件相结合设计网站的好处。了解dreamweaver cs3在动态网站上的应用。（2）素质要求

本课程将培养学生以下几方面的职业素质： 服务意识：能够为他人提供优质的服务；

文明法制意识：网站内容应积极健康向上，不做违法的事；

合作精神：能够与他人进行合作，具有协调工作能力和组织管理能力； 较强的自我知识及技术更新能力：快速跟踪网页制作的新技术及市场应用动态。

学生应按照《网页设计与网站建设课程设计指导书》的要求认真设计。教师应掌握好课程设计的总体进度，并组织答疑，以保证学生按时保质、保量地完成任务。学生最后所完成的《网页设计与网站建设课程设计报告》应当做到内容齐全、条理清楚、文字通畅、打印或书写规范。

（2）域名注册与建站方式选择论证（3）网站总体设计（4）网站静态页面设计（5）web数据库设计

网页设计概述：重点讲授网站，网页设计的概念；了解网页设计设计的相关概念；了解网页设计的语言html；掌握学习网页设计的某一种工具；理解网站和网页的关系。

网页赏析：初步了解网页赏析要求；理解网页赏析的理论要求；掌握网页突破性设计的要素；分清各类网站的设计要求和框架；理解实例分析过程。

网页规划与布局：了解网页的组织结构，掌握网页内容上的组织方法；熟悉网页设计的流程和注意事项；了解网站的规划与建设；熟悉网站设计，掌握网站与网页的区别。

网页设计创意：通过对创意思维及创意手法的讲解，辅以对优秀网页作品的分析，启发学生全面的创新思维，进而从多角度的思维中独树一帜，培养学生的个性化意识。让学生对优秀设计的创意进行解读和阐释，并分析其创新之处，鼓励学生敢于发觉新意，提2 出自己独到的见解。

网页编程语言：了解html、css的定义、概念和作用；理解html语言中的各种文本格式、字符格式、段落设置、列表标记的作用；会用html语言总的标记设置颜色、文本格式和列表；掌握html的语法结构，掌握html语言中标记的使用方法；理解表格、框架、表单的作用。理解css样式表的作用和意义；掌握css样式表的结构；掌握在网页中添加css的方法。掌握三种添加样式信息的方法，会使用css设置网页格式和列表的格式。

（1）通过教学，使学生能够用基本法和高级法新建站点、编辑站点，掌握如何在站点中新建文件和文件夹，会预览网页。

（2）掌握表格的组成和基本操作方法；熟练掌握穿件表格、表格操作、表格编辑的方法；（3）掌握表单的基本概念和表单的各个组成元素；掌握插入表单以及表单元素的方法；会制作具有表单的网页。

（4）通过教学，掌握在动画中添加声音的操作方法以及设置动画声音的各种属性。（5）通过教学，使学生掌握导出与发布flash动画的方法，能够准确设置flash8动画作品的发布格式。

动态网页介绍：掌握静态网页和动态网页的概念；了解实现动态网页的四种技术（cgi、asp、jsp和php）的特点；掌握数据库、数据库管理系统、web数据库的概念及关系数据库的特点；理解数据库在开发动态网页中的地位；了解asp、jsp、php如何访问web数据库。

设计实例：综合运用前七章所学的知识创建和编辑一个站点，掌握主页和子页、子页之间、以及站内和站外的链接。

1、教学方法：本课程是一门应用型课程，涉及到以前所学知识点较多，因此在教学中应注意启发式教学并加强项目教学的直观性。

2、教学场所与设备要求：安装有 windows xp 或 windows 2000 的机房均可以进行实验，教学要求在多媒体教室进行。

有笔试和机试两种考试形式，主要由选择题、实验操作题组成。在总成绩中，笔试成绩和上机考试成绩各占50%。

第2篇

?网页设计与制作》是中计算机专业开设的一门专业必修课，是计算机类专业的一门实践环节课程，也可以作为其他相关专业的实践课程或选修课，它是一门操作性和实践性很强的职业技术课程。本课程的主要内容为系统介绍网页编辑与制作软件dreamweaver cs3，通过这种有代表性的网页制作软件的使用，掌握网站设计的全过程，并能熟练地制作出有专业水准的网站。2、课程任务

本门课程在专业教学计划中起着十分重要的作用，通过这门课程，学生可以掌握以下技能和知识：

* 掌握网站的开发流程，如建站规划、效果图制作、建立站点等相关知识。

* 掌握各种网页元素在dreamweaver cs3中的使用。例如表格、文本、图像、超级链接、层和表单等。

* 熟悉一些网页设计辅助软件的功能和使用方法。例如flash、fireworks、photoshop等。* 掌握测试和发布网站的方法。包括网站测试的内容和方法。* 能够解决一些网页设计中的常见问题。

* 了解asp开发平台的搭建，dreamweaver cs3在动态网页制作方面的应用。二、课程教学目标与要求

（1）使学生通过本课程的学习，掌握dreamweaver cs3的使用方法，学会使用dreamweaver cs3制作web网页的技术。

（2）本课程学习结束后，学生应能自行设计各种网页、开发一定规模的网站，使学生通过本课程的学习，熟练掌握其基本制作方法和技巧，并最终设计一个综合性的网站并且编制简单的脚本上传到互联网上。

深入了解internet，理解、http、html等概念及作用；掌握网站设计和发布的 以人为本 诚信务实 勇于创新 乐于奉献

流程。理解网站维护管理的意义及重要性，理解服务器、客户端、浏览器的概念和作用；了解多种网页制作软件和图像处理软件相结合设计网站的好处。了解dreamweaver cs3在动态网站上的应用。（2）素质要求

本课程将培养学生以下几方面的职业素质： 服务意识：能够为他人提供优质的服务；

文明法制意识：网站内容应积极健康向上，不做违法的事；

合作精神：能够与他人进行合作，具有协调工作能力和组织管理能力； 较强的自我知识及技术更新能力：快速跟踪网页制作的新技术及市场应用动态。三、教学内容结构

学生应按照《网页设计与网站建设课程设计指导书》的要求认真设计。教师应掌握好课程设计的总体进度，并组织答疑，以保证学生按时保质、保量地完成任务。学生最后所完成的《网页设计与网站建设课程设计报告》应当做到内容齐全、条理清楚、文字通畅、打印或书写规范。

（2）域名注册与建站方式选择论证（3）网站总体设计（4）网站静态页面设计（5）web数据库设计

（6）网站测试、发布与维护管理 四、教学内容与要求

网页设计概述：重点讲授网站，网页设计的概念；了解网页设计设计的相关概念；了解网页设计的语言html；掌握学习网页设计的某一种工具；理解网站和网页的关系。

网页赏析：初步了解网页赏析要求；理解网页赏析的理论要求；掌握网页突破性设计的要素；分清各类网站的设计要求和框架；理解实例分析过程。

网页规划与布局：了解网页的组织结构，掌握网页内容上的组织方法；熟悉网页设计的流程和注意事项；了解网站的规划与建设；熟悉网站设计，掌握网站与网页的区别。

网页设计创意：通过对创意思维及创意手法的讲解，辅以对优秀网页作品的分析，启发学生全面的创新思维，进而从多角度的思维中独树一帜，培养学生的个性化意识。让学生对优秀设计的创意进行解读和阐释，并分析其创新之处，鼓励学生敢于发觉新意，提 以人为本 诚信务实 勇于创新 乐于奉献

网页编程语言：了解html、css的定义、概念和作用；理解html语言中的各种文本格式、字符格式、段落设置、列表标记的作用；会用html语言总的标记设置颜色、文本格式和列表；掌握html的语法结构，掌握html语言中标记的使用方法；理解表格、框架、表单的作用。理解css样式表的作用和意义；掌握css样式表的结构；掌握在网页中添加css的方法。掌握三种添加样式信息的方法，会使用css设置网页格式和列表的格式。

（1）通过教学，使学生能够用基本法和高级法新建站点、编辑站点，掌握如何在站点中新建文件和文件夹，会预览网页。

（2）掌握表格的组成和基本操作方法；熟练掌握穿件表格、表格操作、表格编辑的方法；（3）掌握表单的基本概念和表单的各个组成元素；掌握插入表单以及表单元素的方法；会制作具有表单的网页。

（4）通过教学，掌握在动画中添加声音的操作方法以及设置动画声音的各种属性。（5）通过教学，使学生掌握导出与发布flash动画的方法，能够准确设置flash8动画作品的发布格式。

动态网页介绍：掌握静态网页和动态网页的概念；了解实现动态网页的四种技术（cgi、asp、jsp和php）的特点；掌握数据库、数据库管理系统、web数据库的概念及关系数据库的特点；理解数据库在开发动态网页中的地位；了解asp、jsp、php如何访问web数据库。

设计实例：综合运用前七章所学的知识创建和编辑一个站点，掌握主页和子页、子页之间、以及站内和站外的链接。五、教学实施

1、教学方法：本课程是一门应用型课程，涉及到以前所学知识点较多，因此在教学中应注意启发式教学并加强项目教学的直观性。

2、教学场所与设备要求：安装有 windows xp 或 windows 2000 的机房均可以进行实验，教学要求在多媒体教室进行。六、考核与评价方式

有笔试和机试两种考试形式，主要由选择题、实验操作题组成。在总成绩中，笔试成绩和上机考试成绩各占50%。

第3篇

辽宁师范大学出版社 初中信息技术八年级上册，第二单元《网站设计与制作》，活动1“创建个人网站”以及活动2中的关于部分frontpage2000的内容。

信息技术课是一门实践性很强、极富创造性、具有明显时代发展性特点的课程。而现代教育理论提倡以学生为中心，强调学生“学”的主动性，学生是信息加工的主体，教师的作用体现在组织、指导、帮助和促进学生的学习、充分发挥学生的主动性、积极性和创造性，从而使学生最有效地进行学习，达到最优的教学效果。因此本课题遵循“教师主导，学生主体”的设计理念，让学生在教师的引导下，对所学的内容进行探索、分析、研究，在实践操作中培养学生科学的态度和价值观，同时培养学生的学习兴趣。

教学对象是八年级的学生，这一阶段的学生正处在抽象逻辑思维逐步形成的过程中，但形象思维仍是获取知识的重要思维方式。而本节课中涉及到的html语言有其枯燥难懂的一面，学生在理解上存在着一定的难度，所以教师在教学设计中希望能通过学生自己的双眼、双手以及思考来发现新知识，从而减轻他们对新知识的畏惧、降低理解的难度。

初中学生活泼好动、好奇心强、求知欲旺、视野广泛，对信息技术充满兴趣，大部分学生都能熟练使用浏览器浏览网页，他们对上网和网页有着极大的兴趣。所以在本课题中教师利用学生的这种心理设计了一个趣味导入，从趣味引入学生感兴趣的网页，使学生在课堂中保持着较高的学习积极性。

本节课是新授课且是第二单元《网站设计与制作》的第一节课，教师将这节课的重心放在了“启下”上，目的是激发学生的学习兴趣和他们的求知欲，为顺利开展以后的教学活动打好基础、做好铺垫。本节课的教学内容有两个方面，一是初识html语言，二是初识frontpage2000的窗口组成。教师设计的重点并不是让学生充分理解html语言的结构，而是通过html语言能够有效地引出制作网页的软件frontpage2000，继而使学生能顺其自然产生使用frontpage2000制作网页的兴趣。

教学内容的整合：课本上将初识html语言和frontpage2000的窗口组成分在了两个活动中，考虑到信息技术课一星期一个班只有一节课，如果第一节课只讲html语言，不涉及制作网页的软件frontpage2000，会令学生感到枯燥，同时这种枯燥感很可能会维持一个星期直到下节课，这样学生对制作网页的兴趣就远不如将两个教学内容结合起来的高，也不利于今后的教学活动开展。所以教师将本节课的重心放在让学生理解html语言与frontpage2000之间的联系上。

（４）了解常用的制作网页的软件；（５）了解网站策划与定位的重要性，掌握网站的规划流程；

（７）学会设计有意义的网站主题，收集网站相关资料，画出网站的结构图。【过程与方法】

（１）趣味导入新课的内容，极大地发挥学生主体、教师主导的作用；

（２）适时引导学生产生新的问题，再通过教师的讲解与演示、对比和学生的自主学习来解决问题。

（１）强烈的求知欲激发学生的学习兴趣和学习积极性；

（２）了解信息技术的前沿知识后，学生会对信息技术课保持新鲜感和兴趣感；

（３）学生在不断实现自己主体地位的同时，也获得了新知识，更从中体会到了学习的快乐。

1、认识构成网页内容的基本元素，理解网页布局的特点；

3、学会启动frontpage2000，了解网站设计软件frontpage2000的窗口组成，理解各组成部分的功能；

4、网站主题的确立，规划网站结构图，学会创建新站点的基本方法。

1、理解html标识性语言的结构及应用html语言编写简单网页；

②打开多媒体电脑教室的教师机和学生机，保证电脑教室的广播系统工作正常；

1.情境引入： 向学生展示一组优秀网站、网页，激发学生创作自己个人网站的兴趣和欲望。学生在观看，欣赏网站时，受到激励产生想制作一个网页的冲动。在师生欣赏网页作品时复习回顾已学并已淡忘的基础知识。问题：网页的构成元素及布局？教师分析案例，与学生共同回顾文字的插入、图片的插入和设置、动画的插入和设置、表格的相关操作等相关知识。让学生在案例中回顾基础，激发灵感。并引入本节主题，自己动手制作网页。

教师向学生展示本节课要完成的网页。要求学生会模仿制作出该网页模板，并能够自己创作出新的网页模板。

2）一个网页由哪些元素组成？对照给出的网页分析网页的组成元素—标题图片，标题栏，水平线，滚动字幕，图片，文字及背景等等。

3)用photoshop 处理素材，达到给出网页中图片标题，并设计出突出自己主题的网站标题。拓展：用photoshop软件，画图软件，或flash软件设计自己需要的网页图片。4）要求学生会模仿制作出该网页模板，并能够根据自己确立的主题制作一个网页模板。学生自主完成模板仿制，并自主探究设计一个复合自己设计主题的网页模板。小组内成员可相互交流，教师巡视，随时解决学生在学习过程中遇到的问题，并注意收集有共性的问题，并适时给以学生以点拨。尤其关注一下学困生。

5）小组选出最佳模板，探究完善此模板，然后以此模板设计网页。4.评价展示：

作品完成，提交给教师机，自我评价，小组互评，选出小组最佳作品提交展示，师生共同赏析评价，挖掘作品优点，并指出改进之处。培养大家的审美能力，并挖掘大家的创新能力。

师生共同回顾这节课的基础知识与基本技能，并加强网络道德意识，注意版权。

在信息技术教学中，必须以新的教学理念和教学理论为指导，根据新的课程标准，探索适合信息技术课堂教学的教与学的新策略和新模式来挖掘学生潜能，提高学生素质。

以前我总认为信息技术课就是教会学生如何操作，课堂中总是采用“教师讲，学生听”的传统模式，是“学”跟着“教”走，只要“我说你做”就可以了。现在我尝试着做一些改进，在本课题中围绕“学生主体、教师主导”的设计理念去设计每个教学环节，积极体现学生的主体作用，努力提高学生的学习效果。

实践证明我的想法是好的，但是在实践中难免有疏忽和做的不够细的地方。比如：由于我的观察不全面，忽略了个别学生学习中的心理障碍，有些学生的畏难情绪影响到他的整个学习效果；课堂学习气氛热烈但不够和谐。这些都说明了一个问题：我仅仅注重了学生整体主体的体现，而忽略了个体。经过思考，我认为在这节课的教学设计中可以多增加个体展示的机会，特别是那些学习有困难的学生，我应该多关注他们的动态，多帮助他们。

本课的教学目标是掌握使用frontpage制作网页的基本方法；重点是掌握在网页中插入文字和图片的方法；难点在于插入表格规划网页的结构。

备课时，发现教材以一个标题，一张图片以及一篇文章的简单结构示例，如果完全依照教材进行授课，势必无法突破难点。于是设计了一个将学生前期制作的环保报刊，利用frontpage软件制成网页的环节来帮助学生突破难点。并取学生环保报刊中具典型结构的五份。制作出引导学生分析结构，规划框架的演示片备用。

课堂以自主探究的模式展开，同学们在以往的学习中已掌握了在word中插入表格、图片等方法，在frontpage中他们很顺利地完成了教材呈现的目标。基本掌握了单张网页的制作方法。

接下来就是突破难点的训练。面对演示片呈现出的任务及教材相关提示。此时，问题集中到如何插入一个布局表格来实现规划好的结构。而教材上完全没有提示学生探究frontpage “表格”与word “表格” 功能的异同。少数同学开始试着插入适合自己网页结构的框架表格，而大部分的同学则完全没有考虑结构问题，做起直接的搬移，将frontpage当成word来用。直到出现无法将图片，文字放置到设想位置时，才意识到教材中“frontpage通常用表格来安排网页中各种内容（文章、图形等）的版面位置。”这问话的含义是否明确。急着寻求解决的办法。我便让哪些意识到要先插入适当结构框架表的学生来说说他们的想法。并及时出示与学生思维一致的演示片，将探究frontpage “表格”功能的提示呈现给他们。同时利用极域教室的功能，向全体同学展示同伴的探究结果，让学生不同的思绪方式及智慧产生碰撞，相互启示，顺利突破教学难点。