减少认知过载以获得更好的用户体验-每个人都应该阅读

每周，我们都会发布有用的前端和用户体验技巧。订阅并将智能界面设计核对表PDF发送到您的收件箱。

如果用户体验设计做了它应该做的事情，用户将不会注意到其中的任何工作。用户需要考虑的界面或设计越少，他们就越能专注于在你的网站上实现他们的目标。作为一名设计师，你的工作就是通过事先清除障碍，给他们一条通向目标的直路。

“挡在高速行驶的货运列车上通常不会有好结果。要改变具有如此强大动力的事物的进程，需要付出很大的努力。与其强迫人们把注意力从他们的首要任务上转移，不如去他们所在的地方。“--谷歌产品总监卢克·沃布列夫斯基(Luke Wroblewski)。

毕竟，还是考虑一下另一种选择吧。复杂和令人困惑的界面迫使用户找到解决问题的办法，而这些问题本来就不应该出现在那里。对选项、界面、导航等感到困惑的用户很可能会在思考过程中感到不知所措。即使是短暂的停顿也足以让用户重新回到他们坐在电脑前的现实中。

这种过度思考被称为认知过载，这里我们将解释如何避免它。首先，我们需要解释我们大脑中到底是什么存在超负荷的风险。

认知负荷指的是你的工作记忆能处理的信息总量。当你的工作记忆接收到的信息超过了它能舒适地处理的时候，就会出现认知过载，导致挫折感和复杂的决策。

但这到底是什么意思呢？工作记忆到底是什么？这和设计有什么关系？第一步是理解认知负荷理论的起源。

虽然对认知的研究可以追溯到几个世纪前，但直到20世纪80年代，澳大利亚教育心理学家约翰·斯韦勒(John Sweller)才将这项研究应用于教学设计。斯韦勒试图为任何类型的学习者辨别出最好的条件来保留他们所学到的信息。换句话说，让一堂课变得牢不可破的最好策略是什么？

斯韦勒的工作在1988年出版的《认知负荷理论、学习困难和教学设计》(PDF)中达到顶峰，并于1994年晚些时候重新修改和出版。他的研究纳入了被称为图式的数据组织结构，并概述了有效和无效的教学方法，但他对工作记忆局限性的发现往往是设计师们认为最有用的。

在许多方面，斯韦勒的工作都是基于乔治·米勒(George Miller)的信息处理理论。米勒是20世纪50年代的认知心理学家和语言学家，他测试了短期记忆的极限。自那以后，米勒的研究在数字设计中根深蒂固，特别是本文后面讨论的组块技术。米勒还负责了论文《魔术数字7，加或减2》(PDF)，这促使许多设计师将菜单项目限制在5到9之间-尽管这种技术后来在数字设计中被降级了。

虽然这些策略最初是针对教育领域的，但它们同样适用于用户体验(UX)设计。正如我们将解释的，增强记忆力和学习的相同技术也减少了用户的烦恼。

如果每次你想打开冰箱的时候，你都得回答一个斯芬克辛的谜题，比如：“什么东西早上用四只脚走路，下午用两只脚走路，晚上用三只脚走路？”

过一段时间它就会变旧了，对吧？但根据认知负荷理论，这与用户对糟糕的用户体验设计的挫折感是一样的。

要理解认知负荷理论，你必须了解工作记忆，这是一种在瞬间完成任务的大脑活动。工作记忆必须对所有外部刺激和短期记忆项目进行分类，如果需要，还可以从长期记忆中提取信息。可以把工作记忆想象成计算机RAM，把长期记忆想象成硬盘。

工作记忆和短期记忆通常可以互换使用，但它们略有不同。工作记忆负责信息的处理，而短期记忆更像是存放重要但对长期记忆还不够重要的信息的便签簿。

让我们看看这篇文章来解释其中的不同之处。当你在阅读的时候，你可能会遇到一个不熟悉的蓝色文本的概念。你的工作记忆需要知道蓝色文本中的概念是什么意思，才能理解文章的更大含义。你的长期记忆知道蓝色文本意味着链接，所以你的工作记忆知道点击链接获取更多信息。同时，你的短期记忆会记住你在文章中的位置，所以当你从外部页面返回时，你不会迷路--但到了明天早上，那个位置就会被遗忘。

