网站可用性设计中 不容忽略的30个基础概念

标签: 产品设计 可用性设计 设计思想 | 发表时间:2011-10-13 13:34 | 作者:P迪 马克叔叔
出处:http://www.alibuybuy.com

你不必在每件事情上取得别人的同意。作为一个专业的Web开发人,你是你访客爱好和需求的倡导者;你必须坚持你对良好的用户体验的理解,确保在复杂的网站架构下你的访客仍可能找到他们的路径。这意味着在与用户和同事讨论时,你必须能够坚持你的立场,有效地传达自己的想法。事实上,你的工作就是妥协处理错误的思想和误导的概念,而不是盲从它们。

在这种境况下,没有任何东西可以帮助你,除了和你工作中根本问题相关的深刻知识。但是,即使你知道这些知识,重要的是你还要知道如何称呼这些概念,如何在讨论中用到它们。此外,准备一些你可能需要的准确术语在手边作为论据,对你的讨论也是有帮助的。

在这篇文章,我们陈述了30个通常被遗忘、忽略和误解的重要的可用性问题、术语、规则和原则。可读性(readability)和易读性(legibility)有什么区别?究竟80/20和帕累托原则是什么意思?扫雷与满意度是什么意思?逐步强化和优雅降级又是什么?你都可以找到答案。

一、可用性:规则和原则

7±2 原则

由于人类大脑处理信息的能力有限,它会将复杂信息划分成块和小的单元。根据乔治 A .米勒(George A. Miller)的研究,人类短期记忆一般一次只能记住5-9个事物。这一事实经常被用来作为限制导航菜单选项到7个的论据;然而关于神奇的“7,加2或者减2”还是引起了激烈的讨论。因此目前还不清楚是否7±2原则能、可能或应该应用到web中。米勒的研究。

2秒原则

一个松散的原则,即用户没有必要对某些系统响应等待2秒以上的时间,比如应用程序转换和开始的响应时间。选择2秒有点武断,但确是一个合理的数量级。可靠的原则就是:用户等待时间越少,用户体验越好。[可用性优先]

3次点击原则

根据这个原则,如果用户在3次点击中无法找到信息和完成网站功能时,用户就会停止使用这个网站。换句话说,这个原则强调明确的导航,逻辑架构和后续站点的层次结构。在大多数情况下,点击的次数是无关紧要的;真正重要的是,游客总是能知道他们现在在哪,他们去过哪,他们接着将会去哪。如果用户感觉他们对该系统如何运作有个充分的了解的话,甚至10次点击,用户都会觉得OK。

80/20原则(帕累托原则)

帕累托原则(也被称为重要少数法则和因素稀疏原则)指出,80%的效应来自20%的原因。这是商业中的基本经验法则(“80%的销售额来自20%的顾客”),但也可以应用于设计和可用性。举例来说,我们可以通过确定那些贡献80%利润的20 %的用户、客户、活动、产品或程序,并最大限度地注意对他们适用,来显著提高效应

8个接口设计的金科玉律

作为接口设计研究的成果, Ben Shneiderman提出并收集了一些从经验中启发而来,适用于大多数交互系统的原则。这些原则适用于用户接口设计,也适用于网页设计。

1. 争取保持一致性

2. 为老用户提供可用的快捷方式

3. 提供有益的反馈

4. 设计结束功能的对话框

5. 提供简单的错误处理

6. 允许简单的逆转功能

7. 提供控制感。支持内部控制点

8. 减少短期记忆

费茨定律

由保罗费茨(Paul Fitts)发表于1954年,费茨定律模拟了人类活动,以目标距离和目标规模大小为函数,预测了迅速移动到目标区所需时间。该法通常应用到鼠标的移动,访客就必须从A点移动到B点。例如,这个规则对于如何放置内容区域,以更实用的方式,最大化内容可及性和提高内容点击率,是非常重要的。

倒金字塔

