让一个有着平均能力和经验的人(甚至稍低于平均水平)能明白如何使用它——不必付出过度的努力,或者遇到不必要的麻烦。
可用性可以分解为其他几个方面:
- 有用:分否帮助人们完成一些必须的事务?
- 可学习:人们能否明白如何使用它
- 可记忆:人们每次使用的时候,是否都需要重新学习?
- 有效:他们能完成任务吗?
- 高效:他们是否只需花费适当的时间和努力就能完成任务?
- 合乎期望:是人们想要的吗?
- 令人愉悦:人们使用的时候觉得有意思甚至很好玩吗?
指导原则
别让我思考
实际上不需要检查清单,重要的是能快速把自己变成小白,需要思考的地方就能看出来了。
强迫我们思考的地方
- 命名
例如一个招聘网站:按钮分别命名为“jobs”、“Employment Opportunities”、“Job-o-Ramma”需要思考的程度完全不一样。 - 不要让用户花时间思考某个都系是否能点击。
- 我在什么位置?
- 我该从哪儿开始
- 它们把XX放在哪了?
- 这个页面最重要的是什么?
- 为什么它们把它叫这个?
- 这是广告还是网站的内容
人们是如何使用web的
- 不是阅读,而是扫描
- 不做最佳选择,而是满意即可:一旦发现某个看起来似乎会跳转到想去的地方,就会点击,而不会继续寻找。
- 不是追根究底,而是勉强应付:就像没有人会阅读使用说明书一样,只要起作用了,没人会关心原理以及使用方式对不对
为扫描设计,不为阅读设计
- 尽量利用习惯用法:遵循习惯和惯例,使用已经被广为采纳或者已经标准化的设计。除非确定有一个更好的,否则和习惯保持一致。
简洁胜过一致。如果打破一致性可以得到高度简洁清楚的效果,果断选择简洁。 - 建立有效的视觉层次
- 越重要的部分越突出
- 逻辑上相关的部分在视觉上也要相关
- 逻辑上包含的部分在视觉上进行嵌套
- 把页面划分成明确定义的区域:可以让用户快速决定关注哪些区域或者放心跳过哪些区域。
- 明显标识可以点击的地方:因为人们在网络上所做的大多事情是找到下一个地方点击,明确标识哪里可以点击哪里不可以很重要。
- 最小化干扰
三类视觉噪声:- 眼花缭乱
- 组织不当
- 太过密集
- 为文本创建清楚的格式,以便扫描
- 充分使用标题
- 保持段落简洁
- 使用符号列表
- 突出关键词语
必须正确处理的几个方面
设计导航
导航很重要的原因:web上缺少空间的感觉
- 感觉不到大小
- 感觉不到方向
- 感觉不到位置
缺少这些会没有安全感,内心会焦虑,导致快速离开。
访问网站上的内容时,不是靠一种它在哪里的物理感觉,而是记住它在概念层次上的位置,然后重新顺着以往的链接过去。这就是书签和后退按钮用的最多的原因。
所以主页很重要,就像北极星,给了一个重新开始的机会。
- 让导航在每一页以一致的外观出现在同样的位置
- 在每个页面上见到站点ID,通常是左上角
- 除全局导航,提供辅助导航、友好导航(实用工具)。
- 提供搜索:使用“搜索”文案;筛选选项不需要一直出现,可以在结果太多时出现。
- 每个页面都有页面名称:就像指示牌,且与点击的链接一致。
- 突出当前所在位置:告诉用户“你在这里”
- 面包屑:放在最顶层;使用>对层级进行间隔;加粗最后一个元素
- 使用Tab页
测试导航效果的方法
由任意链接进入网站,应能毫不犹豫回答以下问题:
- 这是什么网站(站点ID)
- 我在哪个页面上(网页名称)
- 这个网站的主要栏目是什么(全局导航)
- 在这个层次上我有哪些选择(本页导航)
- 我在导航系统的什么位置?(“你在这里”指示器)
- 我怎么搜索
主页
主页要 传达整体形象,越快越好,越清楚越好。最初的那几秒很重要
进入一个新网站时,主页需要快速解答四个问题:
- 这是什么网站
- 我能在这里做什么
- 网站上有些什么
- 为什么我应该在这里而不是别的地方
如何传达?
- 口号:清楚;长度合适;有个性、生动;
- 欢迎广告:网站的简要描述,显示在主业的首要位置,通常是页面上端的左边或中间,是用户第一眼就会看到的内容。不要把使命陈述当做欢迎广告。
- 了解更多:用户习惯了通过观看介绍视频来了解网站。
第五个问题
快速浏览主页后,应该能准确无误地知道:
- 如果我想搜索,可以从这里开始
- 如果我想浏览,可以从这里开始
- 如果我想看最精彩的内容,可以从这里开始。
在需要一系列操作步骤的网站上,过程的起点应该很显眼。在需要注册/登录的网站,突出闲置注册和登录的位置
大的方面和外界影响
移动端
区别在于阅读量变小,移动的更快。
空间不足意味着要看到同样多的内容要多点出,多滑动,因为移动网站比WEB网站层次更深。
- 没有光标=没有悬停=没有线索
- 应用可学习。
- 应用可记忆:可记忆性可能是影响人们是否会经常使用应用的重要因素。通常刚使用一个应用时,愿意花时间研究如何使用。但如果下次也需要同样的时间学习,会导致再也不用了。
可用性是基本礼貌
降低好感的几种方式:
- 隐藏想看到的信息:如隐藏付费。通过一步步诱导才看到付费页面。
- 因为没有按照网站的方式使用而受到惩罚
- 咨询不必要的信息
- 敷衍、欺骗
-设置障碍
提高好感的几种方式
- 知道人们在网站上想做什么,并简洁易懂
- 告诉用户想知道的:如费用、暂停服务等
- 尽量减少步骤
- 知道哪些可能有疑问,并给予解答
- 容易从错误中恢复
需要正确实施的四件事
- 改正所有让人感到混淆的可用性问题
- 读一篇文章:了解如何让某样东西更好用,方法是观察人们实际如何使用。Guidelines for Accessible and Usable Web Site:Observing Users Who Work with Screen Readers(网站可访问及可用指南:屏幕阅读器用户观察)
https://redish.net/wp-content/uploads/Theorfanos_Redish_InteractionsPaperAuthorsVer.pdf - 看一本书:
- 《A Web for Everyone: Designing Accessible Use Experiences》
- 《Web Accessibility: Web Standards and Regulatory Compliance》
- 一些建议:
- 为每张图片增加合适的alt文本
- 使用合适的标题
- 让表单配合屏幕阅读器
- 在每个页面最前面增加一个“跳转到主要内容”的连接。
- 让所有的内容可以通过键盘访问
- 在文本和背景之间设置明显的对比