原文地址:WEB2.0 Design Style Guide
翻译整理:西米CC
3.让用户更容易找到焦点——提炼内容 精减分列
几年前,三栏站点是标准,四栏的站点也不少见。如今两栏是标准,而三栏成为了极限!
为什么少一些栏数会更好?
少即是多。少几栏看上去更简洁,更突出,并且更直接,我们将更加清晰的传递我们的消息。其实这也是中轴布局的一个副产品,因为我们不需要将屏幕填那么满了,所以还要那么多栏干什么呢?来看两个例子:
37Signals 在简洁地提供答案或状态方面总是比人先行一步。如上图,他们使用了两栏布局,这是一个有关简朴的极佳学习案例。这个方案让信息自己说话了,并且让你与信息之间能毫无阻碍的交流。
Apple在优雅地应用简朴风格方面也是一位领先者,这样的布局真的是非常非常的好。每次我去体验Apple精妙的设计时,我都更加确定这种设计哲学就是设计界的圣杯。这个标准的Apple布局准确的告诉了我们“到底我们需要多少方框、栏目、线条?”然后它将一切繁杂的东西都抛弃了,剩下了什么?简洁,却高效的交流体验。
如何选择你的栏数?
我强烈建议你不要使用超过三栏这个数目。但万事总有例外,所以我在这里列举几个使用了超过三栏却取得成功的例子,这也从某种程度上说明,所谓的设计并不是一定要遵循什么法则或规范,关键还是在于你的构思和创意,法则之外还是有很多方法能让你充分而准确的表达信息:
Derek Powazek的博客在主要位置使用了三栏布局,但是在底下却加入了四小栏。下面那些小栏目给人一种亲切随意的感觉,传达给你一种”想看什么就看什么”吧的感觉;
Popurls.com 拥有很多站外信息,比如来自digg或del.icio.us的链接。但是他在页面的主要位置仍然保持了三栏的配置。更妙的是,他在页面下方提供了一组来自Flickr的照片群。为什么放在这里很合适呢,因为当人们看到页面底部时,都是正想放松一下的时候,这样的布局让人感觉很亲切。
下面是一个失败的案例,All Things Web2.0使用了四栏布局,两列主内容和两列侧边栏:
纵观整张页面,你似乎不知道该从哪里开始浏览,因为至少在视觉上它里面没有很明显的关注点。网页中的内容在重要性上没有明显的差异,缺乏优先级暗示和指引,这在一定程度上也要归咎于那灰蒙蒙的背景色。