《DON’T MAKE ME THINK 点石成金——访客至上网页秘笈》读书笔记（原书第2版）

Krug 的可用性定律：

1. 别让用户思考！

2. 点击多少次都没有关系，只要每次点击都是无需思考、明确无误的选择。

3. 去掉每个页面上一半的文字，然后把剩下的文字再去掉一半。

第一章：别让我思考

1.  Krug 可用性第一定律：别让用户思考！

2. 让设计不言而喻，明确页面每一个区域的功能。如果做不到让页面不言而喻，那么至少要让页面自我解释。

3. 让用户疑惑就会强迫用户思考。Web设计中强迫用户思考的细节会积少成多，这样的后果就是让用户浏览网页的效率降低，更有可能丧失他们。

第二章：用户实际上是如何使用 Web 的

1. 用户不是阅读而是扫描。

用户总处于忙碌之中/ 用户不必阅读所有内容 / 用户善于扫描

2. 用户不作最佳选择而是满意即可。

用户总处于忙碌之中/ 如果猜错，后果不严重 / 权衡选择没有什么用 / 猜测更有意思

3. 用户不是追根究底而是勉强应付。

   追根究底并不重要，能用就行 / 如果发现某个事物能用，用户就会一直用

4. 用户使用Web的方式就好像在高速路上行驶的时候看广告牌。

第三章：广告牌设计的 101 法则——为扫描而设计

1. 建立清楚的视觉层次。

   ①越重要的地方越突出

   ②逻辑上相关的部分视觉上也相关

   ③逻辑上包含的部分视觉上嵌套

2. 尽量利用习惯用法。

   习惯用法非常有用。不要为了创新而创新，从而忽视了习惯用法。

3. 把页面划分成明确定义的区域。

   这样的话用户就可以有选择性地关注，或者放心地跳过某个区域。

4. 明显标识可以点击的地方。

   不让用户花时间思考什么地方可以点什么地方不能点。

5. 最大限度降低视觉干扰。

   ①页面内容眼花缭乱，都是重点也就没有了重点

   ② 页面背景使得内容难以识别，难以被用户扫描

第四章：为什么用户喜欢无需思考的选择

1.  Krug 可用性第二定律：点击多少次都没有关系，只要每次点击都是无需思考、明确无误的选择。

2. 三次无需思考、明确无误的点击 = 一次需要思考的点击

3. 降低用户在 Web 上选择时的难度，让每次选择变得无需思考，不要让用户困惑。

   例如：某些软件让用户选择地址时将定位结果作为首选。

第五章：省略不必要的文字

1.  Krug可用性第三定律：去掉每个页面上一半的文字，然后把剩下的文字再去掉一半。

2. 欢迎词必须消灭。

   欢迎词像极了闲聊，但是Web用户没时间跟你闲聊。

3. 指示说明必须消灭。

   过长的说明用户不仅不会细读，而且会让他们发现所需信息的几率减小。

4. 好处：

①可以降低页面噪声

②让有用的内容更加突出

③让页面更简短，让用户可以在每一页看到更多的内容，无需滚屏

5. 省略不必要的文字不是去缩减网页的内容，例如网站中的观点、文章。

第六章：设计导航

1. Web 的体验如何：

感觉不到大小（层级多少）、感觉不到方向（层级上下）、感觉不到位置（身处层级）

2. 导航的用途：

   ① 帮助用户找到想要的东西

   ② 告诉用户身在何处

   ③ 给用户固定的感觉

   ④告诉用户当前的位置

   ⑤告诉用户从哪里开始，如何使用

   ⑥ 给用户对网站建造者的信心

3. Web 导航的习惯用法大部分来自印刷品习惯用法。基本元素如下：

   站点 ID、栏目（主导航条）、实用工具、下一级栏目、“你在这里”指示器、页面名称、页面导航（当前页的内容）、小字体版的低端导航。

