日志样式

网站和APP开发中的表格的设计

表格是展现数据类信息的一种经常使用方式,在网站设计或APP设计中,如何才能把表格设计好,让用户浏览时可读性强。

表格的结构一般有几种类型:垂直布局、水平布局、矩阵布局。

水平布局:邮箱是一种典型的强调行的表格设计,它弱化了列的概念,浏览信息的视觉流是从左到右,一条一条的浏览信息。这类排列方式强调信息的联贯性,合适大量信息的浏览。大多数的表格设计都属于这类类型。
而垂直布局的表格比较讲求行与行信息的对照,多数在数据统计中出现。
矩形布局的表格则是横竖都有明确的分割线,区块比较明显。适用于列信息较多的情况下,没有足够的空间用来分割信息时。

对像 CRM、数据后台类产品等­,表格的目的是为了满足用户浏览信息的需求。但是现实中的设计场景常常面临了许多情况:信息量过大,信息量过少等。同时设计师需要在表格的设计中思考怎么让表格更容易于浏览、在视觉上更合适现在的设计趋势。下面就主要从提升表格的浏览效力的角度给出设计方法。
1、不要吝啬表格的行高,给页面「喘气」的空间
适合的行高使得数据更容易于被浏览,但这不代表行高越大越利于浏览,行高的大小应当是与字体成比例的,在单行文字的情况下表格间距一般在字符大小的三倍之内。
2、对齐方式构成的引导线提升浏览效力
表格内的信息纵向列对齐是能够很好的构成视觉引导线,这样的表格即便没有分割线也能在视觉上起到很好的分割作用。
3、辨别信息获得的优先级,通过下拉表格显示过量信息
对用户浏览信息的行动方式进行分析提炼出常被阅览的信息,辨别优先级,对整体信息进行聚类排放,这样做的好处是隐藏没必要要指标,减少干扰,对用户的使用情形进行判断从而根据区别的情形下提供相应的信息。
4、信息卡片化
在信息量较少或特别多的情况下可以尽可能不用表格,用卡片的情势来展现信息,将信息以组的概念显现,单独卡片内的内容可看作一个小组根据视觉的优先级进行排列,不受外部排列方式的影响,组内的信息关系更紧密。卡片与卡片间又构成一个整体,不影响组与组之间的联系。

 


来源:https://www.weimawl.com/trends/479.html
声明:欢迎分享本文,转载请保留出处!