从《9202工程网站》谈网站设计

刘 波
（广西基础地理信息中心 530023）

【摘　要】 以《9202工程网站》为例，介绍网站的设计过程以及在设计中需要注意的几个问题。
【关键词】 9202工程 Web网站

　　一、《9202工程网站》介绍
　　应区政府的要求，制作了《9202工程网站》。此网站采用区政府领导和工作人员易于接受的上网查询方式，在《广西综合区情地理信息系统》的基础上制作而成。网站建成后，集成在办公厅内部的政府信息网上发布，适应了目前电子政府的趋势。网站包括了广西概况、扶贫工程、广西旅游、改革开放20年的统计专题，并加挂“广西沿海滩涂资源综合开发与环境保护”等子系统；共制作网页263页，包含有图片、HTML文档、地图、声音、录象多媒体信息，形式庄重大方、生动活泼，易于浏览。下图为9202工程网页。

　　二、设计原理
　　随着Internet 技术的成熟与飞速发展，为网上用户提供信息服务的Web 网站不但在数量上迅速增长，而且在提供信息的种类方面也发生了根本的改变。最初Web 信息服务只用于网上学术交流、企业宣传、产品广告以及一些网上公告等类似于电子出版的服务；而今天许多Web 网站提供的信息不再局限于此，他们开设了网上购物、网上资料的查询以及大量的数据汇总的服务。 以上服务需要动态发布技术的支持，即Web网站接收用户输入的信息，交给事务处理器进行处理，然后把事务处理器处理的结果返回用户，此时在Web 浏览器上看到的页面是Web 服务器根据事务处理器返回的结果临时组织的动态页面（如下图）。

　　动态页面是用户向服务器发出HTTP 请求后，服务器根据用户请求临时组织页面内容。Web 浏览器通过具有用户插入或选定的文本框、菜单和复选框提出页面收集信息。当用户单击表格上的按钮时，表格中的数据便发送到Web服务器。服务器或者将数据传送至要被处理的脚本或应用程序，或者在数据库中查询数据或将数据投递到数据库中。服务器将返回结果插入到HTML 页面以响应用户。

　　三、设计过程
　　1. 确定建立Web网站的目的 在决定建立一个网站之前，要清楚几个问题：为什么要建立该网站？希望哪些人来访问？网站的近期目标和远期目标是什么？计划花多少钱和时间来管理和维护网站？在弄清楚了这些问题之后，就可以考虑网站结构的总体设计了。
　　2. 硬件组成包括：客户机、Web服务器、数据库服务器和相应的网络环境。 客户机可作为用户输入查询条件和显示查询结果的交互界面；Web服务器将介于Web浏览器与数据库服务器之间，负责用户输入信息的接收和动态网页的形成；数据库服务器是用作信息存储与数据管理；相应的网络环境使Web浏览器与Web服务器之间的信息交换成为可能。
　　3. 软件组成包括：浏览器软件、网站制作软件、服务器软件、数据库服务器软件和相应的网络软件。
浏随浏览器软件是用户唯一需要在客户机上安装的程序。目前有许多浏览器可供选择，PC机上普遍使用的有IE和Netscape。
　　网站制作软件通常使用Microsoft FrontPage98或Ulead公司的Dreamweaver，它们提供了一种所见即所得的页面设计方法，免去了逐条编写HTML语言的烦琐，并支持Form、Table、Frame、Image和直接文本编辑，同时可加入JavaScript、Java applet、VBScript和ActiveX control，大大提高了页面设计速度，获得事半功倍的效果。其他软件象Photoshop、Ulead WebRazor Pro 、ACDSee等主要起到辅助设计作用。
　　Web软件出色地将数据陈述简化并且标准化，而且Web服务器安装不同的网络操作系统时有不同的Web软件支持。IIS软件作为Microsoft 公司的Windows NT 操作系统的一部分承担着这些工作。
　　数据库服务器软件主要是数据库管理系统，用于组织和标准化数据的接收与存储。它可以是任何开放的数据库系统，例如SQL Server，Access，Sybase，Informix，以及Oracle等。
　　网络软件主要是网络操作系统，其中Windows NT是Microsoft公司推出的网络操作系统。浏览器与Web服务器之间使用TCP/IP协议进行网络通信。
　　4. 设计流程如下：

　　四、建立网站应注意的问题
　　建立一个结构清晰、下载速度快的网站并不容易，在制作过程中需要注意很多问题，现列举如下：
　　1. 利用选择列表来进行栏目导航，这样既节约了空间，又十分醒目，引导读者阅读。
　　2. 页面的布局非常重要。
　　※ 要保持风格统一。页面间要保持统一的格式，徽标和导航工具条的图形和位置在整个网站中应保持一致，这样一个统一的包装不会使用户感到困惑。
　　※ 整齐。当使用图形时，首先尽量修整图形的边界使图形更小，更精致。然后再根据需要来调整图形，放大或加工。对文本做同样的工作，使文本不要过大，并尽量使其对齐。
　　※ 使用不同大小的材质。有一个主要大图配合一些小图的页面在视觉效果上比仅有大量相同小图的页面好。
　　※ 使用表格来组织页面。HTML语言的表格（TABLE）对格式有更多的控制，它能指定字串的长度，在页面上放置边线和对齐元素等。
　　※ 要慎重使用FRAME。它能使一个网站看起来变得相当复杂，可能使一些用户不愿用FRAME。在确信非常必要时才使用FRAME，同时最好有一个非FRAME版本，让那些不喜欢或浏览器不支持FRAME的用户可以来访问。
　　3. 图片处理
　　※ 图片是Web页不可缺少的媒体形式，它除了可以提供信息（如实物照片、标题等）之外，还可以修饰页面（如题图、装饰图案，甚至是动画插图），但信道带宽是阻碍WWW应用的瓶颈。如何使有限的带宽得到合理的利用，压缩图像文件不失为一个好策略。要用数据压缩工具优化图像文件，以节省有限的信道带宽，加快网上访问速度。
　　※ JPEG 格式图像多数都是采用有损型压缩算法，所以压缩后的图像会失真，即压缩掉的信息不可恢复。而GIF 是LZW 无损压缩算法，它在缩小文件时并不丢失信息。JPEG格式只对真彩色图像有效，不适用于有清晰线条或文字的图片，GIF透明效果使图像在背景的衬托下更为美观，还可用多幅图像链接产生动画效果。
　　※ 保持图形文件小于30K。大于30K的图片或图像经常常导致用户没有耐心去等待页面的下载。为此将图做得小一些，或少用些颜色。除非用户自己想看大图。例如：有一个小图指示点击后有全图，用户将不会介意较长时间的等待下载时间。
　　※ 如果确需下载一个较慢的大图，那么最好将它们打碎再在页面里将它们拼起来。因为这样至少让用户看见在屏幕有变化，不要是一片空白。
　　※ 在可能情况下使用尽量少的颜色。图的颜色越少，文件尺寸越小，下载速度越快。
　　4. HTML文件“减肥”。如果在访问网页时花去太多的时间，就要考虑为页面减肥，利用软件将HTML文件中一些无用或者多余的Tag（标签）、字节、空格删除掉，同时又保证压缩后的HTML文件在外观上不会有任何变化，从而起到“减肥”、加快网页下载的作用，带来美感。
　　五、展望
　　随着互联网技术的发展，Web网站已成为一个部门不可缺少的网上门户，也是在地球村中相互联系的一个出入口。网络蕴育着商机，一点没错，能否捕捉到，就看这个网上家园如何布置、如何推销了。