it-swarm.cn

确定/取消左/右?

应该 OK 按钮在左侧 Cancel 按钮,反之亦然?

是否有任何研究建议这两种解决方案?

349
Art

与所有内容一样:用户测试!值得庆幸的是,可用性英雄Jakob Nielsen在他的 Alertbox有关OK/Cancel按钮 的文章中跳了出来:

确定按钮应该在取消按钮之前还是之后?遵循平台约定比对单个对话框进行次优化更为重要。

Kostya在建议遵守平台准则方面是正确的。但是基于Web的平台呢?

如果您正在设计基于Web的应用程序,那么决定会比较困难,但是您应该选择大多数用户首选的平台。服务器日志将显示特定网站或Intranet的Windows用户与Mac用户的百分比。当然,Windows通常会有更多的用户,因此,如果您不愿意检查日志,那么适用于大多数情况的准则是首先确定,然后是取消。

他还提到了创建“确定/取消”按钮时可能要考虑的两个其他重要准则:

  • 命名按钮以说明其作用通常比使用通用标签(例如“确定”)更好。明确的标签用作“及时帮助”,使用户更有信心选择正确的操作。
  • 将最常选择的按钮设置为默认按钮并突出显示它(除非其操作特别危险;在某些情况下,您希望用户明确选择按钮,而不是通过按Enter意外激活它)。
202
Rahul

答案在所用系统的用户界面指南中。

对于Windows

按以下顺序显示提交按钮:

  • 确定/ [执行] /是
  • [不做] /否
  • 取消
  • 申请(如果有)
  • 帮助(如果有)

因此,“取消”始终位于“确定”按钮的右侧。

对于MacOS

发起动作的按钮最右侧。 “取消”按钮在此按钮的左侧。

因此,对于MacOS用户,“取消”位于“确定”按钮的左侧。

对于 Android

对话框的轻蔑动作始终在左侧。轻蔑的操作会使用户返回到先前的状态。

肯定行动在右边。肯定行动将继续朝着触发对话框的用户目标迈进。

对于Android,“取消”位于“确定”按钮的左侧。

对于其他系统,请参阅准则。

142
Kostya

想想“读书”的隐喻。西方人从左到右阅读,我们的大脑习惯于从左到右流动。 CANCEL本质上是向后退一步(左),OK/SUBMIT/YES/Etc。是向前退一步(右)。

64
GoodShovel

Windows OK/Cancel约定似乎为用户做了大量的大脑调节工作。因此,可用性测试肯定会引起很多人的注意寻找左侧为OK按钮,右侧为Cancel。

但这并不会改变没有任何前提条件就与系统进行交互的人的最基本本能。我的基本直觉是,“确定” /“批准” /“前进”按钮,无论您应用哪种颜色或大小,都必须位于对话框的右侧。

考虑以下对话框,其中没有标签或颜色突出显示:

enter image description here

您在哪里点击?如果要提交表单,请单击右侧“边缘”上的按钮。原因是,在Windows之前,我已经通过以下几种方式适应了本能:

  • 英语从左到右流动。
  • 浏览器的导航功能为向后(向左)和向前(向右)。 enter image description here
  • 危险的戴夫(Dangerous Dave)等旧的2D游戏在进一步发展时会将角色向右移动。

enter image description here

  • 编号线上的数字向右增加,向左减少。

  • 元素周期表上的原子权重向右增加。

  • 时钟在右边滴答作响。

  • 日历在右边增加日期。

我认为Windows平台已使用OK/Cancel创建了一个反模式,该反模式现在已经非常广泛,以至于它验证了可用性研究。但是,如果考虑到上述因素,我认为将主要按钮保持在右侧是合理的,也是可以辩护的。

编辑:要考虑的另一个因素是一致性。如果您希望对话框中有其他按钮,则右侧边缘上的主按钮将有助于与放置位置保持一致。一个直观的示例将使这一点很清楚:

enter image description here

39
Adnan Khan

对于从左到右阅读语言的用户,我建议将“确定”按钮放到左侧,因为这些用户将更加重视他们所看到的第一件事。

这将允许该用户子集尽快完成其任务。

17
Ryan Shripat

恕我直言,将“确定”按钮放在何处并不重要:向左或向右。什么样的用户访问您的网站(使用希伯来语或阿拉伯语)都没有关系。他们使用哪种软件都没有关系。统计信息告诉我们,有55%的用户希望从右侧看到“确定”按钮,但是如果我们将其置于右边,则其他45%的用户将不满意。

最佳解决方案是强调“确定”按钮(使其比“取消”更突出),所有用户将轻松地将“确定”按钮表示为更重要和主要的按钮。

Google和其他公司在其软件中使用这种方法。

enter image description here

16
webvitaly

Luke Wroblewski写了一本有关Web表单的书(Web表单设计:填补空白),他还介绍了一些原则,例如:“主要和次要操作”(http://www.lukew.com/resources/articles/psactions.asp ),“顶部,右侧或左侧对齐的表单标签”(http:// www.lukew.com/ff/entry.asp?504)或“完成路径”等(您也可以阅读 http ://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php

因此,IMO会根据您的标签放置位置(垂直方向最好)以及从左到右+自上而下的规则,为了获得良好的完成路径,应首先放置主要动作(OK),然后放置次要动作(+ +取消)

编辑:表单中的标签放置,作者Caroline Jarrett,2010年 http://www.formsthatwork.com/files/Articles/labels-on-forms-for-uxlx-2010.pdf

15
Ecaterina Moraru

我认为每个人都给出了很好的观点,但是这里还有另外一个要点。

诸如“确定/提交/保存”之类的按钮称为“积极行动”按钮。类似地,诸如“取消/重置”之类的按钮被称为否定动作按钮。

现在回答该查询,其中大多数都具有一些优点,但这是另一种看法,即对应用程序的用户测试通常会决定大多数问题。毕竟,所有创建的应用程序仅供用户使用。

对用户进行了一些眨眼测试和热测试,但仍取决于实验室的可用性。出现最好的情况是,大多数用户开始从左至右和从上角开始查看Web应用程序或任何其他应用程序,并开始向底部滚动以拾取关键热点,并且通常向左底部结束,因此始终将正面动作按钮保持在左侧,将负面动作按钮保持在右侧始终是一件好事。

同样,不否认这些是基于很少用户的研究,没有必要始终保持良好状态,但在大多数情况下会保持良好状态。

这里还有一个关键点,就是在正向和负向操作按钮之间应留有更多的空间,这样用户将花很少的时间到达负面按钮,从而使他们有足够的时间去思考和做出反应。

我试图根据我的经验和研究论文来解释几点。

做评论,这样我也可以了解更多。

问候Deepak Bajaj

9
Deepak Bajaj

许多应用程序已在转变为对“确定”与“取消”按钮使用不同的样式。一种常见的UI是具有“确定”按钮,但具有传统按钮,而“取消”是一个链接按钮。这在两者之间提供了非常清晰的视觉区别,即使它导致用户单击“确定”,该视觉区别最终还是突出显示了区别,并帮助用户选择了他们实际想要的区别。

我已经在Web和桌面应用程序中看到了这一点。

7
Sam

只是为了阐明原因:

将主按钮(OK)放置在对话框的确切角上被认为是“更正确”的选择,因为单击起来比较容易(过去有过一些疑问/讨论)。

但是,这也取决于用户的习惯-如果要为Windows用户创建站点或应用程序,则最好遵循Windows标准。

确保键盘上的“ Enter”与OK正确关联-很多人也会使用它。

5
Dan Barak

哇!这么多的答案左右争论。

我自己对此进行了测试,发现它们在统计上没有定论。

我发现的最佳答案是,只要明确标记了主要动作,它们按什么顺序走就没关系-我总是对[Do it]/go/submit/etc使用彩色按钮,而仅使用较小的文本[请勿执行] /取消/清除/等按钮。

非常类似于UX StackExchange上答案表底部的“发布答案”和“放弃”按钮!

4
Andrew Martin

您会发现一个有趣的意见 here ; Anthony T.建议将“确定”按钮放在“取消”的右侧比较好:

使用右侧的“确定”按钮,视觉注解更少,并且沿一个方向流动[...]

将其与位于对话框右侧的主要操作和位于左侧的次要操作进行比较。用户首先将眼睛放在次要动作上,然后将眼睛移到主要动作上以单击按钮。这在一个方向上总共创建了两个视觉固定,从而为用户提供了更快的视觉流动。用户只在每个按钮上固定一次,然后在主要操作按钮上结束。将主要动作放到左侧可能会使用户更容易触及,但是从用户的心理过程和视觉注视角度来看速度时,将主要动作放在对话框的右侧实际上会更快。

4
Claudiu Constantin

对于ASP.NET Web应用程序,在使用大量阿司匹林处理默认按钮问题(按下Enter键时将触发的一切)之后,我只是将默认按钮放在左侧,使其位于标记的第一位。

当按下Enter键时(尤其是在按下Enter键时光标位于文本框内),不同的浏览器将以不同方式处理多个提交按钮。某些浏览器将仅使用标记中的第一个按钮来提交表单,这可能不是您想要的(特别是如果您随后需要在服务器端执行某些操作)。

如果您没有使用自定义JavaScript来处理默认按钮情况,而是依靠Web浏览器的默认行为,那么您应该将默认按钮放在左侧。

4
Adam Toth

如果可能,我建议您完全省略“取消”按钮,从而解决您的难题。 -有时是不必要的,并且经常被错误激活。

http://www.nngroup.com/articles/reset-and-cancel-buttons/

如果删除了“重置”按钮,则大多数Web表单的可用性都会得到改善。 取消按钮在Web上通常也没有什么价值

当用户可能担心自己做出了自己想避免的事情时,请提供“取消”按钮。拥有明确的取消方法可以提供额外的安全感,而这仅仅是离开就无法提供的。

对于用户执行进度超过一个或多个页面的多步对话框,“取消”主要有用。这时,按“后退”按钮将不会撤消这些操作,如果用户单击“取消”会更好。

4
Adam George

最终(尤其是在阅读了以上所有答复之后),我看到此讨论可以归结为平台惯例与“客观”可用性的关系。我所说的“目标”是指对于不熟悉任何操作系统约定的用户而言,某些东西的可用性。进一步来说:

右边的OK
如果用户不习惯使用不太常用的Windows约定(请参阅 article ),则这种模式在客观的可用性争论中毫无用处。正如文章所讨论的那样,使右侧的OK与我们的从左到右的阅读约定相一致,更高效的任务流是一个更好的目标,也是事实,我们认为时间轴从左到右运行(因此右侧的“后退” /“取消”很有意义,因为它是一种时光倒流的模式。

左边的行
Windows约定

这是一个不幸的现实,但是设计不当的模式(例如左侧的OK)可能会成为惯例,并且用户会期待它们。尝试做其他事情,即使从客观上讲这是一种更有用的模式,也会导致可用性不佳。一个典型的例子是公制与英制测量系统-公制具有可用性,单位转换容易等方面的所有功能;但是如果您强迫小城镇的美国人习惯习惯英寸/英尺,那么他们会以米和厘米为单位进行思考,那么您将获得较差的可用性和非常沮丧的用户。我想这课是要努力工作,以确保我们一开始就不会引入不良约定!

就个人而言,在设计网络时,我选择将“确定”按钮放在左侧,即使在与有思想的人们交谈时,我也坚持要以厘米为单位表示体重,以千克为单位表示体重。确实,这是一场消耗战,但是帝国体系会慢慢消失,希望“左行”约定的窗户也会消失:)

3
M.A.X

我将在右侧使用“确定”。由于西方阅读的方向是从左到右。 “取消”不会带您前进,但“确定”可以。

但是完全不同的方法。不要使用“确定”并在按钮上写下它们的作用。例如,“保存”或“不保存”不需要用户阅读描述文本。节省时间并防止输入错误。

2
erikrojo

大声笑我不禁为许多这些答案而笑。好像是没有为树木找森林的情况。像每个UX问题一样,从根本上说,它取决于表单的布局方式。例如,“顶部标签”,“下方标签”或“左侧标签”。查看整个页面以及用户的视线如何从表单中流下来。最终的“提交”按钮是否清晰可见?

如上一本关于网络表单Web表单设计的Luke Wroblewski书中所述:填充表单包含一些Web表单创建方面的最佳建议,以及从用户角度出发的出色的表单范式-表单是达到目的的一种手段并且由于预期的最终结果而被容忍(即购买东西,创建帐户以访问某个地方等)。用户测试,AB测试当然可以。最终目标是表格越容易填写越好。

2
mike

我真的很喜欢某些网站上没有按钮(视觉上)采取负面行动,只有一个链接。这样,我不必浪费时间在查看按钮上,我更不必知道按钮了。而且,如果我知道我不想做页面要我做的事情,那么我会花一些时间看一下如何继续进行下去(查找关闭按钮,取消按钮)

所以代替:

[NOOOOO!] [点击我!点击我!]

那里将会是:

不,谢谢! [是,请!]

这样一来,将按钮放在何处并不是很重要,在视觉上只有一个,因此易于定位。

1
fallenboy

在我的应用中,我使用视觉颜色突出显示操作按钮的目的。然后,无论它是左还是右。我个人更喜欢右侧的“确定”按钮(因为我是惯用右手和/或osx的用户-实际上这是链接。)

  • 大绿色按钮用于验证
  • 红色大按钮删除
  • (大或小)灰色按钮,用于取消
1
Marc D

对我来说,这将是逻辑顺序:

<LeftRight>

<PreviousNext>

<BackForward>

<BackDone

Do nothingDo it

CancelOK

除非确定应替换为实际操作,例如 SaveDeleteAcceptExit 要么 Send

当我遇见有人争论推销 OK 在左侧,我总是要求他们放置 Left 与 Right, Previous 与 Next和 Back 与 Forward,然后让他们争辩为什么将他们按顺序排列,然后让他们争辩为什么 OK 应该在左边。

1
Ole Tange

按照优先顺序,使用第一个可用的解决方案:

  • 平台指南
  • 开始到结束(通常以西方语言开头,但是可以不同,例如阿拉伯语从右开始,然后从左结束)
  • 用户最期望的方式

但是,对于屏幕阅读器和类似的辅助功能工具而言,一开始就采取主要行动(西方文化不遗余力)可以为此类特殊需求的用户节省大量时间!

1
straya

当然,双方都有很多反对意见。

我会这样说。 “您认为负阳性安置是最好的吗?是或否?”

关键是说出来时“是或否”会更好,这可能解释了为什么Microsoft选择了正负按钮顺序。

另一方面,在修辞和辩论中经常使用负向正向流动,以增加正向论据的分量并使其在人的脑海中保持新鲜。 “您是否想让孩子遭受对方的折磨?​​还是想为我们的政党投票并确保自己的未来?”等等。

0
Seth Jeffery

假设需要决定是在左侧还是在右侧采取积极行动,并且不考虑使用某些操作系统或物理设备(书籍),抽象结构(向导形式流程)等的偏见,行为科学似乎暗示统计上最左边的选项被更频繁地选择为首选。

这意味着如果不考虑其他因素,则应首选在左侧放置正面动作(OK或明确的动作标签)。

来源: 难道只有人类从左到右计数吗?

0
too