4. 持久导航

   定义：出现在网站每个页面上的外观、位置一致导航元素

   包括：站点 ID、返回主页的方式、搜索、实用工具、栏目

   优势：界面统一，用户只需学习一次

   特例：主页（由于任务不同）和表单（会分散填表注意力）不一定使用持久导航

4-1. 站点 ID

     要处在页面的最左上角，要具有独特的风格。

4-2. 栏目（主导航条）

     是站点内容主要栏目的链接，是站点层次结构的最顶层。

4-3. 实用工具

     是到达网站中不属于内容层次的重要元素的链接

     工具可能有许多种，但是不可以全部都放在持久导航上。在持久导航上最多放4-5个常用的实用工具，剩下不常用的要分好组，放在主页上。

4-4. 返回主页链接

     就像“重启”按键，可以将站点ID作为此功能的入口。

4-5. 搜索

     搜索框的设计要从简：一个输入框+ 一个按钮 + “搜索”的字样

     避免：① 花哨的用词 ② 指示说明（已经过时）③ 选项（如需提供必须有用）

4-6. 站点内的全部

     不要忽视底层页面的设计，设计时要力求全面，充分展示，考虑站点底层页面的设计。

4-7. 页面名称

     ①每一个页面都需要名称（导航上的不算）

     ②页面名称要出现在合适的位置

     ③ 名称要引人注目（应当是页面上最大的文字）

     ④名称要与导航上的完全一致（如果不完全一致：1.要尽量匹配2.不匹配原因明显）

4-8. “你在这里”指示器

     在导航栏的菜单中把当前页面的链接标记出来，一定要明显！方法：

      / 添加指示器▷ / 改变颜色 / 加粗/ 按钮反白 / 改变按钮颜色 /

4-9. 层级菜单

     负责记录主页到当前页的路径。设计方法：

     ①把它们放在最顶端

     ② 使用“＞”对层级进行分隔

     ③ 使用小字体

     ④使用文字：你在这里 进行说明

     ⑤将最后一个元素加粗或变色表示当前页

     ⑥ 不把最后一个元素当作当前页的页面名称

4-10. 标签

     要正确绘制标签用来表示相应的物理空间

5. 站点页面的必备

   / 站点 ID / 页面名称 / 栏目与下一级栏目/ 页内导航 /“你在这里”指示器 / 搜索 /

第七章：设计主页

1. 主页的任务：

① 站点的标识和使命 ② 站点层次 ③ 搜索 ④ 导读⑤ 内容更新 ⑥ 友情链接 ⑦ 快捷方式 ⑧ 注册 ⑨ 让用户一目了然 ⑩ 用户关注点外的精彩内容 ⑪ 从哪里开始 ⑫ 建立信任感

2. 主页的设计要传达整体形象。当用户第一次见到这个主页时，主页应该可以明确回答：

①这是什么网站？

   ② 我能在这里做什么？

   ③网站上有什么？

   ④为什么我应该在这里，而不是其他地方？

3. 如何传达网站的整体形象

   ① 通过口号：在最靠近站点 ID 的位置，用短语描述整个网站。家喻户晓的网址可以不使用。口号要清楚，言之有物，长度适中，个性生动，能表达出网站的特点和显而易见的好处。不要含糊不轻，也不要太笼统。

   ②通过欢迎广告：简要描述网站，在主页首要处显示，无需滚屏，或者利用网页的顶部，站点 ID 的右侧。

4. 主页上传达信息的指导原则

①需要多大空间就使用多大空间

   ② 但也不要用过多的空间

   ③不要把使命陈述当作欢迎广告

   ④最重要的是测试

5. 主页明确回答的第五个问题：从哪里开始

   在传达网站的整体形象后，主页的设计应该让用户明白：如果他们需要搜索、扫描、扫描最精彩的内容 分别要从哪里开始。达到这个要求，设计的时候要遵循形式追随功能的原则，例如：让搜索框看起来就像搜索框，一目了然。

