设计网站要建立清楚的视觉阶层。 - 北京传诚信

网站的页面设计是让人扫猫的，不是阅疆的！

建立清楚的网站视觉阶层

设计的网站页面要易于在一瞬间看清楚，就必须让页面上的每一样东西外观的视觉表现都能简洁表达，并传达出页面上每一件东西之间的关系：

哪些东西有关系，哪些东西属于其他事物的一部份。换句话说，每一页都应该要有清楚的视觉阶层。

有清楚视觉阶层的页面，会有三种不同的特征：

越重要的东西，就应该要越明显。例如，最重要的标题，若非放大，就是 要加粗、使用不同颜色、多留些空白面积，或者放在页面顶端一也可以将 上述方法组合使用。

视觉上的「巢状」阶层，显示事物属于哪一部份。

例如，小标就应该放在某本此类书籍的书名之上，在视觉上包围整个页面的内容，因为这本书是属于这类书籍。在书名底下，接着加入叙述该书的内容。

「视觉阶层」并不是什么新玩意儿。例如报纸上的每一页，都使用了凸显、分 组与巢状架构，让我们还没读进任何一个字，便能先了解关于这一页内容的 有用资讯。这张照片和这篇报导是在一起的，因为他们都放在这个标题底 下。这段报导最重要，因为标题字体最大、栏位最宽，也占用了页面上最显 著的位置。

我们每天都要解读各种视觉阶层一在网站上或者纸上，但是这个过程实在太快了，所以我们只有在无法一眼了解的情况下，才会去被迫思考。

良好的视觉阶层，可以为我们预先处理网站页面，节省我们的心力，还可以将内 容管理排序，让我们能够立即了解。

但是当页面上并没有清楚的视觉阶层一例如每一件东西看起来都一样重要， 那我们必须改用较慢的步骤，开始扫瞄页面、解读文字，并尝试以自己的方 式来判断内容的重要性与组织方式。这就费事多了。

此外，我们在网站上也希望能和其他媒体一样有编辑准则。出版商比任何人 都知道网站内容中什么东西最重要、最有价值或者最受欢迎，所以何不把这 些东西标示出来，帮我们省去麻烦？

解读视觉结构有瑕疵的页面时一例如标题下的东西并不属于同一篇文章，就 像是阅读一个没写好的句子广他扶著桌子站立，因为脚不太稳」）。

即使我们通常可以猜出这个句子的意义，但我们仍然会暂时感到疑惑，迫使我们作非必要的思考。