倒金字塔是一种在文章开头表达总结文字的写作风格。这种方式使用了新闻业中著名的“瀑布效应”,新闻作者试图让他们的读者即时知道他们的报道的主题。文章以总结开头,接着是关键点,最后那些次要的细节,如背景资料。由于网络用户需要即时的满足,这种倒金字塔写作风格,对于网络写作和更好的用户体验是非常重要的。就像尼尔森的支持

满意

网络用户不喜欢用最佳方式找到他们寻找的信息。他们对最合理和最健全的解决问题方案不感兴趣。相反,他们永远扫描他们认为“足够好”的quick’n'dirty解决方案。在网络中,这种方式准确地描述了用户的满意:用户使用一个“足够好”的方案解决问题——即时在长远看来一些替代方案能够更好地满足他们的要求。

二、可用性背后的心理学

婴儿鸭综合症

婴儿鸭综合症描述了游客倾向忠于他们记住的最初设计,并且通过与最初设计的相似度来判断其他的设计。其结果是,用户通常倾向于那些与他们记住的最初设计相类似的设计,不喜欢陌生的系统。这些可用性问题是很多系统重新设计时存在的:用户,习惯了以前的设计,对新的网站架构会感到不舒服,他们必须找到自己的方式去使用网站。

无视广告

网络用户具有忽视一切看起来像广告的东西,有趣的是,他们非常擅于这。虽然广告是被注意到了,但几乎一直是被忽略的。由于用户已经为网站上不同的任务构建了相关联的图式,在网站上搜索特定的信息时,他们只将注意力集中在网页的部分区域,就是那些他们认为可能是相关信息的地方,也就是,小文本和超链接。在这个例子中,大的色彩缤纷的地方或动画横幅广告和其他的图形是被忽略的。

banner-blindness-examples.jpg

[来源:无视广告 一些发现和一些新发现]

扣人心弦效应(蔡加尼克效应)

人类无法忍受不确定性。我们倾向于对感兴趣的、未回答的问题尽快找到答案。扣人心弦效应就是基于这一事实的;扣人心弦的电影,文章和情节总是有出其不意的结果,往往总是以一个突然的震惊启示或者困难的局面离开。这种效应经常用在广告上:广告主往往通过要求游客解答刺激的问题,来迫使他们阅读广告,点击横幅广告或者跟进一个链接。

扣人心弦效应由布鲁玛 W. 蔡加尼克(Bluma W.Zeigarnik)在1927年发现,这个效应在读者间建立了情感联系,在营销学中极其有影响力。游客们可以更好地记住是什么广告,甚至是最小的细节都能记得更清晰确切。在web写作中,扣人心弦效应也被用来吸引游客进入网站。(如“抓取我们的RSS-Feed,以确保您不会错过文章的第二部分!”)。

视知觉的格式塔原则

这些原则是人机交互设计心理方面的基本原则。

接近法则认为,当我们知觉物体归类时时,易于把相近的物体归于一组。

MTV音乐颁奖的接近法则的真实例子.

相似法则指当内容元素彼此相似的时候我们会感知它们为一组。

Prägnanz法则(图像-背景)指在知觉某个的视野时,一些物体(图像)看起来突显了出来,视野中的其他东西则消退到背景中。

苹果机的标志可以被看作是一个正规笑脸和一个侧面欢喜的脸庞(看着计算机屏幕)

对称性法则指我们在知觉物体时倾向于把物体知觉为一个中心周边对称的形状。

连贯性法则指我们倾向于知觉联贯或连续流动的形式,而不是断裂或都不连续的形式,事实上它们并不连贯。

我们知觉到字母’I',’B',和’M',虽然我们事实上看到的形状,只有几行不同长度的白色空格彼此空悬。

自我参照效应

