谈主题网站的设计要点

摘要：网页设计与网站建设是中职计算机专业的一门必修课程，如何让学生更好地掌握网页与网站的设计方法，是教师在教授本课程时要思考的问题。本文从教学实践出发，探讨讲授主题网站制作的几点做法。

关键词：中职；主题网站；设计要点

中图分类号：G712文献标识码：A文章编号：1005-1422（2016）02-0077-02

收稿日期：2015-12-25

作者简介：林海燕（1981-），女，惠州工程技术学校计算机专业讲师。主要研究方向：计算机教育教学与研究。（广东 惠州/516001）

目前社会上的各行各业已经离不开互联网了，各种主题、风格各异的网站比比皆是，每天上各大网站了解世界新闻已经成为人们日常生活中不可缺少的部分。但让学生设计一个主题网站，却会让许多学生犯难。本文根据笔者多年的教学实践，总结出学生设计主题网站应该要做的准备功夫。

一、确定网站主题

布置学生制作主题网站，学生往往很茫然，很多学生会不停地问“我应该如何去制作主题网站？”“怎么找素材？”“怎样布局” ……总之，学生会有很多的问题需要解答。再加上目前的中职生基础比较薄弱，很多网站的设计都不知如何下手。因此，教师在向学生布置制作主题网站时，首先要学生清楚建立网站的目的是什么？要让学生明白制作的网站是个人的还是企业的，是商业的还是公益的？定义网站主题，要引导学生遵循以下原则：

1.定义主题要小而精。定位要小，内容要精。例如，要设计一个诗歌网站，如果把中国从古到今所有的诗歌分类都做进网站，对于初学者来说，就显得有点力不从心，但如果只是选择其中一部分，比如唐诗来做成网站，这样定位就小很多，内容也精致很多，对于学生来说这样反而更能做出一个优秀的网站来。

2.选择自己擅长的内容。做网站好比写文章，有人擅长写小说，有人擅长写散文，关键是要选择自己擅长的内容，引导学生根据自己的兴趣以及平时关注的事情去创作，这样才容易做出优秀的网站作品。

3.根据网站主题，定好一个好名称。网站名称就好比人的名字一样，有特色，容易记住；或者起一个具备某一方面涵义的名称，对于网站的形象和宣传推广来说，都是很有帮助的。

二、制定网站模块

确定网站主题后，就要思考该网站由哪些模块组成，绘制网站的模块结构图。例如，现在要设计一个宣传惠州西湖的网站，可以设计由以下6个模块组成：西湖新闻、西湖美景、西湖美食、西湖地图、西湖历史、联系方式。这样“惠州西湖”网站由1个主页和6个二级页面组成，二级页面下再分若干三级子页，在绘制模块结构图时，至少要画到二级页面。

有了模块结构图，就可以根据各个模块内容去收集相应的素材和资源，但素材是多种多样的，为方便管理以及在使用时进行调用，教师要引导学生根据模块结构图画出站点的文件结构图，将各种素材文件分别存到指定的文件夹里，根据“惠州西湖”网站里划分的模块分别创建“西湖新闻”“西湖美景”“西湖美食”“西湖地图”“西湖历史”“联系我们”等6个文件夹用来存放各自模块的素材以及网页文件。

三、处理网站素材

确定网站主题后，要想让自己的网站有血有肉，能够吸引用户浏览，就要围绕网站主题搜集所需要的资料，常言道：“巧妇难为无米之炊”。要让自己的网站避免无“米”可炊的境地，就要尽可能多地搜集材料，材料搜集得越多，以后制作网站内容就越详实、越容易。材料既可以从图书、报纸、光盘、多媒体上得来，也可以从互联网上搜集，但收集来的素材，并不是都符合网页制作的要求，因此，对搜集到的材料要去粗取精，去伪存真。在对素材进行处理时，可以参考以下步骤：

1.要对素材进行归类。对于刚搜集到素材，肯定是五花八门、各种各样的都有，要依据网站模块的不同，把相对应的素材存放到不同的模块文件夹中，并且要对素材进行分类，这样使用起来才会更方便。

2.要对素材进行恰当的处理。对于搜集到的素材，可能只是某一方面的内容，而我们却需要它同时表达其他信息。例如，一张图片，它只是单一的显示图画，没有文字，而网页的使用要求是要图文并茂，这时就需要用到其他的软件对图片进行处理，例如Photoshop，在Photoshop中就能对图片处理成图文并茂的效果；同样其他动画制作软件，影片处理软件等都可以对相应的素材进行处理。

四、设计网站网页布局

总的来说，整个网站的各个网页应该在布局、色彩、字体上保持一定的格调，太凌乱会影响整个网站的美观性。开始设计网页时，网页就像是你面前的白纸，你可以在纸上画上你想画的，写上你想写的，但由于人的视觉是有层次的，而且大部分人的阅读习惯是从左到右，由上而下，所以你要考虑怎样画，怎样写才能吸引人来欣赏你的作品。不打草稿，直接设计网页，边设计边添加内容的方法，对“高手”来说都是难以设计出优秀的网页的，所以在真正上机设计网页之前，笔者都要求学生先画好布局草图，可以在纸上画出，也可以利用软件绘制。利用Photoshop这样的图形图像处理软件可以方便地使用颜色，使用图形，并且可以利用层的功能设计出用纸张无法实现的布局图，但这需要一定的图形图像应用基础，对学生来说有难度。因此，笔者觉得让学生在纸上画出页面的布局草图更加切合学生的实际，在进行布局设计时，应引导学生做到以下几点：

1.合理应用布局技术，网页布局技术主要有三种：层叠样式表（CSS）、表格布局、框架布局，虽然CSS是一个好的布局方法，但对于初学者来说CSS显得有点复杂，所以笔者没有要求学生使用。表格布局已成为制作网页的标准，随便浏览一个网站，它们大都是用表格布局的。表格布局的优势在于它既能对不同元素进行单独处理，又不用担心元素之间互相干扰。单一的框架布局也是比较少的，它一般和表格一起布局，但框架也有其优点，可以对框架内各个子框架进行单独操作。

2.对网站主页的布局要认真细心设计，对网站的标志、导航条等能标识网站的元素放在突出的位置，然后再对其它元素进行细化和调整。

3.对具有相同的二级页面、三级页面也要画好相应的草图。为保持协调性相同类型的元素应采用相同效果，比如说标题字都采用阴影效果，那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的。

4.对设计好的页面进行装饰，特别是字体设置和颜色设置的细化工作。因为页面的字体与色彩设置得好，可以让网页锦上添花，令人赏心悦目。

以上是笔者在教授网站建设课程中指导学生制作主题网站的要点，实践证明依据以上方法学生在制作主题网站时积极性比较高，并且比较有条理地去准备网站制作所需资料，制作出的网站内容也比较丰富多彩，培养了学生学习网页网站制作的兴趣，提高了教学效率。

参考文献：

[1]李远.网页制作——Dreamweaver实用教程[M].北京：机制工业出版社，2005.

[2]前沿文化 编著.网页设计与网站建设[M].北京：科学出版社，2012.

责任编辑 何丽华