点石成金—读书笔记

可用性原则

1.可用性第一原则:别让我思考。

2.可用性第二原则:点击多少次都没有太多关系,只要每次点击都是无需思考、明确无误的选择。

3.可用性第三原则:省略多余的文字,去掉每个页面上一半的文字,然后把剩下的文字再去掉一半。

4.如果你不能做到让一个页面不言而喻,那么至少应该让它自我解释。

5.我们实际上是如何使用Web的:我们不是阅读,而是浏览、我们不作最佳选择,而是满意即可、我们不是追根究底,而是勉强应付。

6.为浏览设计,不为阅读设计。

7.某个东西越需要投入大量时间,或者看起来会这样,它将来就会用得越少。

8.可用性的定义:让一个有着平均能力和经验的人(甚至稍低于平均水平)能明白如何使用它——不必付出过度的努力,或者遇到不必要的麻烦。

9.可用性的定义可分为:有用,可学习,可记忆,有效,合乎期望。

10.最小化干扰:即降低视觉噪点。

11.用户喜欢无需思考的选择。

12.必要的帮助和支持:简短、及时、不会错过。

13.主要省去欢迎文字和精简指示文字.

14.好的促销文案:不会一个劲地说自己有多好,而是描述什么东西让我们感觉更好。

第一章 别让我思考

1.别让用户思考,让每一个页面不言而喻。用户处于忙碌之,知道自己不必阅读所有内容。

2.善于扫描(注意力在自己感兴趣的部分),用户只要看它一眼就知道是什么内容,知道怎么用它。如果不能,至少也应该一目了然。

第二章 我们实际上是如何使用web

1.用户不是阅读,而是浏览

①第一个事实:我们不是阅读,而是扫描——人们总是处于忙碌中;

知道自己不需要阅读所有内容;善于扫描(浏览)。

②第二个事实:我们不做最佳选择,而是满意即可——忙碌;猜错了,

后果也不严重;对选择进行权衡不会改善我们的机会;猜测更有意思。

③第三个事实:我们不是追根究底,而是勉强应付——根源对我们来说

不重要;若发现某个事物能用,就会一直用它。

2.抓住用户内心需求,用户不做最佳选择(难、时间长)而是满意即可(效率更高);我们不会是追根揭底,而是勉强应付。

第三章 广告牌设计101法则

1.在每个页面上建立清楚的视觉层次:越重要的部分月突出;逻辑上相关的部分在视觉上也相关,逻辑上包含的部分在视觉上进行嵌套。

2. 尽量利用习惯用法:习惯用法非常有用,设计师为了新颖通常不愿意利用习惯用法。

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

4.明确标识可以点击的区域。

5.最大限度降低干扰:眼花缭乱;背景噪声(间隔线尽量虚化)

第四章 动物、植物、无机物

“三次无需思考明确无误点击相当于一次需要思考的点击”

1.点击次数不是重点,用户在使用网页中如果页面上信息过于繁琐,那么用户就要产生一个思考的过程,因此给用户点击(选择)体验尽可能直白。

2.点击多少次都没关系,只要每次点击都是无须思考,明确无误的选择——可用性第二定律。

3.如果我们需要一直在网络上进行选择,那么让这些选择变得无须思考是让一个网站容易使用的主要因素。

第五章 省略多余的文字

去掉页面上一半的文字,然后把剩下的的文字再去掉一半。——可用性第三定律

有力的文字都很简练。句子里不应该有多余的文字,段落里不应该有多余的句子。

去掉没人会看的文字的好处:可以降低页面噪音;让有用的内容更突出;让界面更简短,让用户在每个页面一眼就能看到更多内容。

实际上必需去掉的两种特别的文字:欢迎词和指示说明。

第六章 街头指示牌和面包屑

记住:如果在网站上找不到方向,人们不会使用你的网站。

Web上的体验缺少空间感:感觉不到大小、方向、位置。

