阅读过Steve Krug 所著的《Don't make me think》-访客至上的的网页设计秘笈，从中学到了很多交互设计方面的知识，在这里和大家分享。

之前写过一章，“我们是如何使用Web”的，今天我们来说一下广告牌/banner设计的要点。

广告牌设计101法则

未扫描设计，不为阅读设计

如果用户们都是一览而过，那么，你需要注意以下5个重要方面，来保证他们尽可能地看到了，并理解了你的网站：

• 在每个页面建立清楚地视觉层次
• 尽量利用习惯用法
• 把页面划分成明确定义的区域
• 明显标示可以点击的地方
• 最大限度的降低干扰

建立清楚的视觉层次

让页面在瞬间明白易懂的一个好办法是确保页面上所有内容的外观—所有可视线索---清楚，而且能准确地表述页面上内容之间的关系；哪些内容相关，哪些内容是其他内容的组成部分，换句话说，每个页面都应该有清楚地视觉层次。

一个视觉层次清楚地页面有三个特点：

• 越重要的部分越突出。例如，组重要的标题要么字体更大，更粗，颜色更特别，旁边了有更多的空白，要么更接近页面的顶部—或者，以上几点的综合。

• 逻辑上相关的部分在视觉上也相关。    例如，可以把内容相近的分成一组，放在同一个标题之下，采用类似的显示样式，或者把他们全部放在一个定义明确的区域之内。

• 逻辑上包含的部分在视觉上进行嵌套。    例如，一个分类标题“名著书籍”出现在某本具体书籍书名上面，在视觉上包含书籍区域，因为该书籍属于这个标题，而且书籍的标题也要横向覆盖描述这本书的元素。          

 对于视觉层次，没有什么特别的。例如在我们阅读报纸的时候，会发现每张报纸都用突出、分组和嵌套的方式为读者提供关于报纸内容的有用信息。这张图片和这个新闻内容是一起的，因为它们位于同一个标题的覆盖范围之下。这个新闻内容最重要，因为他采用了最大的标题，最宽的栏目，并占用页面最突出的位置。

我们每天都会对视觉层次进行分解—不管是在网络上还是在报纸上，但是这种分解发生得太快了，因此我们经常只有在不能这么做 的时候才能模模糊糊地感觉到了他—也就是，当这些可视信息线索（或可视信息线索的缺乏）迫使我们思考的时候。

好的视觉层次通过预先处理页面，用一种我们能快速理解的方式对页面的内容进行组织并区分优先级，从而减少了我们的工作。

但是，如果一个页面没有清楚的视觉层次，例如，所有内容看起来都一样重要，我们会降低扫描页面的速度，寻找关键的文字和短语，然后拼凑出我们感觉重要的内容和内容的组织方。这样就增加了很多工作。

而且，和其他媒体一样，我们在网站上，也希望得到编辑的引导。没有人比网站发布者更清楚哪些内容更重要，更有价值，更流行了，一次我们为什么不帮我们把这些内容标识出来，免得给我们带来麻烦？

分解一个视觉层次上有问题的页面，例如，一个标题涵盖了不属于它的内容，就像是读一个病句一样。

即使我们通常能猜出这个句子的意思，但他还是让我们花了点时间，迫使我们不得不进行一些不必要的思考。

原址传送门：传送门

未完待续...