十条优秀的网站设计经验

首页

信息动态

原创排行

十条优秀的网站设计经验

编辑：Guest 发布时间：2006年10月10日 11:44:37

一个设计良好的网页应该能够被宽带网上的多媒体高档电脑或者依然使用慢速MODEM连接的低档电脑上安装的浏览器阅读。然而，很多新的网站设计者均不是非常的了解如何尽量的让这些HTML文件保持很好的兼容性。
当然，这里有太多的不确定因素影响网页最后呈现的结果。首先，计算机的显示器有不同的分辨率和显示质量，其次，运行着各种各样的操作系统，使用着不通版本的WEB浏览器，不同INTERNET连接方式和各种速度的MODEM。我们不能想当然的去武断地判定浏览者的喜好。我们还是花点时间来测试页面，这样可以让每一个访问者感到愉快。然而，遗憾的是我们没有办法为每一个访问者来优化页面，但是下面讲述的几个步骤将有助于您保证大多数访问者的浏览效果。　

1、确定受众。
　　一般的来说，绝大多数普通受众图形，插件，applets和其它有关的高级Web浏览器特性。对我们来说，页面的实用可能比漂亮更重要，对于用户来说，没有什么比页面能够快速下载更重要了，简而言之，精简你的站点，这是一条最佳的捷径。

波士顿一位图形设计者兼美术讲师说："你必须考虑什么，这一切都应该来自自于你的观众"！

为了让每个人满意，一个站点的实用比漂亮更加重要。并且首先，它必须能够快速的被用户端的较老版本的浏览器快速解释。简化你的站点，然而，那未必是最好的办法。

考虑一下站点访问者的操作系统，监视器，浏览器，和的连接类型。然后，想想理论上他们需要从你的站点获得什么？他们是想获得连接还是需要实际的内容？如果是普通的站点是否会失望，是否需要为浏览下载特别的插件。有一个窍门就是没有必要为每一个人优化你的站点，要满足每一个访问者显然不可能，你必须为访问者采取适当的技术。

2、不要依赖图形。
就站点设计而言，的确能够通过成功的图形设计招徕或者丢失访问者。并非所有的访问者可以完全看到图片，某些人为了加快存取网络的速度已经关闭了浏览器端的图形。简而言之，图形并不能正确的在客户端加载。　　然而，图形经常被用来作为导航按钮。举例来说，访问者经常按向左的箭头返回上一页，或者一个包含问号的图形可以得到更多的信息，或者按公司的标志(LOGO)会告诉用户公司的地址和电话号码。图形映射(IMAGE MAP)允许你按图像的不同区域连接到不同的地方，这个经常被用来用作站点地图，你给访问者提供站点内容指引。但是如果你仅仅通过图片来提供站点导航的话，某些访问者将不能完全或者正确的离开你的站点。

总是告诉用户你的站点需要什么样类型的技术才能正确浏览你的网站是一个非常愚笨的方法。如果访问者需要安装插件才能处理，如果你仅仅给出一个连接让访问者去下载。这个自认为非常酷的页面对用户来说根本不是什么幽默的事情，这是和用户的期待所恰恰相反的。至于为什么恰恰相反，希望你能反思一下，如果是你，你会为了浏览一个你根本不知道什么样的站点而去下载一堆你不知道的插件么？

如何解决这个矛盾呢？你可能想到的解决方法有二种：一个是单纯的文本，另外就是完全的图形方式。其实不然。如果你使用一个图形映射的方式给内容列表，可以在该页的最后使用一个纯文本方式的表格来处理，这样会好很多。如果使用图形按钮，最好还是包括简单的导航文字提示。

大多数的时候，通常我们要养成使用"ALT"标记的习惯，这样当图形未能正确显示的时候可用预备的文本替代显示。这样，用户至少可以看到关于这个图形的表述，便知道这个图形究竟意味着什么。举例来说某个图象标记的预备文本就可以这样写：　　< IMG SRC="Cat.gif" ALT="一只忧郁的猫！">

使用"ALT"标记也有另外一个好处。文字将显示在图象的上面，这样会给用户造成一个页面快说引导的感觉。

3、保持页面小巧。
这个小节我们谈论的是关于图形的处理。最好的方法是我们呼吁广大的读者保持让图形文件的尺寸尽量的小。即使是那些侥幸拥有快速Internet连接的用户，他们不会抱怨说你的站点加载速度太快。

第一个基本原则是让每一个图形文件的尺寸小于30KB。这绝对不是一个坏的建议。更"极端"的某些页面设计专家说，保持整个页面的尺寸大概在30KB, 40KB左右(也就是包含图形和文本以及其它多媒体对象之后的整个页面)才是比较合适的。并忠告我们"千万不要使用非常大的页面"。

