学生网页设计方法指导

摘要：对于学生制作学科网站，除了要进行必要的Frontpage技术方面的教学，还应注意对学生进行网页设计方面的指导。只有两方面结合起来，才能确保学生做出设计新颖，创作精良的个人学科网站。从哪几方面对学生进行网页设计方法指导，本文对此进行一些探讨。

关键词：信息技术 网页设计

 

作为杭州市信息技术教学试点学校，几年来，我校一直把对学生信息技术课作品进行评价作为判定成绩的方式，即将学生制作的学科网站，作为会考成绩的依据。几年下来，涌现出了一些创意新颖、制作精美的学科网站。然而，与此同时，我也发现学生在创作的过程中，存在着不少的问题，这些问题许多时候并不是由于计算机技术造成的，而是学生缺乏基本的设计能力。我深深感到，除了Frontpage课本教学之外，还必须对学生进行网页设计方面的指导。于是，如何加强对学生在网页设计中的指导，成了一个很重要的问题。本文就网页设计中的几个问题提出自己的看法，供同行参考，望高手斧正。

 

一、主题的确立

 

主题是网页的灵魂，一个小巧别致的主题能使得一个网页显得内容充实而深入。一般地说，网页主题的选择要注意两个问题，一是切口要小，二是构思要新。

 

教学过程中，我发现绝大多数学生缺乏细化主题的意识，简单地采用一些很大的主题，这往往造成两种情况，或者是由于内容太多而无法完成，或者是内容空洞缺少具体的材料。在学生开始制作网页之前，教师一定要指导学生从小处入手。比如，在确定主题的初期，有不少学生会选择“文学”作为主题，我们就应该帮学生分析，文学包括许多许多内容，应该将它层层细化，是中国文学还是外国文学，是古典文学还是现代文学，是小说、诗词还是散文，可以是某一类作品集也可以是某个作家集，比如，最后定位在丰子恺散文上，那就集中收集、整理该系列作品及其相关资料。

 

其次，要指导学生选择有新意的主题，内容要精，定位要高，要避免选取那些到处可见，人人都会想到的题材作为主题。比如若要以文学为基本范畴，可以选择网络文学作为切口；也可以选一些同学们熟悉的，与平时的学生学习、生活有关的内容，比如选择语文教材中文言文里虚词的用法作为主题，不仅独特，易入手，而且能起到对语文知识的复习、整理、巩固的作用。这种思路可以推广到其它学科。

   

二、版面布局的设计

 

版面布局是网页的脸面。版面布局是一个设计的概念，指的是在一个限定的面积范围内合理安排、布置图像、文字的位置，把文章、信息按照轻重缓急的秩序陈列出来的同时，将页面装饰美化起来。主题确定后，接着就是确立与主题相适应的版面布局风格。版面风格是指站点的整体形象给浏览者的综合感受。我们在上网浏览时会觉得新浪是平易近人的，肯德基是生动鲜活的，联想是专业严谨的……，这些都是网站给人们留下的不同感受。

 

学生在制作网页的时候，也必定要对网页布局进行设计。在这个过程中，我觉得给学生讲一讲设计风格是很重要的，同样是画一张草图，有“设计”的意识还是没有，最后的成果是有差异的。我们可以指导学生分步进行这项工作。首先，在脑子里勾勒几中风格的草图，用一张白纸和一支铅笔或者作图软件，把最初创意画出来，以粗陋的线条勾画出创意的轮廓即可。尽可能多画几张，以供选择。然后，根据主题内容选定一个合适的作为继续创作的脚本。最后，将粗略布局精细化，具体化。（不要认为这是可有可无的一步，它往往起到事半功倍的效果。）

 

其次，在网页的制作中，常常使用表格工具来规划版面。使用表格可以方便文字、图片的定位、编辑。特别要提醒学生注意主页与其它网页之间布局的相似性，至少要做到版式、风格统一，整个网页浑然一体，不仅方便阅读与搜寻，更能给整个网站带来成熟、专业的风范。

 