著名作家史蒂夫·克鲁格将认知负荷理论推广到网页设计中。他的书《别让我思考》被许多设计师认为是一部开创性的作品。

每个页面都应该不言而喻，因为用户从中间进入网站的可能性与从主页进入网站的可能性一样大。

用户倾向于“满意”--也就是说，对他们的问题采取第一个或最简单的解决方案，而不是最好的解决方案。此外，作为习惯生物，用户将继续一遍又一遍地使用相同的解决方案，从来没有考虑过更好的选择。

当一个能力或经验一般的人能够使用该系统来实现他们的目标时，可用性就足够了。

很多网络使用都是出于节省时间的愿望。所以，用户经常会采取鲨鱼式的“要么继续走，要么死掉”的心态。

即使从未使用过，屏幕上可见的主页按钮也会给用户一种安心的感觉。

除了克鲁格，还有许多人详细阐述了认知负荷理论在设计中的作用，包括尼尔森诺曼集团(Nielsen Norman Group)的可用性专家。

总而言之，每次用户在浏览网站时不得不停下来思考--哪怕是一瞬间--他们的工作记忆都会被压垮。诸如“这是可点击的吗？”、“主页按钮在哪里？”以及“我该怎么存钱？”会毁了用户的体验。

许多设计变量可能会加重用户大脑的负担，而用户外部生活和环境中的更多变量也不在您的控制范围之内。用户可能会担心第二天的工作演示，或者他们的窗口外面可能有吵闹的建筑-这些东西会耗尽他们的工作记忆，无论你的网站设计有多简单。

我们不要忘记，每个用户都有不同的工作记忆容量。随和的用户将能够更好地专注于你的网站，而不是那些对每一件小事都有压力的用户。不经常上网的用户将不得不比有经验的网络用户考虑得更多。

虽然我们不能普遍量化认知超负荷，但我们可以分离出最常见的导致认知超负荷的设计错误。下面，我们对网页设计中最流行的类型进行了分类，以及避免它们的最佳实践。

用户迈出的每一步都会增加他们的认知负荷。太多不必要的动作会打乱用户的思路，或者激怒他们。因为用户的工作记忆专注于完成特定的目标，不必要的操作会迫使用户付出更多努力，这就需要无缘无故地将更多的工作记忆投入到任务中。至少，这些不必要的步骤将考验用户的耐心。

速度和步调是最小化认知负荷的基本考虑因素。用户想要快速、有目的地完成他们的任务，所以要事先消除任何滞后。

用户喜欢在提交电子邮件地址之前知道自己在做什么，但Touch of Modern的看门人要求在…之前注册。什么都行!。这第一个强制性和不必要的行动将吓跑相当大一部分潜在用户。

下面是找到不必要操作的一个很好的练习：列出用户为完成任务必须执行的每个步骤。例如，发送电子邮件可能如下所示：

通过让光标自动从“发送到”字段开始，您可以完全删除步骤2。这将省去用户的麻烦，无论这些麻烦多么微不足道。你消除的每一步都是胜利。

让我们来看看谷歌的主页。光标从搜索字段开始，因此用户所要做的就是开始键入。这些微观互动构成了整个体验，所以不要忽视它们。

杂乱、混乱或令人分心的界面会让用户从手头的任务中分心。就像当几个人同时与你交谈时很难集中注意力一样，在网络上，当太多的图片、动画、图标、广告、文本类型和鲜艳的颜色争抢着你的注意力时，你很难集中注意力。

记住，一个人的工作记忆必须在朝着目标前进的过程中梳理外部刺激。每一次分心，尤其是视觉上的霸道，都需要用户的关注。

LINGsCARS可能是一个极端的例子，但你可以看到相互竞争的元素，如鲜艳的颜色和动作，攻击感官的速度是多么快。即使在屏幕的两个不同区域同时播放两个动画，也有可能过度刺激用户。

首先，扔掉所有不必要的东西。一般来说，只保留必要的内容是有利的，可以减少装载时间并简化体验。更重要的是，一项关于美学如何影响网站第一印象(PDF)的研究发现，与视觉上复杂的网站相比，用户更喜欢简单的网站。

你也可以使你的内容多样化以达到平衡。太多的一种类型(比如，文本或图像)是专横的。充分利用视觉内容--图片、视频、信息图表等--在页面上营造和谐，让用户更容易理解。