自我参照效应在网络写作中尤其重要,可以显著改善作者和读者之间的沟通。与我们个人观念相联系的事物要比那些和我们没有直接联系的事物记得更清楚。例如,阅读一篇文章后,用户能更好地记得他们个人经验中相关的人物,故事或事实。在可用性中自我参照效应通常被用在网络写作的表达和网站内容陈述。

三、可用性术语表: 术语和概念

眼球追踪

眼球追踪是测量我们凝视的点(我们看着的地方)或者相对于头部来说眼睛移动的过程。眼球追踪监测记录眼球每次的运动,并在网站最活跃的区域高光显示。眼球追踪研究可以帮助估计浏览网站的用户是否舒适地使用网站,以及他们理解网站背后的架构和系统有多快。在最近的眼球追踪研究Eyetrack07中,你可以找到一些有趣的可用性结果。

折叠位置(Fold)

折叠位置是指一个网站在屏幕上可见区域的最下方位置。当然折叠的位置也取决于你访客的屏幕分辨率。网页可见区域(也称为screenful)是指网页上不需要拉动滚动条就能看到的区域。既然折叠位置是不需要滚动就能看到,它常常被视为可能可以保证最高广告点击率和利润的区域。然而,折叠位置并没有那么重要。[Usability.gov]

中心凹视(中心凹区)

中央窝,人类眼睛的一部分,负责敏锐的中央视力,对于人类在阅读、看电视或电影、驾驶以及其他任何需要高度注意视觉细节的活动中,是非常必要的。中央窝是你的眼睛在瞄准时的一块小范围空间,它是你可以感知最高级别细节的唯一地方。中心凹区相当于两度视野或者放在你眼前的两个缩略图大小的紧密区域。这是你为游客传递最重要信息的地方。

中心凹视是非常重要的,因为在这个宽屏区域外你的访客如何看你的网页变化非常大。在这部分区域内,是你的视线注意力最大的唯一区域——只有在这里没有眼睛扫描是必要的。

注释

注释是一个自动的行为,它在链接链向的地方和用户一旦点击会链向的地方提供提示和摘要信息。提示可通过链接的标题特征来提供。从可用性的角度来看,用户希望有充分控制一切正在发生在网站上的事情的权利;清晰和准确的内外部链接解释,合理的连接源头标签,都可以提高一个网站的可用性。

优雅降级(容错系统)

优雅降级是指一个网站即使在它的部件(部分或完全)已经无法显示或者无效的情况下还能展示内容和基本的功能的这种能力。在实践中这意味着网站在每一个可能“过失”的情况下显示内容,可在用户可能的每种配置下(浏览器、插件、连接、操作系统等等)被使用。为“骨灰级用户”提供的仍然是丰富的、增强的页面版本。例如,典型地为多媒体内容提供可替代的显示,以确保在图片无法显示的时候内容仍然可以感知。[维基百科:容错系统]

粒度

粒度是指一个大的、复杂的数据集或信息分成何种程度的更小的单位。

热区

热区是网站可点击的区域,一旦被点击时会改变它们的形式或者/和外观、这是典型的:当链接或者任何其他网站元素被点击时的焦点效应。

Smashingmagazine.com上的热区和注释

易读性(Legibility)

易读性是指文章在视觉上是否明确。

扫雷

扫雷是指那些要确定网站链接的用户与网站的交互大多数情况下。在大多数情况下,扫雷是可用性问题中一个明确的警报信号。通常扫雷涉及用户在网页上快速移动光标或者指针,注视光标或指针在哪里有显示链接的变化。[Usability.gov]

肉之谜导航系统(MMN)

网络中的肉之谜导航描述了那种用户要想发现导航链接的目的点或者确定链接在哪里极其困难的设计。

物理一致性

这个概念描述了网站外观的一致性,-如logos的位置、导航、图形元素和版式的使用。物理一致性对于更好的方向和有效的网站导航是至关重要的。

逐步强化(PE)