要保持页面尺寸小巧，花些时间来处理一下图形，在保证图形质量的情况下使用尽量高的压缩比例，让图形尽量的小。

另外，让图形使用较少的色彩也是一个让图形尽量小的办法。使用单调的颜色比使用梯度的颜色要好。使用梯度颜色可以在浏览器端快速填充颜色调色板供客户端显示。此外，减少图形的色彩深度进而可以使用较少的色彩树也是可以的。

如果你需要提供较大的图象和多媒体文件，尽量不要插入页面里面，提供一个连接就可以了。这样，如果使用快速的连接点击图象就可以立刻看到，低速的连接不看图象也可以看到他最关心的内容，浏览感觉上没有什么延迟是最好的。

4、不要假设用户的显示器和分辨率大小。
一个常见的错误的是好多的网页设计师都认为访问者都有一个他们一样显示效果良好的大屏幕显示器。按照目前的状况，你可以为你的站点优化设计为标准的800×600分辨率，这是现在主流显示器的的默认显示分辨率。

搜索引擎，比如Excite，我们可以发现一些为增加大量用户访问量的好主意。举例来说，多使用表格单元格颜色填充。该页的网页设计师为该网页添加了背景色，这样用户就不会在感觉上觉得下载页面耗费的时间过多。另外，大多数的显示器只能显示256色，而不是设计师所使用的真彩上百万种颜色设置。浏览器能显示的颜色在浏览器"安全色彩范围"，即256色以内。后面我们将详细讨论这个问题。

5、小心使用插件(plug-ins)和Applets。
突出交互性或者多媒体特性的站点通常使用plug-ins和applets。Plug-ins是Web浏览器功能的扩展。浏览者如果安装了Plug-ins，他们就能够运行不同类型的文件，比如动画，视频和音频。Applets是小的程序片断或者是工具，经常用Java语言编写，可以借助诸如浏览器这样的大型程序完成一些有用的功能。

虽然plug-ins和applets能大大增强站点的交互性和多媒体性能，但是对于一些较老配置的机器来说，这无疑又是一个多余的功能。举例来说，Java applets仅能工作在32位的操作系统下，Windows 3.

虽然plug-ins和applets能大大增强站点的交互性和多媒体性能，但是对于一些较老配置的机器来说，这无疑又是一个多余的功能。举例来说，Java applets仅能工作在32位的操作系统下，Windows 3.x就行不通(虽然现在很少有人使用了)。另外，plug-ins需要花费时间下载安装，但并不是每一个用户都能熟练的完成下载后安装这样一个过程。不熟练的用户安装plug-ins的时候可能会遇到故障，不熟练的用户不需要这样的烦恼。

如果你判断你的受众可以安装plug-ins和applets，你必须要在相关的部分提示用户，下载plug-ins和applets的时间和地址，并且安装过程中需要注意哪些方面的内容。这样可以方便用户的使用。如果是非常重要的信息，建议你提供一个可用的如纯文本型的可用信息，以方便那些确实无法安装plug-ins和applets的访问者。

6、仅仅在需要的时候使用帧(FRAME)。
使用帧可以把一个浏览器分成几个不同的窗口，对于站点的结构的把握是一个不错的方法。但是，你还是必须知道，还是有人在使用不支持帧的浏览器。在你开始打算设计一个帧的时候，你该仔细的考虑考虑你是否的确真的需要。经常，你这样的需求可以通过表格来组织站点的结构。当然，有些特别特别老的浏览器的确连表格也不支持。哎，这样说来，我们似乎真的是没有办法了。

如果你必须使用帧，设法为还在使用那些古董浏览器的用户提供其它的解决办法。最坏的打算就是，如果真的没有办法解决，给这些用户一些道歉的信息，不要让他们感觉到你忽视了他们的存在。

7、不要忘记Web浏览器。
你应该知道，最终的浏览者有很多的方法可以控制网页在客户端浏览器的显示效果(包括字体大小，颜色等等)，不过从市场占有率来看，网景公司的航海家(Navigator)相比微软公司的探险家(Internet Explorer)的份额正逐渐减小。

对一个指定的站点来说，如果考虑到某些访问者不喜欢使用图形方式的导航条，测试的时候你就需要关闭图形显示。所以，在制作的时候，你就必须要考虑到大部分(不是全部，当是至少应该考虑到导航条图形)的图形必须要使用文字提示，这样即使在浏览者客户端不显示导航图片的时候还有文字给予适当的提示，这样的感觉，会好很多，至少面对无法显示图形的红叉而言，这样的文字提示就给人以友好的感觉二不至于无所适从。