若我们想再次访问网站的某个内容,我们记住的是它在概念层次上的位置,而不是依靠它在哪里的物理感觉,让后顺着以往的链接过去,这是书签重要的原因,也是后退按钮点击率极高的原因

导航有两个显而易见的用途:帮助我们找到任何东西以及告诉我们现在身在何处。

导航的其他功能:它给了我们一个固定的感觉;告诉我们当前的位置;告诉我们如何使用网站;给了我们对网站建造者的信心。

设计得当的持久导航应该是平静,令人舒服的。

让导航部分每一页以一致的外观出现在同样的位置,会让你立即确认自己仍然在这个网站上——这比你想象中更加重要同时意味着你只需要了解它一次。

(Microsoft软件导航栏基础部分一样只有颜色的区别)

持久导航应该包括5个元素:站点ID(LOGO);回主页的方式;探索的方式;实用工具;栏目。

提供搜索——由于搜索的潜在威力和喜欢搜索的用户比喜欢浏览的用户更多,因此每个页面都应该有一个搜索框或一个搜索页面的连接,除非你的网站真的不太需要搜索。

大多数用户登录新站点,第一件事是扫描页面,看看有没有搜索。

搜索框要坚持简约原则:一个输入框、一个按钮、还有搜索字样,切记复杂。

要抵消网络固有的空间迷失感,其中的一种导航方式是告诉我当前在什么位置。在Web中,可以用突出当前位置来实现,不管是在页面的导航条、列表还是菜单上。

面包屑导航不会占用太多空间,提供一种方便的方式让你:退回上一个层次或去主页,它用来补充固定导航机制最有价值。

标签是极少几个将物理隐喻有效应用到用户界面的例子之一。将原来的物体分成了不同的部分,打开不同的部分很容易,通过突出的标签可以翻到对应位置。

标签是大型网站导航的上佳选择:它们不言而喻;它们很难错过;他们很灵活;它们暗示了一个物理空间。

如果想要使用标签,认真参考Amazon经典的标签设计,并且务必模仿其中的三个要点: 

正确绘制:激活的标签页位于其他标签页之前——这是让他和标签相像的最大要点——比与众不同的标签外形更重要。——想营造出这样的效果,激活的标签页必须有一种不同的颜色或外形做对比,并且必须与它下面的空间在物理上链接起来,这是把激活的标签页“弹到”最前方的方法。

颜色编码:为网站的每个栏目使用不同的标签颜色。并把这种颜色用在页面其他导航元素上,让他们浑然一体。——运用颜色对比,饱和与中性对比

当你进入网站时,有一个标签已经选中。

进入网站一般会遵循的流程

你通常是为了寻找某个目标

你会决定先询问还是先浏览

如果选择浏览,你将通过标识的引导在层次结构中穿行

最后,如果找不到想要的东西,就会离开。 

第七章 首先要承认,主页不由你控制

主页要完成的任务: 

站点的标识和使命:是什么网站,是做什么的,为什么我应该在这里而不是其他网站 

站点层次:主页要给出网站提供服务的概貌,既有内容,又有功能还有这些服务是如何组织的——通常由持久导航来处理。 

搜索:大多数网站需要在主页上设置一个突出显示的搜索框 

导读:用暗示吸引用户——内容推荐应突出最新、最好、最流行的内容片段:功能推荐部分应邀请访问或试用一些个性化功能 

内容片段:功能推荐部分应邀请访问或试用一些个性化功能 

内容更新:主页要经常更新内容 

友情链接:预留空间放置广告、交叉推广、合作品牌的链接 

快捷方式:最常访问的内容片段(如软件升级)值得在主页上放置链接 

注册:登录注册链接,并让用户知道已经登录了(欢迎回到……)

设计主页不可避免的要做一些折中。

设计网页必要传达整体形象——当进入新的网页时,主页应该尽可能快速清晰的回答四个问题:这是什么网站?我能在这里做什么?网站上有些什么?为什么我应该在这里而不是在别的地方?