6. 主页导航

   主页导航可以与持久导航不同，但风格要一致。

常见差别：有栏目描述（描述说明导航中的连接）

             不同的方向（水平导航或垂直导航）

             用于识别的空间更多（站点ID大一些）

   一致风格：同样的文字：栏目名称和排列顺序

同样的视觉：字体、颜色、大小写

7. 下拉菜单

   下拉菜单不易被发现，难以扫描，不好控制。但是若菜单项目为国家、省份之类时，按字母排序效果较好。

第八章：避免 Web 设计团队讨论可用性

1. 项目经理，市场人员，开发人员，设计师之间的信仰大战费时费力，通过测试才能看到用户的动机、理解、反应的不同。从而意识到用户的想法与我们不同。

2. 优秀的 Web 设计因地制宜，确保不同情形下都有不错的易用性，而不是通过简单的设计者喜好拼凑。

3. 对 Web 用户而言，没有“完全正确”的答案，良好的、一体化的设计就可以满足需要。但是也存在“完全错误”的答案。

第9章：Web 设计的可用性测试

1. 焦点小组研究不是可用性测试

   ① 焦点小组研究：5~8 人围坐，对展示给他们的想法和设计做出反应。主要价值来自参与人员彼此的反应。焦点小组是快速得到用户的意见和感觉的一种不错的方法。

   ② 可用性测试：一次向一个用户展示一些内容（网站、网站原型、单页草图），并让用户指出“这是什么？”试着让用户用它来完成一次典型的任务。

   总结：焦点小组用来确定受众的需求。测试网站的理念与价值主张是否吸引人，或者是站内功的命名是否合适，再或者是了解对手情况。但并不适合用来改进网站。一般来说，焦点小组的产出应该是在设计网站之前就需要了解的。

2. 关于测试的几个事实

①一定要测试

       改变自己的理所当然，了解别人的见解与看法。

②测试一个用户比不测试好一倍

       前提要充分记录用户的测试过程。

③在项目中，早点测试一位用户好过最后测试 50 位用户

       一旦网站建成，每一处细微的改动都会对不同用户产生巨大影响。

④人们对招募用户代表的重要性估计过高

       宽松招募，曲线上升，门槛越低越接近目标用户。

⑤测试的关键不是要证明什么或者反驳什么，而是了解你的判断力

       测试只提供了更有价值的参考。

⑥测试是一个迭代的过程

       需要不断重复开发——测试——修复——再测试。

⑦没有什么比现场用户的反应更重要

进行可用性测试可以为设计与开发节省时间，花销也并不高，而且一定会有成效。

3. 简易可用性测试

①应该测试多少用户

一般 3 - 4 人，少人数，多轮回。这样可以保持较快的节奏。人数少的测试，团队产生的笔记也少，处理起来也方便。

②应该如何招募

对大部分网站来说，测试对象是谁都不重要。只需要懂上网的基本知识就可以。

例外：1）网站几乎只有某一类用户使用，则只招该类用户。

      2）网站的目标群体分几个阵营，则每个阵营混合招募。

      3）网站的专业性较强，则至少在一回合中招募专业用户。

注意：1）提供合理鼓励

      2）邀请文案要简单

      3）避免对网站进行预先讨论

      4）乐于向朋友邻居求助

③在哪里测试

条件：一间屋子、椅子、电脑、联网、摄像机、视频电缆、录屏软件、三脚架

人员：测试对象、协助人员、团队成员（观察）

④应该由谁来引导测试（协助人员）

大部分人都可以鼓励测试用户去尝试（耐心、冷静、有同理心、善于倾听、天性公正）

⑤应该由谁来进行观察

任何想要观察的人都可以来参与

⑥测试什么，什么时候测试

1）在Web开发的各个阶段及早测试、经常测试。（可以加快迭代速度）

