Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.
Part of a great user experience is nurturing users’ feeling of control over the user interface (UI) they happen to be using.Users should be able to quickly correct mistakes or backtrack on choices made. The ability to easily get out of trouble encourages exploration, which facilitates learning and discovery of features. It also increases overall use and sales (in the case of exploring a product space). Conversely, when the UI doesn’t support these actions, users feel trapped and typically report dissatisfaction.
该re are several UI controls that typically allow people togo back to the previous state of the system:
- A背部link which returns users to a previous page or screen
- ACloselink which allows users to close a new view
- An撤消option (and a corresponding redo option) to allow users to backtrack on a change to a UI element
Whenever users click a link to open a new page, screen or view, they should always be able to go back to where they came from. On the web, users rely on the browser’s背部button to navigate to the previous page in usability testing, we often see some users defaulting to the browser’s背部button when navigating a website, rather than using the website’s own navigation (such as breadcrumbs). This is one of the reasons why we recommendnot to open links in new tabs indiscriminately因为有些用户没有注意到它们在一个新的标签中并挣扎回去。
Never stop users from leaving your site by disabling the browser背部按钮。有些网站故意使其网站粘性，防止用户返回搜索引擎。虽然用户将在您的网站上贴在您的网站上，但如果使用此策略这种设计选择往往是优先考虑的结果vanity metricsover tangible UX goals. Instead of trapping users by disabling the背部button, sites should offer users valuable content to make them want to stay.
Nonfunctioning browser背部纽扣也可以在某些在线表单上找到，因为向后移动可能会破坏底层逻辑。在某些情况下，用户可以使用浏览器背部按钮但不是返回上一个屏幕，他们收到超时消息并失去工作。在可能的情况，build forms where userscanuse the browser's背部button. If the design makes this impossible, warn users when they click the browser’s背部按钮并为他们提供有机会取消此操作。设计师还应该探索创建一个背部链接或a clickable progress bar that help users move back through the form without losing work.
Meet Users’ Expectations When Using a背部Link
当呈现时overlay or lightbox, users often get disoriented and think they are on a new page — especially where overlays take up the whole screen. Therefore, to return to the previous screen, users often use the browser’s背部button instead of tapping aClose链接或X图标。此动作具有将用户带回两步，而不是一个，导致混淆和迷失方向的效果。
In a recent mobile usability-testing session, a participant used the browser’s背部button on a full-screen overlay and was taken out of the overlayand出于返回的页面。参与者评论说：“我不希望被带出那个页面（......）如果我点击回来，它会把我带出我的页面。它不会让我回到我弹出的页面。“
When it’s possible that users mistake the overlay for a new screen — whether on desktop or mobile —ensure the背部button has the same effect as aCloselink.
In mobile apps, users tend to transfer their knowledge of the背部button from their experience with the web and have the same expectation for it: that is a way to move back a step (from whichever direction the user came). Unfortunately, often designers mean it as a way of moving up in the application’s IA. As a result, users can easily get disoriented. In the example below, a user can swipe right to left to read another news story in BBC News’ app (the order corresponds to the way they’re listed vertically on the news listing page). However, users can’t use the背部button to return to a story they visited by swiping; using the背部button returns users one step up in the IA to the article-listings page, rather than to the previous article they visited.
Like in a physical space,exits should be easy to find and well signpostedso that they will be discovered when needed.
Follow设计标准when positioningClose,出口or取消迹象,这样用户可以很容易地找到它们they typically expect them. For example, on a lightbox overlay, users typically expect an ‘X’ icon in the top right corner of the overlay.
除了放置出口signs in expected places, useuniversal iconsso users understand what the link does.Accompany icons with text labelsor substitute icons with plain text. For example, use背部instead of < andCloseinstead ofX.
Allow Users to Easily Cancel an Action
Whether a user is beginning a purchase, a transfer of money, or a large download, she should be able to cancel that task at any point. The取消选项应该易于查找和快速执行。即使在MultiSep流程中，用户也可以使用背部links in the place of取消, it’s best to provide a取消link to avoid unnecessary clicks.
在移动设备上，一些设计师试图通过使用的空间来节省空间Xicon, instead of取消. Unfortunately, sometimesXcan be mistaken forClose, rather than取消. In some interfaces, it’s important to distinguish the difference between the two to avoid user error. IfX手段Closeand取消, then use an explicit text label (取消)or provide the user with a warning dialogue to avoid losing users’ work.
When a user makes a change to the status of a system, he should be able to easily undo that. Imagine accidentally deleting a whole paragraph of text and not being able to get it back!
撤消can be supported in many ways on an interface, not just through a simple撤消按钮。For example, if users add an item mistakenly to a shopping basket, they should be able to undo that change by removing the item.
If users are likely to make many actions in short succession, support multiple撤消andRedo. Undoing the last action is often not enough. For desktop users, it’s also a good idea to supportstandard keyboard shortcuts for power users.
记住这一点shake-to-undo feature in iOS？这个功能是众所周知的，因为它很难发现。
For desktop designs, don’t assume your users will know that they can use a keyboard shortcut. It’s a good idea to give users a visible option to undo an action on the UI. This feature should be where users typically expect it. In WYSIWYG (What-You-See-Is-What-You-Get) applications like word processors and design software,撤消is usually in the toolbar or in the app’s menus. On web-based applications with nochrome, an撤消选项通常是上下文 - 它可能出现在瞬态零食栏或中contextual menu.
If an撤消option is contextual, ensure it has good visibility in the UI. On Google Drive, when a user makes a change to a file, a snackbar appears in the bottom left corner of the window to confirm the change has been made and to provide an option to undo. Unfortunately, the message only appears for a few seconds. Users would need to know they want to undo and act quickly in order to make use of this feature. (It’s also possible to use keyboard shortcuts, but these are not listed in the UI.)