事实上，微软公司出品的WEB探险家和美国Netscape公司航海家已经有越来越多的相似之处了，其实，早在一年前，他们之间的兼容已经不是一个大问题了。但是在细节上还是有区别的，某些在某个浏览器看上去的效果用另外一个浏览器看就完全不是那么一回事了。你可以理解这些差别，但是你无法支配他，不同的浏览器看上去就是不同，就象不同的人眼里的某个人各自会有不同的印象一样。你所需要的，就是知道他们存在差别，你应该尽量的去避免使用导致巨大差别的代码或者方法。　　好消息是，这二个浏览器都可以免费下载，对用户来说，完全可以尝试用二个浏览器去看看你的站点有什么不同的浏览感受，选择的权利在于浏览者，而你作为站点设计者，要做的只是去倾听浏览者可能的反馈。坏消息就是，你不能控制访问者使用什么样的浏览器，或者额外的去改变浏览器窗口的大小，设置字体类型、颜色和大小。你能作的就是当访问者不能访问某些部分的时候建议他们使用什么样的配置，怎么样看你的站点，这样他们就可以使用默认的设置或者你建议的浏览器。

8、保持苹果和PC格式兼容。
很多的页面在苹果环境中设计而浏览者使用的确是PC。对大部分页面来说，这个理由。实际上，浏览器比操作系统更多的影响站点的浏览效果。有一个需要指出的事实，在IBM兼容PC机上看到的图片似乎比苹果机上的小，而且颜色稍深。如果你的站点图形大部分在苹果机上设计，建议在发布之前，在PC机上进行预览，看是否有较大的效果差异。

苹果机和PC上显示的同样的颜色在某种程度上看上去往往有些差别。说的更精确些就是我们早前提到的关于调色板的区别在起着决定性的作用。这二个不同的平台，有216个通用的颜色，所以，网页设计师在设计的时候尽量使用这通用的216色就可以最大程度的保证这二个平台的页面色彩显示效果基本一致。

9、测试、测试、再测试！
不要为我的罗嗦而感到厌烦。为了保证在众多的浏览者浏览器里面能正确的看到我们所想表达的页面效果，所以正式发布站点之前的测试显得非常的重要，是重中之重。从你自己的电脑开始，一遍又一遍的开始测试，使用不同的浏览器，试着调整浏览器窗口的宽度和高度，关闭图形显示，试着使用不同的显示分辨率。然后，在朋友、同事甚至邻居的电脑上重复刚才作过的事情。

有专业的网页设计师建议我们将测试工作交给熟识的普通的用户去进行，因为这样才符合大多数的使用者的习惯，而且这些用户使用的浏览器版本较老，这样可以保证最终用户的浏览效果。有必要强调这一步的重要性。在办公室里面，我们经常可以看到一些似乎是作为点缀使用的古老的机器(几乎能见证电脑的发展历史)，我们不妨用作我们的测试机器，似乎更能体现这些古董机器的价值。而这些古董机器得出的测试结果，往往比我们使用的专业的设计师所有的电脑测试的效果更加客观，更加具有代表性。

10、可以通知你的访问者了。
即使我们作了上面我们要作的一切工作，你必须明白，我们还是无法保证这个精心设计的站点能让每一个访问者都有很好的显示效果。如果你在首页上明确指出浏览你的站点需要具备什么什么样的条件，你必须明白并非所有的用户都能具备你所要求的条件。你可以为这些不能满足你认为的基本条件的用户一个另外的选择，这样可以让他们知道你并没有忽视他们。你可以告诉他们如何通过电话，书信或者电子邮件的方式与你取得联系，这样也不至于让他们空手而归。

最后，经过测试、验收合格的站点才能向全世界发布。浏览者是否有兴趣浏览你的站点或者在你的站点停留很长事件已经完全摆脱你的控制了。有些用户由于使用速度过慢的调制解调器而变得烦躁不安，或者是页面无法显示图形或者，或者用户使用了他们个性化的浏览器无法正常显示站点……这些问题都将存在，一点也不用感到惊奇。我们现在所能作的，就是从客户的反馈信息当中分析和测试用户的多样性和可能性不断的进行调整。

无论如何，你已经从你的站点得到某种心理上的满足。在开始继续作这件事情以前，你可以坐下来清楚的想想你究竟是为了什么创建这个站点的。仔细的列出你的连接，并不是所有的用户都有耐心在你的站点上寻找他所关心的内容。让他们知道什么时候什么地方将提供什么，比如你准备在什么时候提供一个重要资料的下载等等。尤其重要的是，要让那些相关的宣传对象满意，因为一旦他们发现一些对他们有用的东西，他们将向他们周围的朋友、同学或者亲戚进行扩散，这样你的站点的知名度就会慢慢的打开。

恭喜你，你已经成功了一半，接下来要告诉你的就是"持之以恒，精益求精"。希望你能记住。