网页设计和制作课程教学设计和实践.docVIP

网页设计和制作课程教学设计和实践 　　摘 要：《网页设计与制作》是当前热门课程，该课程集知识和技能于一体，实践性很强。我们以一个学习任务为主线贯穿整个学习活动，精心设计教学内容和与之配套的实验教学，采取在机房上课、边讲边练的方式和案例教学法，锻炼了学生解决实际问题的能力、自主学习能力和协作学习能力。 　　关键词：网页制作　课程设计　实验教学 　　中图分类号:G434 文献标识码:A 文章编号：1673-8454（2007）09-0053-03 　　 　　网页制作类课程是近几年国内高校普遍开设的课程，也是计算机领域发展最快、应用最广泛的课程之一，该课程内容丰富、实用性强，深受学生欢迎。如何在有限的课时中使学生掌握网页设计的精髓，是教师在课程设计中最应关注的问题。笔者结合在清华大学讲授《网页设计与制作》课程的经验，探讨这一问题。 　　 　　一、课程特点 　　 　　《网页设计与制作》课程在清华大学计算机教学体系中属于应用专题系列课，是全校选修课。该课程集知识和技能于一体，实践性很强，要求学生既要学好理论知识，又要掌握操作技能，还要具有解决实际问题的能力，能将基本技能和操作综合运用到具体的项目中。该课程的教学目标是在学生已掌握的计算机知识基础上，培养学生网页制作的能力、网上信息获取和加工能力、自主学习能力和团队协作能力，课程结束时学生能自行开发一个静态网站。 　　该课程突出的矛盾是学习内容多、课时少。网页制作的知识体系非常庞杂，包括网络基础知识、网页制作技术、平面设计和动画制作等基本要素，而学校给安排的课时只有24学时，要在8周内讲完，所以在给定的学时中面面俱到是不可能的。为此，我们把课程设计为以一个学习任务（制作一个网站）为主线贯穿整个学习活动，精心设计教学内容和与之配套的实验教学，采取在机房上课、边讲边练的方式和案例教学法，取得了满意的效果。 　　 　　二、教学内容设计 　　 　　本课程定位在客户端网页制作技术，而目前客户端网页制作的技术和工具软件五花八门、层出不穷。选择合适的技术和工具软件，是课程成功的基础。我们根据对该领域的研究和多年的教学经验，结合国外大学开设同类课程的实践，设计出课程内容模块，该课程由7个模块组成：Web基础知识和案例介绍、HTML语言、CSS、使用Dreamweaver制作网页和网站管理、素材加工、网页图像处理（ＰｈｏｔｏＳｈｏｐ）和网页动画制作（Ｆｌａｓｈ）。教学内容设计的原则是： 　　（1）重视HTML的教学 　　 　　无论什么类型的网页，其基本结构都是HTML标记，所以认识、了解HTML标记的含义是非常重要的。认识HTML代码，在一些必须要修改HTML代码的情况下（如添加网页特效的Javascript代码、添加背景音乐时）就不会感到无从下手，也为动态网页的学习奠定基础。 　　（2）选择最流行的软件 　　在工具软件的选择上，我们的原则是选择最流行的，因为流行的软件一般用户多，功能强，有生命力。网页制作一般需要网页制作软件、图像处理软件和网页动画制作软件的配合使用。 　　用于网页制作的最为常用的专业级的软件是FrontPage和Dreamweaver。 [1] 这两个工具软件都提供了图形化的设计界面，FrontPage重视网页的开发效率、易学易用的引导过程，适合于网页设计的初学者；而Dreamweaver主攻的是网页高级设计市场，适合专业的制作人员使用。鉴于Dreamweaver 在网站管理和网页编辑方面的卓越表现，我们采用它作为课程用软件。 　　图像加工软件有很多，如Photoshop、PhotoImpact、CorelDRAW、Illustrator、Fireworks，PhotoDraw等。其中Photoshop是最著名、最专业的图像处理软件，适合网页图像的加工处理，所以我们采用Photoshop作为课程图像加工的软件。而PhotoImpact自带丰富的图库，提供众多“即拖即有”的现成效果和创意工具，可以方便地创建网页上常用的导航按钮、横幅等个性化的图片，还可以对图片进行优化以使其适合网页发布的需要，所以我们选用其作为素材加工的软件。 　　网页动画工具有Flash、Gif Animator、LiveMotion、ImageReady等。Flash 是矢量图形编辑和动画制作的专业软件，使用Flash制作的动画作品空间小，交互功能强，可以跨平台播放，在网页中有着广泛的应用，特别适合于制作声光效果俱佳的开场动画，所以我们选用其作为课程动画制作的软件。鉴于Gif Animator在制作动态gif 格式图片的简单易用性，我们选择其作为制作动态gif图像的软件。 　　（3） 强调 CSS 的作用 　　制作网页，除了上面提到的HTML语言和工具软件之外，还需要掌