影视网站IMDb本可以很容易地严重依赖视觉内容，但它却用等量的文本内容来平衡视觉内容。

一旦你把一个页面归结为它的必需品，以一种用户可以立即理解的方式组织这些元素。对称或建设性不对称的布局以一种更容易理解的方式显示信息，也就是说，以一种不需要大脑努力的方式显示信息。对称和巧妙的不对称不仅让人赏心悦目，而且它们的结构使界面更容易交互。

看看Groupon是如何用特色冷冻酸奶交易的文字描述(右中)来抵消文本类别垂直菜单(左中)的影响吧？照片和色块的使用创造了一个有条理的、令人满意的沙漏形状，中间用文字夹住。

对称不仅仅是在屏幕的两侧放置相同的布局。这是关于平衡视觉重量和视觉方向。通过这种方式，不对称屏幕仍然可以看起来井然有序，如下面的OTHR所示。

把你的页面缩小到只有简单和非竞争性的元素，这只是对抗过度刺激的一半。不要忘了以简单的布局呈现这些元素。

这有点自相矛盾：用户想要很多选择，但太多的选择会让他们的大脑不堪重负。

希克定律(或称决策瘫痪)解释了这样一种现象：用户拥有的选择越多，他们做出决定所需的时间就越长。虽然威廉·希克(William Hick)和雷·海曼(Ray Hyman)在20世纪50年代首次测试了他们的理论，但在过去的十年里，他们的发现被重新定义为数字设计。行为研究(PDF)不仅证实了希克定律，而且最近在2015年的一项核磁共振研究中记录了这一现象对大脑的影响。

作为一名设计师，要理解希克定律，就要把每一种选择都看作是一盏闪光灯。如上所述，过多的闪光灯会过度刺激使用者。

即使是像乐天这样的流行网站的制作人也会犯这个错误，因为他们没有正确地理解这一原则。这是给用户他们想要的东西和给他们认为他们想要的东西之间的区别。

假设你已经去掉了不必要和多余的选项，你可以将多个选项分组到伞类别中。你可以在百货商店的网站上看到很多这样的东西，那里有最广泛的产品选择。

这不一定是关于太多的选择，只是一次有太多的选择。如果你能把其中的一些选择隐藏在隐藏的菜单、抽屉和抽屉里，你就两全其美了。这些超级菜单仍然为用户提供了许多选项，但选择的剂量不会让用户负担过重。

然而，隐藏的导航菜单限制了可发现性，因此电子商务和新闻等行业的设计师必须小心。通过在页面上添加指向其他产品的特殊链接(例如亚马逊的“相关购买”横幅)，可以最大限度地减少隐藏菜单的缺点。或者，你可以简单地取消隐藏菜单，将标题类别泛化，直到它们可以放入单一导航菜单中(就像苹果和CNN所做的那样)。

您还需要注意如何组织整个网站的导航。希克定律的许多问题可以通过管理信息体系结构(IA)来处理，我们将在下面的“难以找到的页面和特性”一节中讨论这一点。

就像过度刺激和选择太多的问题一样，提供太多的内容会把你的用户的工作记忆拉向太多不同的方向。

你显然只想显示必要的内容，但对于一些强大的网站来说，一切都是必不可少的。如果你有太多的内容，你必须学会如何组织它，这样你才不会给用户带来压力。

Arngren的问题不在于它提供的产品太多，而在于它同时提供的产品太多。更多的结构和组织会给网站的外观带来奇迹。

正如上面所解释的，乔治·米勒的组块策略在以一种可管理的方式呈现大量内容方面是有效的。这是一种将数据分组以便于记忆的技能。电话号码分为国家代码、区号、一组三位数字和一组四位数字--一串11个或更多的数字太难记忆了。

你想在你的在线商店的主页上展示大量的产品图片吗？不是将它们全部列在单独的行和列中，而是根据它们的类型将它们分组显示。根据卖家的说法，Etsy可以通过将产品分组，在其主页上展示更多的产品。

文本中的组块包括短小的段落，充分使用标题和副标题，以及充足的空白处。

对于所有数据都是必需的长篇大论的表单域，请尝试多步骤表单。长长的表格可能看起来很吓人，有时甚至会导致网站被放弃。将表单信息拆分成单独的页面，或者至少是单独的部分，以使其不那么引人注目。只需确保包含进度标记，以便用户知道预期的页面数量即可。