逐步强化是一个设计战略,网站是以多层次的方式创建的——从适合所有浏览器的最基本的功能,再到更多的适合现行浏览器的加强的功能。逐步强化的主要优势在于它的“普遍可用性”——比如,事实上,它允许使用任何浏览器或者网络链接工具的人访问网站的基本内容和功能,同时它也提供使用更好网络带宽和更先进浏览器软件的用户更强版本的网页。[维基百科]

可读性

可读性描述了基于复杂句子和困难词汇的文字的可理解的程度。可读性的指标通常可以划分可用性层级,通过一些人轻易理解一篇阅读文章所需的年龄和级别来定。可读性不是易读性。[可用性的术语]

用户为中心的设计(UCD)

用户为中心的设计是这样一种设计理念,用户需求、偏好和行为决定了网站的基础,就是网站架构、导航和获取信息的方式。UCD被视为现代网络应用的标准方式,尤其是由于用户创造内容的兴起。在web2.0游客必须积极参与,因此需要最佳化他们需求的条件。

警惕(持续关注)

警惕是在长时间单调的任务中仍能持续关注的能力,比如校队文章查找拼写错误,提醒约会,自行修改文字处理机文档等。在现代网络应用中警惕的任务主要体现在后台、自动化和提供系统的可用性。

走来即用的设计

一个走来即用的设计是不言自明和直观的,所以第一次和一次性用户可以有效的使用它,而不需要实现介绍或培训。

线框图

线框图是一个网站基本的结构——骨架——描述了一个网站的思想、概念和结构。线框图可以被设计成介绍陈述,用来向股份持有者解释网站是如何设计的,提供了什么功能,用户是如何完成他们的任务的。线框图通常不会有任何视觉元素,或者一个完整的页面布局;他们往往是设计者画在纸上的初稿和草图。

[来源:天极网] [作者:译言 shelafly]


© 推荐 for 互联网的那点事, 2011. | Permalink | No comment | Add to del.icio.us
Post tags: ,

你可能也喜欢:

Dreamweaver CS4 官方中文精简版 (Adobe CS4系列网页设计制作软件) (@iplaysoft)

有使命感的设计–《设计中的设计》 (@70man)

移动产品设计之设计

可用性设计还是交互设计:谁该做什么

手机页面浏览可用性研究
无觅

Feed enhanced by Better Feed from Ozh

相关 [网站 可用性 设计] 推荐:

网站可用性设计中 不容忽略的30个基础概念

- 马克叔叔 - 互联网的那点事
你不必在每件事情上取得别人的同意. 作为一个专业的Web开发人,你是你访客爱好和需求的倡导者;你必须坚持你对良好的用户体验的理解,确保在复杂的网站架构下你的访客仍可能找到他们的路径. 这意味着在与用户和同事讨论时,你必须能够坚持你的立场,有效地传达自己的想法. 事实上,你的工作就是妥协处理错误的思想和误导的概念,而不是盲从它们.

IBM经验总结:网站设计中不可忽视的可用性原则

- - 人人都是产品经理
打造非凡的交互体验,设计一个可用性强的网站,对任何一个设计者来说都不失为一个雄心勃勃的目标. 为了使我们的网站更加接近用户的预期,这是一个缓 慢的过程,需要技巧和一系列细节性工作及一点点运气,如何让用户方便、快速地找到自己需要的服务,并用最简单的操作方法来完成操作,需要更加注重细节,细 节就是您的用户会反复留意的东西,比如友好的界面、清晰的导航、完善的帮助系统、合理的信息架构、出色的视觉设计、优良的网站性能等.

首页设计的可用性和PET

- BEAsThAnG - 所有文章 - UCD大社区
网站的首页是一个让人头疼的东西. 有时它看起来很简单:首页就是网站内容的整合,一个产品经理随便从网站里拿点东西出来,就能堆出一个看上去靠谱的首页. 也正因此,它往往非常麻烦:很多人都可以发表自己的见解,而这时交互设计师的一些手段(比如流程图、概念图等),在面对首页设计时也难派上用场,以致最终陷入到无尽的争执中.

