服务器君一共花费了220.211 ms进行了6次数据库查询,努力地为您提供了这个页面。

Most Web forms would have improved usability if the Reset button was removed. Cancel buttons are also often of little value on the Web.


It is one of the most basic heuristics for interaction design to support user control and freedom by allowing users an "emergency exit" out of any situation they may have entered. Undo was truly one of the greatest advances in usability.


The basic rule says to support undo; it doesn't say how. More specific rules are needed for different types of user interfaces:

  • In window-based GUI applications, it is standard to have a Cancel button that closes any dialog box and discards any changes the user may have made within that dialog box. A great way to support exploratory learning. Compare with older systems where you were trapped if you ever activated the wrong command.
  • In editing systems it is usual to have an Undo command that makes the document revert to the state before the user's most recent changes. Sometimes, multi-level undo and redo is supported: this can be very useful but confusing.
  • 在基于窗口环境的用户界面中,取消按钮可以让用户通过对对话框的操作,实现探索性的学习。相比较而言,你在老些的系统中下达了错误的命令往往意味着你将陷入绝境。
  • 在编辑系统中通常会有撤销命令来使文档回复到用户编辑之前的状态。有时,多级撤销和重复命令是很有用但又令人困扰的功能。

The Reset and Cancel buttons are the Web's attempt at mirroring these features, but users usually prefer to use the Back button instead when they want to escape from an undesired state.


Reset: Don't Use 不要使用重置按钮!

The Web would be a happier place if virtually all Reset buttons were removed. This button almost never helps users, but often hurts them.


Reset clears away the user's input on a Web form, but why would people want to do that? The Web is characterized by frequent movement between pages and users rarely encounter the same form twice. Thus, a Web form is almost always cleared when the user sees it. Even when a user revisits a form in a single session, it is usually faster to edit the old data than to erase it and start over.

重置功能会把用户输入到表单中的所有信息清除掉,但为什么用户要使用这样的功能呢?用户浏览网页的时候会在页面之间频繁转换,他们很少重复访问相同的表 单,因此,表单在呈现给用户的时候就是干干净净的。而当用户使用相同的进程重新访问一个表单时,编辑原有的数据往往比重新填写更便捷。

The Reset button hurts users in three ways:


  • The worst problem about Reset is that users click the button by mistake when they wanted to click Submit. Bang - all your work is gone!
  • Having two buttons at the bottom of a form clutters up the interface and makes it harder for users to clearly see their next step. Some small amount of wasted time is spent scanning the useless button and deciding which of the two buttons is the correct one.
  • Even when users do want to eliminate some of the data they have entered into a form, it may slow them down to have a dedicated button for doing so, since the extra button means that users have a choice:
    • edit the erroneous fields and replace the old text with the new text
    • click Reset and type the new text into nice clean fields

    The extra choice requires extra thinking, and the time saved by using an optimal interaction technique is often smaller than the time wasted on having to think instead of just moving ahead with a single interaction technique that is always used. It takes at least one second and often two seconds to decide between two possible interaction techniques which is why it is usually better not to offer users a choice. (A second may not seem like much, but it translates into about $100 million in lost productivity per year world-wide.)

  • 最糟糕的问题是用户想点击提交却误点了重置,他们填写的信息将一下子付之东流。
  • 在表单底部提供两个按钮将混淆交互界面并让用户难以搞清下一步要做什么。用户会把一小部分时间浪费在浏览无用的按钮和决定哪一个才是该点的上面。
  • 当用户希望在表单中修改已经填写的信息时,面对额外的按钮会做出以下两个选择:
    • 在输入框中修改不正确的内容
    • 点击重置,在清空的输入框中重新填写内容

    额外的选择会迫使用户进行额外的思考,而使用最佳的交互方式所节省的时间往往小于用户考虑决定使用最常用的方式所花费的时间。这将浪费用户一到两秒的时间来从中取舍,这也是 尽量不要让用户选择的原因。(一秒钟听起来没什么了不起,但它意味着每年一亿美元左右的生产力浪费。)

Make All Form Entries Undoable 让所有输入可撤销

To eliminate the Reset button, it becomes necessary to offer users another escape route for erroneous form entries. In the case of text fields or check boxes, the user can always erase the entry and revert to the original state.