2）设计网站之前可以先测试对手的网站。（提前了解对手的优缺点，针对地去设计）

3）在测试自己设计的站点之前，可以先让受试者测试别人的网站。（放松你的心情）

4）你可以进行的两种测试方式：

①“理解”测试：测试用户对网站的理解程度

② 关键任务测试：让用户完成一些任务，观察他们是怎么做的

5）想办法观察用户执行一些他们有权参与选择的任务，这样效果会好一些

6）建立网站时，越早把设计思想展示给用户越好。用户更愿意评论没有完成的东西

7）打印新设计的页面给旁人看一看，这种非正式的测试效率也很高

⑦ 实际操作遇到的问题

1）介绍：① 告诉用户可以畅所欲言

            ② 告诉用户在测试中的问题不及时回答的原因

            ③ 告诉用户的隐私会受到保护

            ④ 告诉用户要对项目保密

2）背景问题：① 简单了解用户

                ② 划分用户类型

                ③ 深入了解问题后及时回归主题

3）对主页的反映：① 向用户展示主页

                    ② 在审美问题上不要纠结

                    ③ 注意用户对主页上名词、插图的理解

4）任务测试：① 尽量让用户在选择任务时说点什么

                ② 任务总时长不超过45分钟

⑧ 立刻回顾测试结果

在上午进行 3-4 轮测试，午休时【给问题分类】：回顾问题，找到哪些需要修正【解决问题】：找出修正这些问题的方法。

⑨ 常见问题

   1）用户不清楚概念：不知网页所云；理解有误

   2）他们找不到自己需要的字眼：组织分类不合用户习惯；没有使用用户期望的名字

   3）网站内容太多：减少页面整体干扰；让需要看到呢的内容更加醒目

⑩ 一些问题分类指南

   1）忽略用户的暂时性出错

   2）抵制添加解释的冲动，主张减去干扰而非添加说明

   3）不要太看重人们对新功能的要求，受试者只是陈述习惯与喜好

   4）抓住够得着的果子，找改后效果非常好的，几乎不费力的，费点力效果好的

⑪ 修改的禁忌

   修改要保持各个功能间的平衡，修正问题时不破坏已经正常运行的部分

⑫ 关于测试频率

   一个月花一上午测试 3-4 个人

第10章：可用性是基本礼貌

1. 用户的好感度：因人而异，因情况而异，可以补偿，可能因小失大。

2. 降低好感的几种方式：

   ①隐藏用户想要的信息，例如：客服入口，各类资费

   ② 因为没有按设计者的设计行事而受到惩罚

   ③ 向用户询问不必要的信息，例如：个人信息

   ④ 敷衍与欺骗，虚伪的真诚，假意的关心，例如：您的电话对我们很重要

   ⑤ 设置障碍，例如：不可跳过的冗长的介绍片或自吹自擂的页面

   ⑥ 网站看上去不专业

3. 提高好感度的几种方式：

   ① 了解用户想做的，让其明白简易

   ② 告诉用户想知道的

   ③ 尽量减少步骤

   ④ 确保能用，有用，易用

   ⑤ 预判用户的疑问并给于解答

   ⑥ 提供协助，例如：方便打印

   ⑦ 容易从错误中恢复

   ⑧无能为力？道歉

第 11 章：为残疾人设计——可访问性

不要只为健全人设计，要适当考虑残疾人，虽然这样工作量可能大一些，例如这样的设计：

自定义字体大小

为图片条件 Alt 文本进行说明

增加“跳转到主要内容”链接

让所有内容都可以用键盘访问

等等

第12章：来自上级的压力

当设计遇到来自有些不懂设计的老板指点时，一些糟糕的设计就可能油然而生。为了避免这种情况，可以试着活用本书的内容，在明白自己在干什么、有充分理由的前提下，据理力争一下。其实老板的“糟糕设计”的意图是好的，你可以试着去理解它，然后用其他合理的方式达到目的。