聊聊产品易用性设计之——如何提高易用性

本文主要介绍常见的几种提高易用性的方法,可为产品设计所借鉴。

一、Jakob Nielsen 提出的十大易用性原则

来源:站酷  作者:grovergao


(1)Visibility of system status 系统可见性原则

系统应该让用户知道发生了什么,在适当的时间内做出适当的反馈。大多数流通的翻译是针对网页的:用户在网页上的任何操作,不论是单击、滚动还是按下键盘,页面应即时给出反馈。

原文写的 feedback within reasonable time,这个 “reasonable time”也就是用户可以接受的等待时间,如果我点击这个按钮等待了2~3秒的时间还没有做出反应,那么就是难以接受的。

最常见的就是按钮状态。在计算机上浏览网页时常常会发现某些地方在光标移过去时颜色会有所改变,提示你这里可以被点击。在 iPhone 上没有光标,所以会以更浅显易懂的方式告诉你这里可以被操作,像是更立体的按钮、或是仿真实体开关的图象。

另一种常见的系统状态响应就是需要用户等一下,现在正「读取中」、「下载中」。在等待时如果没有任何提示,就会产生「自从点了这个按钮后画面就不动了,我的操作到底有没有被执行呢?不晓得要等多久…」的感受。进度条就是为了降低使用者的不耐感、告诉用户现在处理进度如何、大约还需要多少时间而存在。透过进度条,用户可以知道他的操作正在执行中,现在完成多少部份,再等多久就可以结束。

(2)Match between system and the real world 匹配系统与真实世界(环境贴切)

大多数流通的翻译是针对网页的:网页的一切表现和表述,应该尽可能贴近用户所在的环境(年龄、学历、文化、时代背景),而不要使用第二世界的语言

系统应该用用户的语言,用词,短语和用户熟悉的概念,而不是系统术语。遵循现实世界的惯例,让信息符合自然思考逻辑。

锁定网站的目标用户群,采用适合目标用户群的界面风格。

(3)User control and freedom用户的控制性和自由度(撤销重作原则)

用户经常错误地选择系统功能而且需要明确标识离开这个的“出口”,而不需要通过一个扩展的对话框。要支持撤销和重做的功能。大多数流通的翻译是针对网页的:为了避免用户的误用和误击,网页应提供撤销和重做功能。

这就要求产品不要破坏工作流。工作流是指用户在网站上所进行的操作,比如填写表单、注册用户、浏览目录、档案等,要允许用户撤销操作,如果没有提供后退或者返回的选项,用户就被逼着做他们不想做的动作,或者他们会干脆关掉浏览器来图个清净。

(4)Consistency and standards一致性和标准化(一致性原则)

用户不必怀疑是否不同的语言,不同的情景,或者不同的操作产生的结果实际上是同一件事情。遵循平台的惯例。也就是,同一用语、功能、操作保持一致。

营造一致性的品牌氛围,一致的logo,一致的按钮风格,输入框风格,搜索的位置,一致的列表符号等。

(5)Error prevention 防错原则

比出现错误信息提示更好的是更用心的设计防止这类问题发生。在用户选择动作发生之前,就要防止用户容易混淆或者错误的选择。对于网页来说:通过网页的设计、重组或特别安排,防止用户出错。

(6)Recognition rather than recall 识别比记忆好(易取原则)

尽量减少用户对操作目标的记忆负荷,动作和选项都应该是可见的。用户不必记住一个页面到另一个页面的信息。系统的使用说明应该是可见的或者是容易获取的。 好记性不如烂笔头。尽可能减少用户回忆负担,把需要记忆的内容摆上台面。

还有一种方法是提供站内搜索功能,当站点的内容量开始逐渐增多以至于用户不能很轻易的找到他想要的东西时,用户往往会想到搜索。搜索框的长度和位置也需要加一点注意,不能太小,位置最好放在右上区域,因为根据用户的浏览习惯呈现出”F“的趋势(F Pattern),提交按钮的文字最好能够明确的告诉用户,接下来将要发生的动作是搜索。

(7)Flexibility and efficiency of use使用的灵活高效(灵活高效原则)

系统可以满足有经验和无经验的用户,允许用户进行频繁的操作。 这就要求开发者的开发技巧,更加便捷灵活的代码和反馈,优化再优化。 大多数流通的翻译是针对网页的:中级用户的数量远高于初级和高级用户数。为大多数用户设计,不要低估,也不可轻视,保持灵活高效。

功能与易用性之间通常存在一个平衡,对于软件中的每个特性、功能、或能力,都必须提供一种途径让使用者调用或控制。如果用户的目标是可预测而且常用的,使用者不应该为了实现这个目标而必须做很多工作。做少量的工作、得到很多结果,才是使用者想要的。简单来说就是要思考「有多少用户」和「使用频率如何」的问题。越频繁使用的功能,需要点击的次数应该要越少。越多用户使用某功能,它就应该越明显。且要为核心情况设计,不要为「边缘」情况付出太多。

