访客至上的网页设计秘笈

核心提示：现在网页设计师除了把页面做的漂亮以外，越来越注重“用户体验”，就是要做“别让用户思考”的网页，使网站真正做到“可用性”。望望结合几年的工作经验，粗谈这方面的一些问题，和大家共勉！

现在网页设计师除了把页面做的漂亮以外，越来越注重“用户体验”，就是要做“别让用户思考”的网页，使网站真正做到“可用性”。望望结合几年的工作经验，粗谈这方面的一些问题，和大家共勉！

一、人们如何浏览网页

首先本书说明了上网的人是如何浏览网页的，这似乎跟我们想象有很大的差距，因为我们觉得“用户会盯着每个网页，仔细阅读我们精心制作的文字，领会我们页面的组织方式”，事实上大部分时间用户看网页就象“高速公路看广告牌一样”，没时间仔细阅读，当然也不会用心思考。因而，我们必须为“扫描”而设计。做到这点须注意以下几点：

1、尽量符合用户习惯的设计，让人接受陌生的东西需要代价，除非我们觉得这个代价是必须的。

2、在页面把越重要的东西越突出，建立清楚的视觉层次。

3、可以点击的地方必须突出，让人明显知道可以点击。

4、把页面划分成明确定义的区域

5、省略多余的文字

二、关于导航的设计

导航显然是网站最重要的部分，“如果在网站上找不到方向，人们就不会使用你的网站”。现在WEB导航的习惯用法基本形成了，虽然还会继续演化下去，但基本元素以产生：网站LOGO、网站栏目、返回主页、搜索、实用工具或帮助。

网站LOGO，通常是页面左上角，出现在页面可视层级的首要位置，可以采取两种方式：让它成为本页最显眼的内容，或者让它涵盖页面所有其他元素，当然网站LOGO设计的好坏对人产生心理影响就不用说了。

网站栏目，也称导航条，站点层级结构的最顶层。导航条很多时候可以包容二级导航（下拉菜单的方式）。很多时候标签的设计是导航采用的很好表现方式，Amazon.com几乎把它发展到完美的状态。用标签的方式设计导航时要注意几点：

1、进入网站时，有一个标签已经选中；

2、正确绘制，激活的标签页要位于其他标签页之前；

3、颜色区分，可以让每个栏目使用一种不用的标签颜色，并把这种颜色用在页面其他导航元素上，让它们浑然一体；

搜索功能，如果有提供搜索功能的网站，要记住一个简单的公式：一个输入框、一个按钮、还有“Search”（搜索）两个字，不要弄的太复杂。比如把“搜索”换成“查找”、“快速查找”、“快速搜索”、“关键字搜索”都会让用户产生思考。如果必须为搜索框提供选项（缩小搜索范围）一定要三思，谨慎提供选项，以便以何种方式提供最为合理，还有就是要保证这些选项的确有用，否则会挫伤用户心理。

值得注意的是，很多网站到了二级页面以下，导航便会变了支离破碎，随意发挥。这个问题非常普遍，以至于很难找到良好的三级导航的例子。事实上，用户在底层页面上花的时间通常和花在顶层页面上的时间相同。除非我们一开始就自顶向下进行导航设计，否则以后很难添加，也很难保持一致性。这就意味着我们在讨论主页的颜色方案之前，拥有显示网站所有潜在级别的导航的DEMO设计非常重要。要做到这点，必须设计师和相关策划人员紧密结合，设计师必须提前知道整个站的概貌和细节内容。

有一点，设计师常常忽略，就是记得为每个页面加个名称。好像每个拐角处有一个路牌一样，随时让驾驶者知道在哪里，无需思考。页面的名称应该出现在涵盖该页内容的位置，要引人注目，在大多数情况下，它应该是该页面最大的文字。

总之，一个拥有良好导航系统的网站，一眼就能告诉用户这些信息：

这是什么网站？（网站LOGO）

我在哪个网页上？（网页名称）

这个站主要栏目有哪些？（导航栏目清单）

在这个层次上我有哪些选择？（页面导航）

我在导航系统的什么位置？（页面里的“你在这里”的指示符号）

我怎么搜索？

三、关于主页设计

首先要承认，主页不由我们控制。因为每个人都有个一个看法，如果要使每个人都满意，那么就算最优秀的主页设计也无法达到。因此设计主页时不可避免地要做一些折衷。但有一件事情不要忘记——传达整体形象，即一眼可以让人感受到这个站是干什么的。越快越好，越清楚越好。所以当浏览者进入主页时，我们好不费力（几秒钟让人了解）地告诉他四个问题：

这是什么网站？

网站上有些什么？

你能在这里做什么？

为什么你在这里，而不是在其别地方？

那么如何传达这些信息呢：

1、口号，即靠近网站LOGO的地方。一条精炼、个性、生动的口号可以让人立即联想网站的内容。但也有例外，如果某个公司的品牌已达到家喻户晓的地步，可以省略口号。

2、欢迎广告，即对网站的简要描述，在主页首要的位置显示，不需要滚动屏幕就能看到。

3、应从哪里开始？当进入一个新站后，浏览者快速扫描主页之后，应该明白无误地知道：

如果想搜索，可以从这里开始。

如果想扫描，可以从这里开始。

如果想扫描本站最精彩的内容，可以从这里开始。

在设计主页时，注意几个问题：

主页的导航可以与下级的导航有点不同，但必须要有内容和视觉上的一致。

可以不用下拉框就不用，因为那是隐藏的信息。