Cancel vs Close: Design to Distinguish the Difference
Long ago, the symbol X meant “this is where the treasure is buried.” In today’s digital interfaces, X no longer marks the spot, but rather functions as a way for users to cancel a process or to dismiss an interim screen. How can one tell for sure whether the X means cancel or close? Sometimes, unfortunately, you can’t.
The main issue lies with the common lack of a text label for the X icon. When an icon represents multiple meanings in similar contexts across different interfaces, icon usability suffers because users cannot rely on any single interpretation.
Avoid Losing Users’ Work
To avoid losing users’ work, systems need to determine the user’s intent — cancel or close — and provide clear options.
This goal can be accomplished by one or more of the following:
- Asking the user to confirm their intention
- Using explicit text labels rather than ambiguous icons
- Presenting two distinct buttons:X for closing the view (with the side effect of saving intermediate work) and Cancel for abandoning the process
1. Ask for Confirmation
2. Use Explicit Labels
3. Favor Close & Save
Note that saving intermediate work or maintaining an ongoing process before closing is proactive, but sometimes can be contrary to the user’s intention: If users intend to cancel their selections by clicking the X button, auto applying those selections could be confusing and frustrating. This is why it’s critical to also include a separate Cancel button, to give users an out rather than forcing them to only save and close the view.
While the X icon is ambiguous and can often cause usability problems, it’s unlikely that it will disappear from all interfaces any time soon. Designers should be aware of the multiple meanings of the X icon and disambiguate between close and cancel, as well as provide safeguards such as confirmation dialogs or autosaving to avoid losing any users’ work.
Remember, when in doubt, save, then out.
Refer : NN Group: Cancel vs Close: Design to Distinguish the Difference