首页

什么影响了表格的可用性?

蓝蓝设计的小编

阅读瞬间发生了什么?
       当阅读行为发生时,如果能进入人脑,你会发现复杂的处理过程在瞬间发生。所以在谈论设计之前,让我们先来看看阅读表格时,人的大脑都会处理哪些任务。

    阅读标题 :用户在阅读表格时通常会简单略过行或列的表头。
    通读全篇 :用户也许会先花时间扫描全篇,了解表格的整体结构,数据分类以及复杂性。
    视觉搜索 :为了找到数据,用户会顺着一行或者一列直到发现交叉点的有用信息,当用户对表格的结构熟悉,或者上下文的表格结构相同的时候,视觉搜索会更迅速的完成。
    信息提取 :找到目标数据后,用户就从表中提取了一条基本信息。
    理解 :用户倾向用他们已有的知识去理解已从表格中获取的信息。
    确定类别和趋势 :用户会从感知层面对相似的数据进行归类并寻找变化趋势。
    比较 :用户将会比较数据,并发现规律。
    推断 :为了更深层次的理解数据变化,用户往往会推断一些结论
    解释 :用户将会从自身的知识库中提取信息,来解释数据的意义。
    回忆 :用户会需要记住表格中的一些信息,以便在将来使用这些信息。
    决策 :用户会以他们对数据含义的解释为基础,进行相关决策。

 

表格的UI交互模式指南

蓝蓝设计的小编

许多人都认同这样一个现象:表格虽然是用户界面设计中的一个重要部分,但是它们却经常会被忽视。表格应该显示让用户更易读,更易扫视,更易比较的结构化数据,但在很多情况下,表格数据却显得模糊不清。这就是很多人不喜欢表格的原因。

用户的日常工作经常使用表格,但是谁会需要让他们崩溃的东西呢。要改变这样的现状,下面给出一些使表格易用的指南。


行交替样式Alternating rows styling

这是很明显的,但是事实如此吗?看看今天的WEB应用,你就会发现很多并不适用。因此,行交替样式并不明显,这就是把他列为第一个来阐述的原因。

在数据较多的多行多列表格里用不同样式交替显示不同的行,这会提高用户区分数据的能力。可以采用背景色或者背景图片,如果采用背景色,背景颜色应该比页面颜色浅或者深一点。图像背景应该选择和符合整体配色方案的图片。也可以把背景色和背景图组合应用于表格边框。表格的header和footer部分应该易于识别,可以采用比表格行深或者浅的颜色。

 

BlinkCampaign的表格行采用了浅一点的亮绿色,header采用了稍微暗一点的绿色。

 点击查看原图

15个优秀的互联网应用表单设计

蓝蓝设计的小编

从某种意义上来说,的确如此。一个好的表格应该以易于理解,简单明了的方式传递大量的信息。真正的重点应该 放在信息上, 对表格的过度设计会抵消这种作用。从另一方面来说,巧妙的设计不仅可以使一个表格更具吸引力, 而且可以增加可读性。 

今天我们来看看提升表格功能和美观的几种方式。我们经常会在网上的价格页上看到表格的应用,因此主要以该种表 单为例。请记住这些原则可以应用到任意类型的信息列表上(不仅限于 <table> ). 

 

垂直,水平或矩阵?Vertical, Horizontal or Matrix?

一如以往,我们从最明显的地方开始。第一步是决定表格的整体结构。结构取决于呈现数据的类型和复杂性。选择 垂直的列还是水平行,通常取决于个人偏好。大致规划下表单的内容,然后决定采取哪种方法能更好地传递信息。很显然,如果信息包含多变量,那么选择矩阵来表示。下面分别以几个简单案例来开始。

垂直

点击查看原图

设计新用户引导页的一些思路

蓝蓝设计的小编

一个新的网络产品,或者一个全新的功能要想吸引用户的使用兴趣,就需要让用户在刚一接触到的时候能够快速地了解它是什么,能做些什么,并且能马上开始一些简单的操作。如果看了很久还没弄明白这些,那么很可能就彻底放弃了。

所以,设计新手用户引导,就是设计用户前一、两次使用产品时的体验,设计目标是让新手用户快速、无痛苦地成为中间用户。

漫谈互联网应用表单设计

蓝蓝设计的小编

表单可用性缘何重要?
 

The ISO 9241 standard defines website usability as the “effectiveness, efficiency and satisfaction with which specified users achieve specified goals in particular environments.” When using a website, users have a particular goal. If designed well, the website will meet that goal and align it with the goals of the organization behind the website. Standing between the user’s goal and the organization’s goals is very often a form, because, despite the advances in human-computer interaction, forms remain the predominant form of interaction for users on the Web. In fact, forms are often considered to be the last and most important stage of the journey to the completion of goals.

ISO 9241标准中对网站可用性的定义是:特定用户在特定环境下,能够快速、有效且满意地完成特定的目标。用户使用网站都是有目标的。 如果设计得好,网站不但会达到用户的目标,还会将其与自身公司的目标联系起来。介乎用户目标和公司目标之间的往往就是表单 ,因为,尽管人机交互发展迅速,表单仍然是用户与网站交互的主要方式。实际上,表单经常被认作是完成目标的最后也是最重要的一站。
 

Let’s clarify this last point by discussing the three main uses of forms. As Luke Wroblewski states in his book Web Form Design: Filling in the Blanks, every form exists for one of three main reasons: commerce, community or productivity. The following table translates each of these reasons into the user and business objectives that lie behind them:

让我们通过讨论表单的三个主要作用来阐述下最后这一点。就像Luke Wroblewski在他的《web表单设计:点石成金的艺术 》一书中说的一样,每个表单的存在必有如下三个原因之一:商务、社区或效率。下面的表单把这三个原因转化成了其背后的用户目标和公司目标:

点击查看原图

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档