三、层次结构与链接结构的建立

 

一个好的网页应该有清晰的层次结构。网页间的链接最好采用树型目录结构。网页与网页之间的链接不仅要正确，而且要使浏览者既可以方便快速的达到自己需要的页面，又可以清晰的知道自己的位置。特别要指导学生注意的是网站、文件夹及文件在名称的选取，提醒他们注意几点：第一，不要使用中文，网络无国界，使用中文文件名会影响到网页的正确链接；.第二，不要使用过长的字符；尽管服务器支持长文件名，但是太长的文件名不便于记忆；.第三要尽量使用意义明确的文件名。如图像文件要统一存放在image的文件夹里，方便管理和维护。

 

四、色彩的搭配

 

色彩是一个网页美学风格的显形特征，色彩搭配的和谐与否直接影响网页美感。学生做的网页有许多都是“绚丽多彩”的，色彩的杂乱使得网页缺乏基本的美感，导致网页的质量无形中下降。

 

在色彩的选择和搭配上，要指导学生根据自己网页的主题和风格确定下它的主色调，然后确立配色方案。 这里推荐几个色彩搭配的方法：
　　

1．用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，(说得通俗些就是将色彩变淡或则加深)，产生新的色彩，用于网页。这样的页面看起来色彩统一，有层次感。

　　

2．用两种色彩。先选定一种色彩，然后选择它的对比色。比如用蓝色和橙色来搭配，整个页面色彩丰富又不花哨。例如我指导学生观看我校外语组的网页，就是采用这两种颜色的组合，整个页面既富有美观又具有现代感。

　

3．用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。确定色彩的方法各人不同，比如可以在photoshop里按前景色方框，在跳出的拾色器窗中 选择"自定义"，然后在"色库"中选就可以了)。

   

另外还需提醒学生注意的是：不要将所有颜色都用到，尽量控制在三种色彩以内，在网页的色彩搭配上，学生常常犯这样的一个错误，希望制作一个漂亮的网页，将自己收集到的最好的图片，最满意色彩都堆砌在页面上，结果整个版面不仅没有个性和风格，而且色彩杂乱。正确的做法是，背景和前文的对比尽量要大，(绝对不要用花纹繁复的图案作背景)，以便突出主要文字内容。

 

五、技术的合理运用

   

当教师对网站制作提出技术含量的要求时，不少学生就往往把学过的所有功能全部加上去，包括从网上下载一些闪动字,动画,Java等等来体现自己的网页设计技术丰富。在这里，首先要指导学生对技术进行合理的使用。技术是为主题服务的，技术的使用价值是在于它要能更准确、更生动的体现主题的意图，达到更美观更吸引人的效果，反之，技术的添加则是画蛇添足，特别是过多的特效与动画、大而不当的图片，只会降低网页的显示速度，并使浏览者眼花缭乱等。其次，软件的进步已经使得增添效果越来越便捷,到处都有新鲜的,免费的 GIF,Java applets等供人随便下载,早使人见怪不怪。放有这些效果并不能体现出自己网页制作的技术，我们提倡学生充分发挥自己的想象力，利用所学过的Photoshop和Flash等软件进行原创，产生具有创意，个性化的作品。

 

      网页的制作，是对学生整体素质（包括自己想象力、创造力等）的一次检验。学生在网页的制作时，教师必须加以多方面的指导。只要我们把握了以上提出的几个方面，相信学生可以做出更多更精彩的好作品。

 

 

参考文献：

1．《网页设计三合一教程》黄立源 著    科学出版社

1．《网站架构与美工黄金组合》 天蓝工作室 著   人民邮电出版社

2．《网页设计与网站开发---HTML网页制作网站开发完全实战》伍梵华 著 航空工业出版社

文章来源：http://www.jiuyepx.cn/Html/jishu/wysj/3677.html