当前位置 > 首页 > 个人随笔 > Web可用性设计的247条指导方针（下）

Web可用性设计的247条指导方针（下）

2009年07月19日   作者：     类别：个人随笔

169 views | 发表评论

分享到: 百度 QQ空间 微博 豆瓣 人人 开心 QQ书签

译序：
Userfocus
是英国一家专门从事网站可用性设计的咨询培训公司。它为我们分享了247条Web可用性设计的指导方针，并把它们清晰的分为六个大类：首页可用性设计、任务导向、导航和信息架构、表单和数据输入、可信度、写作和内容质量、页面布局和视觉设计、搜索可用性、帮助反馈和容错。如Userfocus所说，“虽然易用性系统的设计远不止应用一些简单的指导方针，但是它们却可以为获取稳定性和好的实践提供有意义的帮助。”

译者：
IIduce，转载请务必以链接形式注明来源。

原文地址：
http://www.userfocus.co.uk/resources/guidelines.html

六、写作和内容质量

  1. 网站有能引起别人兴趣的、独一无二的内容
  2. 正文是简明的，没有不必要的说明和欢迎辞令
  3. 每个内容页应以内容结论或内容意义启示作为开端，正文以倒金字塔方式书写
  4. 相对于叙述式的文本，网页应当优先使用无序列表和有序列表
  5. 列表应当以简短的说明作为开始，帮助用户意识到该列表是如何与其它关联起来的
  6. 那些最重要的列表项应当放在列表的前面
  7. 信息应当分层次组织，从一般的到具体的，组织结构应当是清晰的、符合逻辑的
  8. 内容应当专门为互联网（Web）创建（web pages do not comprise repurposed material from print publications such as brochures）
  9. 产品展示页面应当包含购买须了解的信息，用户可缩放产品图片
  10. 使用超文本适当地组织内容
  11. 以主动语态书写语句
  12. 网页应当易于快速浏览，充分使用标题、副标题和较短的段落
  13. 相对于文本式的语言，优先使用地图、图表、图形、流程图和其它视觉元素
  14. 每个网页都应有描述信息，以及有用的标题，用以支持书签
  15. 链接及链接描述（title）应当具有描述性或推测性，不应当出现“点击我（Click here）”这样的链接
  16. 标题不应当故作风雅、故作聪明或含义隐晦
  17. 链接文本应当与目标页面的标题(title)相符，这样用户就可以在到达目标页面时心里有数
  18. 按钮文本及链接文本以动词开头
  19. 标题和副标题应当是简短的、直截了当的、具有描述性的
  20. 遣词造句及用到的概念应当为典型用户所熟悉
  21. 有序列表从1开始，而不是0
  22. 第一次使用的缩写词汇应当加以说明
  23. 文本链接应当足够长以便于理解、又应当足够短以保证最少换行（尤其被用作导航列表时）

七、页面布局和可视设计

  1. 网线数应当适于目标用户和他们的任务
  2. 布局可以帮助用户把注意力集中在下一步要做的东西上
  3. 在所有页面，最重要的信息（例如经常用的主题、特色和功能）放在屏幕的第一个满屏
  4. 网站在不水平滚动的情况下就可以使用
  5. 可点击的元素（例如按钮），应当设计成明显可点击的样子
  6. 不能点击的元素
  7. 按钮或控件的功能从他们的标签或设计上就可以明显看出来
  8. 可点击图片包含多余文本标签（Clickable images include redundant text labels (i.e. there is no ‘mystery meat’ navigation)）
  9. 超文本链接可以轻松被辨认（例如下划线），而不需要大面积扫视。
  10. 网站字体使用应当具有一致性
  11. 控件和它所具备的操作之间的关系是显而易见的
  12. 图标和图形是标准的和（或）直观的（具体的和为人熟悉的）
  13. 在每一个页面上都应有一个清晰的视觉“起点”
  14. 网站的每个页面共享一致的布局
  15. 网页为打印格式化，或者有一个为打印准备的版本
  16. 按钮或链接能显示出他们被点击过了
  17. 图形用户界面（GUI）组件（例如单选按钮和复选框）应当被适当地使用
  18. 所用字体应当是可阅读的
  19. 网站应当避免使用斜体字，并只为超文本添加下划线
  20. 信息密度和留白应当有一个良好的平衡
  21. 网站看上去应是让人愉悦的
  22. 网页应避免出现“滚动障碍物（scroll stoppers）”（标题或其它页面元素给用户造成在页面顶部或底部的错觉）
  23. 网站应当避免大量使用大写文本
  24. 网站应当有一致性的、清晰可识别的外观和感觉，以吸引用户
  25. 深蓝色避免使用在细节地方（Saturated blue is avoided for fine detail）（例如文本、细线和符号）
  26. 借助颜色组织和分组页面元素
  27. 网站图形不应当与banner广告混杂不清
  28. 对于重要的主题分类加重显示（em）
  29. 在标准宽度的浏览器窗口中，内容页面一行不要太短（小于50字）也不要太长（大于100字）
  30. 页面依据栅格设计，所有页面元素和部件水平对齐、垂直对齐
  31. 有意义的文本标签，令人印象深刻的背景配色，边框和留白的恰当使用，这些一起来帮助用户把网页元素分别出不相关联的功能区域
  32. 网页配色合理搭配，避免过于复杂的背景设计/li>
  33. 较为独立的网页应当避免杂乱不相干的信息
  34. 标准页面元素（例如页面标题、站点导航、页面导航、隐私策略等）可轻松找到
  35. 组织logo放置在每个页面的相同位置，点击logo后返回最合情理的页面（比如首页）
  36. 吸引人注意力的特色元素（例如动画、醒目的色调、明显的字体大小差异）应当保守的使用，并只在恰当的地方使用
  37. 图标（icons）要在视觉上和概念上有所区分，但又要与页面和谐。
  38. 相关信息和功能集中放置，每一组可以在一个视野浏览到（大约直径为4.4厘米的屏幕区域）