Unfortunately, some Web forms use radio buttons and pull-down menus in a non-standard manner and do not offer a neutral choice. A classic design mistake on the Web is to have radio buttons that initially do not have a selection. Often, there is no way for the user to select a "nothing" option, once he or she has selected one of the choices. Always include an explicit radio button for the default choice and always include a selectable menu entry in pull-down menus for the default choice. Otherwise you do trap users. (See also all 13 guidelines for checkboxes and radio buttons.)

不幸的是,有些使用了非标准风格的单选框(radio button)和下拉菜单的表单并没有提供回到初始状态的选项,而这是网页设计的典型错误之一。往往,一旦用户选择了一个选项,就没有办法作出“什么都不选” 的选择。永远别忘了在单选按钮和下拉菜单中加入明确的默认选项,否则你用户的麻烦就大了。

Exception: Use Reset for Repeated Form-Filling 例外:重复输入表单的重置按钮

Reset can be useful for forms that satisfy both of the following criteria:


  • the form is filled-in repeatedly by the same user
  • the data to be entered differs significantly from one use of the form to the next
  • 表单总是由一个用户反复填写
  • 填写的内容每次都有较大差异

Even if a user were to use a form frequently, the reset button would still not be necessary if the data was mostly the same from one use to the next. In these cases, it would be easier for the user to edit the old data than to erase it and start from scratch.


Cancel: Use Sparingly 保守地使用取消按钮

The Web is not an application environment, and it usually doesn't have dialog boxes. Instead, the Web is a navigation environment where users move between pages of information. Since hypertext navigation is the dominant user behavior, users have learned to rely on the Back button for getting out of unpleasant situations. Whenever users arrive at pages they don't want, they slam their mouse directly onto the Back button.

网页并不像软件一样拥有对话框,而是一个用户游走于各个页面之间的导航环境。自从超文本导航成为用户的使用习惯,人们开始依赖后退按钮来逃离窘境。 每当用户误入了不想进入的页面,他们就会自然而然地把鼠标放到后退按钮上。

Because Back is such a strong behavior on the Web, it is usually not necessary to offer explicit Cancel buttons. If the user asks for something but doesn't want it, then you can be sure that it's Back button time.


Offer a Cancel button when users may fear that they have committed to something they want to avoid. Having an explicit way to Cancel provides an extra feeling of safety that is not afforded by simply leaving.


Cancel is mainly useful for multi-step dialogs where the user has progressed past one or more pages with actions. At this time, pressing the Back button will not undo these actions and it would be better if the user would click Cancel.


Of course, one cannot rely on having the user click Cancel, even if it is offered, so the back-end logic must be able to handle abandoned multi-step dialogs where the user decided to leave through the use of the Back button. This added complexity is one of the reasons I don't recommend trying to implement advanced applications inside a Web browser. It is better to use another form of Internet-enabled applications.

当然,不能指望用户每次都点取消,应该有一个后端/后台逻辑来处理点击后退来中断多步输入的行为。额外的复杂性是我不推荐在网页中加入复杂应用的原 因之一,更好的办法是使用另一种形式来实现。

Remove Button in Shopping Carts 购物车中的移除按钮

It is necessary to have a special button in shopping carts for removing a product. Users cannot be assumed to understand that they can cancel a purchase by buying zero copies (even though this technique should be supported as well since it does not interfere with users unless they decide to use it on their own initiative).

很有必要在购物车中添加特殊的按钮来帮助用户移除商品,我们无法知道用户是不是了解他们能够通过购买“0”件商品来取消购物。(但是反正这个小技巧 也不影响其它用户,所以还是应该实现出来给懂的人用)

Clarification: When Cancel Is Necessary 到底什么时候使用用取消按钮

Lisa Padol asks:

Lisa Padol 问道:

When you talk about cancel and reset buttons, you do not mean the stop (as in "stop the page from loading") and reset/refresh buttons, correct?


I presume it's not only acceptable, but also required to have a cancel button for things like downloading files?

She is correct in both assumptions. The browser's Stop button is a great example of a technique to increase the user's control of the dialogue. Same for a way to interrupt file transfers or any other actions that take more than a few seconds. Designers must include such features in any applets or other design elements that can take time.

她的假定完全正确,浏览器的“停止”按钮很好地加强了用户的控制权。而对于文件传输和其它一些得花好几秒钟的操作也应该这样做。设计师必须给 Applet(网页上的Java应用)和其它耗时的设计元素都加上停止功能。





小提示:您可以按快捷键 Ctrl + D,或点此 加入收藏






《数据结构与算法分析:C++描述(第3版)》 维斯 (Mark Allen Weiss) (作者), 张怀勇 (译者), 等 (译者)