网页设计中整体形象如何传达? 

口号:最有价值的位置之一是靠近LOGO的地方 

欢迎广告:是网站的简要描述,在主页的首要位置显示,不需要滚动屏幕就能看到。

信息传达的指导原则

需要多大空间就用多大空间,但也不要使用过多空间 

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

最重要的是进行测试 

没有什么比得上一个好口号

口号是一条精炼的短句,刻画了整个企业,总结它是什么,什么让它如此卓越。它是用户最希望能找到关于网站目标具体描述的地方。

选择口号时要考虑的几点:

好的口号要清晰、言之有物 

不好的口号含混不清 

好的口号长度适中,6-8个英文单词足以表达思想,而且容易让人领会 

好的口号能表达出网站的特点和显而易见的好处 

不好的口号听起来太笼统 

好的口号应该有个性、生动、有时候还很调皮

当进入一个新网站,快速扫描主页之后,我应该能明白无误的知道:如果我想要搜索、扫描及扫描网站最精彩的内容,都可以从这里开始

在那些针对包含一系列步骤的过程所建立的网站上,过程的起点应该很显眼;在需要新用户注册的/老用户登录的网站,应该突出显示注册和登录的位置

主页导航可以不一样。由于主页独特的职责,通常不必使用持久导航,常见差别包括: 

栏目描述:由于主页要尽可能多的表现网站内容,因此可能想为每个栏目名称增加一些描述性短语,甚至列出下一级栏目——这些内容不可能放置在每个页面上。 

不同的方向:主页可能有必要使用垂直导航栏而不是水平导航栏 

不同的方向:主页可能有必要使用垂直导航栏而不是水平导航栏 

最重要的是,让栏目的名称保持不变:同样的顺序、文字、分组;尽可能多的保持相同的视觉提示也很有用:同样的字体、颜色和大小。

下拉框可以节约空间,但它存在几个问题:

你必须把他们找出来:列表中但项目扫描页面时看不到 

他们难以扫描:标准但HTML下拉菜单,他们无法控制字体、间隔和列表格式 

他们不好控制:列表显示和收缩很快,会影响查看效果

下拉框对于组织按字母顺序排列但项目最有效,例如国家,省份或产品 。但当不知道自己在找什么名称时,下拉框的效率就很低了,特别是下拉清单不是按字母顺序或者清单长到需要滚动的情况。

任何共享的资源都会因为过度使用而遭到破坏,避免在首页过度推销过多项目

第八章 农场主和牧牛人应该是朋友

为什么Web设计团队讨论可用性实在浪费时间,如何避免这种情况。

1.Web团队的成员对于好的网站设计由什么组成有着不同的看法,但其实所有的Web用户都是独一无二的,所有的Web使用都是不一样的。好的设计会把这种复杂性考虑进去。

2.争论,浪费时间,消耗团队精力。

第九章 一天10美分的可用性测试

让测试简单——这样你能进行充分的测试

1.争论的解药——测试。(尽早测试)

①在项目中,早一点测试以为用户好过最后测试50位用户。

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

③测试的关键不是要证明什么或反驳什么,而是了解你的判断力。

④测试是一个迭代的过程。

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

2.跳楼大减价的建议可用性测试,3-4位用户,招募方式比较随便地点比较随意,主导人具有相对耐心的人即可,成本低。

3.应该测试多少用户,很多情况下每轮测试的理想用户数量应该是3-4个。

4.宽松招募,曲线上升,利用你能够寻找到的任何人(满足最低要求——懂网上的基本知识),然后曲线上升。

5.在哪里测试XXXXX(感觉没用),通过视频电缆把摄像机的信号传到附近的另一个办公室以便团队的每个人都能观察而不干扰测试用户。

6.应道测试的人,冷静、耐心、由同理心、善于倾听、天性公正的人。不要选完全不是人类的人或者办公室狂人。

7.立刻回顾测试结果,给问题分类、解决问题。