(8)Aesthetic and minimalist design 审美和简约的设计(易扫原则)

对话中不应该包含无关紧要的信息。在段落中每增加一个单位的重要信息,就意味着要减少相应的弱化一些其他信息。 大多数流通的翻译是针对网页的:互联网用户浏览网页的动作不是读,不是看,而是扫。易扫,意味着突出重点,弱化和剔除无关信息。

JaKob Nilsen通过视觉追踪发现用户的浏览很像一个F型,他们从左到用从上到下的”扫描“页面。因此网站页面要有清晰的视觉层次,页面上的文字内容适合快速扫描,减少大篇幅连续的文字,多用列表,较详细的产品参数不妨采用表格,用色块或者边框把页面内容划分成定义明确的区域。

(9)Help users recognize, diagnose, and recover from errors 帮助用户识别,诊断,并从错误中恢复(容错原则)

帮助使用者识别、诊断、并从错误中恢复,将损失降到最低。如果无法自动挽回,则提供详尽的说明文字和指导方向,而非难以理解的代码。最好能在告知使用者发生错误的同时一并提供解决方法。

错误信息应该用语言表达(不要用代码),较准确地反应问题所在,并且提出一个建设性的解决方案。大多数流通的翻译是针对网页的:帮助用户从错误中恢复,将损失降到最低。如果无法自动挽回,则提供详尽的说明文字和指导方向,而非代码,比如404。

(10)Help and documentation  帮助文档(人性化帮助原则)

如果系统不使用文档是最好的,但是有必要提供帮助和文档。任何信息应容易去搜索,专注于用户的任务,列出具体的步骤来进行。大多数流通的翻译是针对网页的:帮助性提示最好的方式是:1、无需提示;2、一次性提示;3、常驻提示;4;帮助文档。


二、WAI网络信息系统易用性规范

来源:《Web信息系统的内容易用性规范》


负责制定万维网技术规范的W3C(World Wide Web Consortium)专门建立了网络易用性计划 Web Accessibility Initiative(WAI),组织多方面专家制定了关于网络信息系统的内容、内容创建工具和用户代理的易用性规范。

WAI关于网络信息系统易用性规范的设计原则可表述为:

a,可认识:确定所有内容都能以任何人所理解的格式来呈现;

b,可操控:确定内容里的接口组件对任何人来说都可操控;

c,能导览:改进内容的方位性及导航浏览性;

d,易理解:尽可能让内容及控制接口更加容易理解;

e,够健壮:选用网页技术时,应尽可能确保网页易读;无论是当前或未来的网页浏览器、辅助技术及其他程序都将因此获益。

根据以上原则,提出了14条准则以及相应的检验点:

准则1:提供音频和视频内容的等效信息表示形式;

准则2:不能仅仅依赖于颜色,应保证在非颜色显示时,文本与图表能够被用户理解;

准则3:应用结构元素来标记文件,并通过应用样式表而不用显示元素和属性来控制显示;

准则4:自然语言的应用与表达应清晰明了,使用标记以方便对缩略语和外语进行发音和翻译处理;

准则5:创建可精致转换的表格,保证表格具有必要的标记,可被浏览器和其他用户代理转换;

准则6:保证具有新颖技术特色的网页也可被精致地转换,即使在网页中新技术不获支持或被关闭时,这些网页仍可被获取利用;

准则7:保证用户可对时间敏感性内容变化的控制,使用户可随时中止和暂停那些移动、闪烁或自动更新的对象;

准则8:保证嵌入性的用户界面可被直接获取,否则应提供一个可选择的替代方案;

准则9:独立于设备进行内容设计,充分利用那些可通过多种输入设备来启动网页元素的技术;

准则10:使用过渡性的解决方案,使辅助性技术设备和旧版本的浏览器能够正确处理操作;

准则11:使用W3C技术和准则,在无法应用W3C技术或由应用W3C技术造成无法完成精致转换时,提供一个可获取的可选择的替代内容版本;

准则12:提供上下文和定位信息;

准则13:提供清除、一致的导航机制,如导航栏、站点地图等,以提高用户在一个网站内查找所需信息的效率;

准则14:保证文件的清晰、简单。

OK,关于易用性内容的整理到此为止啦~
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 200,527评论 5 470
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,314评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 147,535评论 0 332
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,006评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,961评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,220评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,664评论 3 392
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,351评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,481评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,397评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,443评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,123评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,713评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,801评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,010评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,494评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,075评论 2 341

推荐阅读更多精彩内容