学习笔记:确保网站的可用性

- - CSDN博客推荐文章
  网站的高可用架构设计的主要目的就是保证服务器硬件故障时服务依然可用、数据依然保存并能够被访问.   实现上述高可用架构的主要手段是数据和服务的冗余备份及失效转移.   典型的分层模型是三层,即应用层、服务层、数据层;各层之间具有相对独立性,应用层主要负责具体页面逻辑处理;服务层负责提供可复用的服务;数据层负责数据的存储于访问.

网站首页的设计

- - 标点符
网站首页的设计是一件非常让人头痛的事. 虽然她看上去很简单:产品经路随便从网站里拿点东西出来,堆出一个看上去靠谱的页面. 也正因此,它往往非常麻烦:很多人都可以发表自己的见解,以致最终陷入到无尽的争执中. 首页的设计相对于其他页面要难的原因是,其他页面更多的是解决用户“能做”的问题,而首页的更多要解决用户“想做”的问题.

可用性设计建议——《点石成金》读书笔记(上)

- 俊客 - 所有文章 - UCD大社区
阅读评分:4.5分(满分5分). 短小精悍,在用户行为、导航设计、主页设计、可用性测试等方面,作者都提出了观点和可行的建议,适合于互联网产品/Web设计人员和前端开发人员. 两小时,你能了解到的真的是最初级最初级的内容,这本书只管扫盲,不管精进. 结合项目读,边看边试,会有更大的收获. Krug可用性第一定律:别让我思考.

可用性测试中的任务设计方法

- 嘉慧 - 网易用户体验设计中心博客
可用性是用来衡量产品质量的重要指标,从用户角度来判断产品的有效性、学习性、记忆性、使用效率、容错程度和令人满意的程度. 可用性测试是在迭代设计中不断获得用户反馈,根据用户反馈不断优化产品设计的一种方法. 其目的是是建立评价标准,尽可能多的发现可用性问题,并指导产品界面的设计和改进,尽可能地提高产品的可用性质量.

最小化可用性设计(Minimum Usable Design)

- - 所有文章 - UCD大社区
似乎是蛮久没有这样周末独自在家安静的做做博客了. 生活终归需要张力,一周一周的忙碌,到了周末哪怕会寂静的有些无聊,感觉上也蛮有趣的. 今天这篇小短文有点儿意思,英文原文一遍读下来觉得没有什么不显而易见的东西;翻译了一遍,然后回过头又看一遍原文以及评论当中的观点,才尝出一些味道. 就当作引子吧,有兴趣的朋友不妨再去看看原文及评论.

增强应用“可用性”的10条设计原则

- - 酷勤网-挖经验 [expanded by feedex.net]
 来源:CocoaChina移动观察   2011-12-25. 众所周知,如果开发者想发布一款iOS应用,必须提交苹果应用商店审查. 苹果可能以各种各样的理由驳回你的申请,所幸苹果也把审查的规矩讲很清楚. 通过审查的必备条件之一是你的应用必须有很高的“可用性”. 你可以去查这份叫做 iOS Human Interface Guidelines的指导手册,更方便的是直接阅读从中提炼出的10条精华小贴士.

Think Aloud-适合设计师的可用性方法

- - TaoBaoUED
Think aloud 是可用性测试中常用的一种方法,它是由IBM公司Clayton Lewis  在1982年在 《以任务为中心的界面设计》书中被阐述,同时引进到了可用性领域,1993年由前苹果研究院VP的Jakob Neilson在可用性工程这本书中再次推出. 使用 Think aloud方法,需要提供给被测用户待测的产品或界面原型,要求被测用户根据指定任务操作产品或界面,与此同时,即时地说出使用产品界面时的想法、感受和意见.