8.常见问题,用户不清楚概念、他们找不到自己要找的字眼、内容太多

9.解决办法,忽略“Kayak”(划皮艇)问题、抵制添加的冲动、不要太看重人们对新功能的要求、抓住够得着的果子。

10.别把孩子也泼出去了,和任何好的设计一样,成功的网页往往要进行巧妙的平衡,哪怕是一个微小的改动也会带来不晓得影响。

11.每个月一个上午的测试。

第十章 可用性是基本礼貌

为什么你的网站应该让人尊敬

1.好感储存器是什么

好感储存器是用户对该网站用户体验的感知,以及用户体验的好坏程度的一个反馈。

2.影响用户的好感储存期的因素

①每个用户的特质,用户的性格,个性,耐心程度

②用户在使用该网站时的环境以及用户当时的心情

③网站是否真正关心用户的利益等因素

3.降低好感度的方式

①为提供用户应该知道,了解的比较信息。例如产品价格,客服联系方式等信息

②不符合用户的行为习惯

③获取过多用户不必要的个人信息

④过多虚伪的真诚,例如上一章讲到的欢迎语不宜过多

⑤设置一些不必要的信息障碍使用户的用户体验不自由,浪费时间

网站设计凌乱不专业给用户一种你并没有认真做网站的态度

4.提高好感度的方法

①了解使用该网站的用户的需求并简单明了的呈现给用户

②让用户尽可能的了解他想要的信息即便这个星期并不是用户的期望

③尽量使网站的操作简单,以此来提升用户体验

④尽最大能力为用户解决一切疑问

⑤为用户提供更加方便,简捷优质的服务

⑥解决不可避免的bug,及时优化网站的不足

⑦如果不能为用户解决问题但必须让用户了解,坦诚面对用户

第十一章 可访问性级联样式表和你

将可访问性做到更好,即用户体验更好才会让残疾人士用着更方便

测试是改进网站的可访问性的方法

只有将网站操作步骤做到更简单才能更好的改进网站的可访问性

级联样式就是将每一层级的页面同上下层级的逻辑关系以文件夹同文件的形式梳理清晰,也可认为同一页面中的各个元素的主次关系,使其更有逻辑形成一种可循的规律,同时也是其更加智能化更加灵活是用户体验更加美好

很多网站都没有通过三秒可问性测试——增大字体

第十二章 救命,老板我想要······

当好人遇到不好的设计决策

询问不必要的用户信息会令用户感到不安,减少用户对该网站的信任感。并且会得不到真实的数据信息,并且网站形象会有所下降以及得到完整的信息表更少。 

制作网站的原则

只让用户提供此次操作所必需的信息

不要过多要求填写可选信息

明确告诉用户注册后会得到什么

制作网站不需要视觉很炫酷,但要有表现力,专业,吸引人,在不妨碍网站正常运行的情况下,来做网站的视觉来吸引用户,但要适度。


                                                                                                                                                三米工作室WE团队

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

推荐阅读更多精彩内容

  • 通过最近对《点石成金》等设计书籍的学习,理解,讨论,再总结。个人觉得收获很大,就心思将自己理解以读书笔记的形式分享...
    WZCang阅读 1,981评论 0 13
  • 可用性原则(重点) 1、可用性第一原则:别让我思考。 2、可用性第二原则:点击多少次都没有太多关系,只要每次点击都...
    mooegawk阅读 553评论 0 2
  • 本书简介 这本书的全名是《点石成金:访客至上的Web和移动可用性设计秘笈(原书第3版)》。本书是作者Steve K...
    BIGCONG阅读 1,333评论 6 1
  • 《Don’t makeme think》点石成金-访客至上的网页设计秘籍 ...
    xinxiandong阅读 2,509评论 0 6
  • 《玩转数学》四页。 涂色高频字识认。 爸妈大小已经认识,家是新字。 绘本:《我和老爸》已经开始和我讨论书中内容了。...
    兜妈妈阅读 197评论 0 0