黄聪:如何设计符合用户体验的表格(下)

4,436 次浏览 @ 2011年12月10日

接上篇,看似简单的表格真要设计好还是需要花些气力的,看看下面这些细节设计点,你是否也知道?

5.重点在于行或者列

表格是由最简单的行、列、单元格构成的,根据浏览的目的和希望突出的信息不同,行、列、单元格都可以通过一些变化进行强调,这是将信息通过表格传达出去的最为根本的使用方式。

邮箱产品就是强调行的表格设计的典范,像Gmail、Yahoo Mail、126邮箱,这些表格没有纵向的线条,用横线构架出行的视觉,数据信息均匀分布,更强调每一行内的信息连续性,不强调行与行的数据对比情况。同 时,辅助于背景线条和底色,能够很好的提升阅读的连续性和效率。

而将横向的行内信息再次扩充就成了如同淘宝商品页一样的,行区分弱化的表格形式,既满足了丰富信息的呈现,也能很快速的进行与行之间的如同价格等关键信息的对比。

像GA、百度涅槃这种强调列的表也同样广泛使用,尤其这种纵列的强化是配合表格列排序功能而使用的,数据列多时需要根据某一列数据进行排序,作为主键进行提示强化。

6.条理的对齐

表格内的信息纵向列对齐是能够很好的形成视觉引导线,符合格式塔心理学中相近原则,一般常见的是文本信息左对齐,数字左对齐,金额右对齐,同时表格最右一列右对齐,这样的表格纵向列即使没有分割线也能很好的起到分隔作用。

对比的数据如果有了明确的对齐方式,会大大提升数据的浏览效率,增加对比的效果,像下面的图中,如果数据居中对齐没有明确的边界,阅读起来就会降低效率。

 

7.表头固定提升使用

随着表格的行和列都增加,这时候用户的瞬时记忆会遭遇阈限,根据7±2的原则超过这个范围时,用户需要增加信息来帮助浏览表格内的数据,比如百度的涅槃系统提供了丰富的数据列,而如果缺少表头的说明恐怕会很快遗忘掉该列数据是什么。

表头固定的另一种用途是可以将操作和表格的信息更好的进行联系,选择了表格内的数据行就可以进行相应的操作,提升了使用效率,不用再耗时耗力的寻找操作区域。

除了表头行的固定,表格的列进行固定也经常被采用,像就是百度统计这样,第一列是时间需要进行对比,固定了第一列使得阅读起来存在一个基础。

8.减少用户心算

对于进行对比分析的数据,给出差值、总计便于用户阅读,而尽量减少用户心算或者线下处理的过程,当前很多表格都会提示升降变化或者总计值提升,信息的理解和阅读效率。

 

表格的细节需要考虑的地方不少,是一种形式需要灵活的根据实际需求来进行设计,最大程度的突出用户关注的信息,对其他信息进行弱化,同时考虑用户的行为预期给予引导和帮助才能最大化的发挥表格的优势。黄聪SEO建站交流人脉群:261240447聪崽SEO建站交流(未满)

One Response to “黄聪:如何设计符合用户体验的表格(下)”

  1. seo优化说道:

    重要的是用户体验吧

Leave a Reply