买机票总是需要填写大量的数据，而这些数据都不是可浪费的。维珍航空改善了原本繁琐的体验，将其分解为单独页面上的各个步骤：选择航班、填写乘客信息、输入付款细节等。把所有这些都放在一个很长的页面上会让一些用户不堪重负，并增加弃机率。

认知过载的最大罪魁祸首是令人困惑的用户界面。用户永远不需要花很长时间来弄清楚如何完成他们想要的动作，也不应该浪费脑力去解读一个图标。

并不是所有的用户都精通技术，能够理解SpeedCrunch模糊的图标。即使他们对电脑有足够的了解，能够认出顶部的Windows和Mac OS X符号，右下角的这两个图标也会让艾伦·图灵(Alan Turing)等一会儿。

不要重新发明轮子：使用用户从其他网站上已经知道的视觉提示。用户依靠共同的负担和符号来学习控制，即使是在他们以前从未访问过的网站上也是如此。

如果这太令人窒息，你可以给熟悉的图案一个独特的旋转与你的品牌的身份。家得宝(Home Depot)使用常见的图标，但为它们提供了该品牌的橙色标志。

同样的道理也适用于显微镜。带有“联系”和“提交”等标准标签的按钮比“地址”或“前往”等非常规标签更容易辨认。众所周知的标签方便了用户的浏览体验，而不常见的标签会让用户停下来想知道按钮是做什么的。不要因为个性而牺牲清晰度。

另一方面，如果你有一个以前从未见过的功能呢？在这种情况下，通过使用真实的表示让它变得不言自明。伪超形术，正如它所说的那样，在现实和数字等价物之间架起了一座桥梁。例如，早期的互联网先驱选择信封来代表电子邮件，因为信封是邮件系统的明显象征。

此外，要避免模糊的符号，特别是如果它们可能被误认为其他东西，或者在其他方面令人困惑。下面，Issuu的一些图标很熟悉，但另一些则不熟悉。如果用户不得不点击一个图标才能发现它的功能，他们将被淘汰出局。

用全新的眼光审视你的设计，确保你没有遗漏任何明显的东西。

看看丹尼斯·科图诺夫列出的10个常见的图标错误清单，了解哪些是不应该做的--例如，图标之间过于相似，或者个别图标过于复杂。

任何不是完全显而易见的界面都应该包括自注册，以指导用户了解用户界面是如何工作的。简单的网站可以只用一个窗口，特别是如果一个令人难忘的图形解释了它的功能。然而，新的和独特的界面需要更多的动手教程。例如，Slake提供了一次完整的视频巡演，并配有旁白解释正在发生的事情。

即使用户拥有他们需要的一切，他们也可能找不到。这并不比功能被破坏好到哪里去。归根结底，用户试图弄清楚该做什么是在浪费脑力。

作为每个用户体验不可替代的组成部分，导航应该是简单和无压力的。网站导航应该感觉直观，应该给用户信心，让他们可以自由漫游，而不用担心迷路。这不仅需要在IA中进行额外的工作，而且还需要仔细应用，使其看起来比实际情况更简单。

如果你认为汉堡图标不好，Mojo Yogurt要求你将鼠标悬停在左上角的标志上，以显示导航菜单。

值得称道的是，一个写着“导航”的小动画环绕着这个标志。但是屏幕上所有的颜色和动作，一个模糊的提示是不够的。

根据用户的喜好调整您的IA。你的目标用户群可能与你的想法不同，所以向他们学习如何组织网站。卡片分类测试揭示了用户如何对某些页面和主题进行分类。树测试评估真实用户对您当前或提议的结构的理解程度。

有关信息构建的速成课程，请阅读丹·布朗(Dan Brown)的“信息构建的八大原则”(PDF)。在短短五页的时间里，他的概述解释了每个设计师都应该知道的关于IA的八条坚定不移的规则，比如多重分类原则(即使用几种不同的分类方法来适应用户的不同思维模式)和披露原则(即只显示足够的信息，以便用户知道会发生什么)。

您还可以通过组合页面或菜单项来消除冗余。例如，高管简历不需要一个页面，团队成员个人也不需要另一个页面--它们可以放在同一个页面上。

.