搜索可用性

  1. 默认搜索应当是可以直观地配置（没有布尔操作符no Boolean operators）
  2. 在搜索结果页面向用户展示搜索到的内容，并且在该页可以编辑检索词并重新提交搜索
  3. 检索结果应是清晰地、有用的、并依据相关度分级
  4. 检索结果页面应清晰告诉用户检索到多少条记录，每一页显示的记录数可以由用户配置
  5. 如果没有返回结果，系统依据用户输入的检索词存在的可辨认问题提供建议和可选输入项
  6. 搜索引擎可以优雅地处理空检索串的情况
  7. 最常用的检索串可以获得有用的结果
  8. 搜索引擎应当提供模板、示例或提示来帮助用户高效使用它
  9. 网站应当包含一个功能更强大的搜索页面，帮助用户更加完善他们的检索（可以把它叫做“修改检索 revise search”或“精确检索 refine search”，而非“高级检索 advanced search”）
  10. 检索结果页面不显示重复结果（无论是能感知到的重复还是实际的重复）
  11. 检索输入框应当足够长，可以应对常用检索词的长度
  12. 检索应当覆盖整个站点，而不是站点的一部分
  13. 如果网站允许用户创建复合检索，那么这些检索应当是可保存，定期被执行的（这样用户就可以跟踪动态信息的最新动态）
  14. 检索界面应当放置在用户期望的地方（一般是页面的右上区域）
  15. 检索框及他的控件应清晰列出（多检索框可能会难以理解）
  16. 站点既可以满足那些想随便浏览的用户，也可满足想搜索的用户
  17. 在检索结果页面应当明确当前检索的范围，并且用户可以约束这个范围（如果该任务需要的话）
  18. 结果页面显示有用的元信息（meta-information），例如文档的大小、创建的日期、文件类型（word、pdf等）
  19. 搜索引擎提供自动的拼写检查，并提供复数词和同义词查找
  20. 索索引擎提供相似检索选项（例如 “更多相似” 链接）

帮助、反馈和容错

  1. 常见问题解答或在线帮助提供循序渐进地指导，帮助用户完成最重要的任务
  2. 在恰当的地方和恰当的时间可以轻松获取帮助
  3. 提示应当是简洁的、表达清楚的
  4. 用户不需要求助于用户手册或其它外部信息来使用站点
  5. 网站有一个定制的404页面，该页面包含如何找到要找页面的提示，并包含主页和和检索页面的链接
  6. 网站在必要时（例如校验时）提供良好的反馈信息（例如进度提示或一些信息）
  7. 用户在选择商品时可获取到帮助
  8. 用户在执行由潜在“危险”操作（例如删除什么）之前提供用户确认
  9. 用户确认页面是清晰地
  10. 错误信息包含先一步该做什么的清晰指示
  11. 在提交购买的前一个时刻，网站向用户清晰地展示概览页面，这个页面应当与购买确认页面区分开来
  12. 当用户需要在不同的选项（例如在一个对话框）前抉择时，这些选项应当是明确的
  13. 在网站响应时间时产生的不可避免的延迟应当告知用户（例如授权信用卡交易时）
  14. 错误信息以非嘲弄的语气书写，并且不要责怪用户的错误
  15. 页面可以快速加载（5秒或更短）
  16. 网站提供对用户输入或其他操作的及时反馈
  17. 在加载比较慢的大页面应当提示用户（例如：“正在加载……”），最重要的信息应当首先显示
  18. 当使用工具提示条（tool tips）时，应当提示对用户有用的额外帮助，而不是简单的重复图标、链接或字段域标签中的文本
  19. 当给用户一些帮助提示时，告诉他们要做什么，而不是避免做什么
  20. 网站在适当的地方向用户展示如何做常见任务（例如：提供网站的功能示例）
  21. 网站通过提供反馈信息（例如“您知道吗？”），帮助用户了解怎样使用网站
  22. 网站提供上下文敏感帮助
  23. 帮助应当是直截了当的，用直白简单的方式表达，避免使用行话和流行语
  24. 当一个任务成功完成后，网站提供清晰地反馈信息
  25. 必要时重要提示信息应当在屏幕上保留，使用户有足够时间记录下这些信息
  26. 遵循“菲茨法则”（控件之间的距离和控件的大小应当是适宜的，大小与距离成比例）
  27. 目标对象间有足够空间，防止用户点击了多个目标或错误的目标
  28. 可点击元素之间至少有两个像素的距离
  29. 当网站发生错误时，应当是显而易见的（例如，当表单未完成，高亮未完成的表单域）
  30. 网站提供适当的选择方式（例如下拉列表）来代替用户输入
  31. 网站应努力把防止用户出错的工作做好
  32. 网站在纠正用户错误输入前提示用户（例如，google的“您是不是要查找…”）
  33. 网站应当确保任务不是令人困惑的
  34. 错误信息应当用直白的语言描述，并给与问题足够的解释
  35. 用户在一个任务中可以推迟解决错误至一个较晚的时间
  36. 如果有必要的话，网站提供错误信息更多的细节
  37. 可以非常容易撤销（或取消）、重做（Redo）操作

责任编辑：moby

相关博文

标签：,

相关日志

给作者留言：