多按钮共存——don’t make me think

作者:死猫 来源:Tencent CDC Blog 时间:2010-01-11 20:20:00 

之前在一个web系统的设计中,和另一个设计师讨论,“保存”和“取消”按钮该怎么设计。我的观点是,保存是比取消更常用的按钮,也是用户的主要目的(用户不会为了取消来使用表单),所以在视觉上,保存按钮应该比取消按钮更醒目,这样更容易被用户先看到,从而提高用户的效率。

  下图:Google analytics系统中,Apply以按钮的形式表现,cancel以链接形式表现

后来碰巧看到Luke Wroblewski写的“Primary & Secondary Actions in Web Forms”这篇文章。作者把“提交”、“保存”,“继续”这样的按钮定义为主要动作。因为它们是用户操作表单的主要目的,而“取消”、“重置”、“撤销”这样的按钮定义为次要动作,因为这些动作不是操作表单的主要目的,并且它们的点击效果是负面的。

作者一共设计了6种视觉形式,并通过眼动仪来测试哪种表现最好。结果有点出乎我的意料,视觉上不区分主要动作和次要动作的设计方案,用户完成表单的速度最快。但即便如此,作者仍然建议采用视觉提示更明显的方案:“按钮+链接”。

想更进一步讨论下,为什么会有这个问题。按照don’t make me think的说法,在没有选择的情况下,用户更容易快速地做出决定。或者不应该说是决定,因为本来就不需要用户去判断。没有多余的按钮吸引注意力,也没有多余的按钮可以点,用户不假思索地就完成了操作。比如当“下一步”按钮独立出现时,用户往往点得很愉悦。

下图:独立出现的“下一步”

但是当按钮成对或者多个出现时,问题就来了,用户必须看完所有的按钮文字,才能做出判断,这无疑是设计师不愿意看到的。所以会在按钮上做一些引导,客户端比较常见的做法就是把最常用的按钮或者主要操作的按钮设为焦点状态。

标签:按钮,web设计,用户体验
0
投稿

猜你喜欢

  • CSS教程:简单理解em

    2008-07-03 12:44:00
  • 如何实现某些页面只让特定的用户浏览?

    2010-05-19 21:42:00
  • 瞬间的设计(四)【碳酸饮料会】

    2009-12-23 13:56:00
  • 一次MySQL性能优化实战

    2009-03-09 15:01:00
  • CSS Expression 的优化

    2009-09-24 13:27:00
  • mysql 主从服务器的简单配置

    2009-09-06 12:06:00
  • javascript浮点数计算的bug

    2009-12-06 11:43:00
  • asp下以Json获取中国天气网天气的代码

    2011-03-06 11:01:00
  • Web内容写作:得到更好稿件的头15条规则[译]

    2011-06-09 14:38:00
  • 如何做迅雷电影提示效果

    2011-03-31 17:15:00
  • 各个版本IE合集下载,共存无冲突

    2007-11-29 13:12:00
  • 根据表名和索引获取需要的列名的存储过程

    2011-09-30 11:54:42
  • ASP编程入门进阶(十四):Browser & Linkin

    2008-06-12 07:08:00
  • ASP模拟POST提交数据的方法

    2010-01-14 20:06:00
  • 谈谈设计师的发展

    2009-03-17 18:20:00
  • Microsoft SQL Server 安全问题

    2010-07-26 13:20:00
  • javascript让浏览器实现复读机的功能

    2008-10-10 11:49:00
  • javascript面向对象技术基础(四)

    2010-02-07 13:15:00
  • 用css+js给网页背景插入flash播放器

    2007-10-21 09:27:00
  • 标签水平右对齐更适合中文网站

    2009-05-01 11:54:00
  • asp之家 网络编程 m.aspxhome.com