Skip to main content
141 votes
Accepted

What's the difference between a Modal, Popup, Popover and Lightbox?

All of these UI components are containers/windows that show on top of the content you are currently viewing/interacting with. The different names are based on the attention they deserve, the context ...
Tot Zam's user avatar
  • 5,885
49 votes

Is the ability to finish a wizard early a good idea?

The concept is fine, but "Finish" is ambiguous as a label. It's better to more specific about what will happen if you press the button, for example "Save and exit".
Matt O'Keefe's user avatar
  • 1,860
40 votes
Accepted

Is the ability to finish a wizard early a good idea?

In my opinion it would be better to distinguish between creating and editing the business object. For creation a wizard is fine. Besides the next button it could also have a finish button if the ...
aventurin's user avatar
  • 535
23 votes
Accepted

Are "close" and "x" on a popup redundant?

It may be redundant, but independently of this the real concern should be to evaluate if this redundancy is beneficial, harmful or neutral. Different goals, different designs Do you need a ...
Alejandro Veltri's user avatar
21 votes

Are "close" and "x" on a popup redundant?

I recognize that the web leads to its own problems because it is platform independent, but if most of your visitors are Windows users than using Windows standards might make sense. Here is one page ...
Rick Henderson's user avatar
21 votes
Accepted

UX alternative to Modal Windows on a mobile device

Showing a full page modal window on mobile devices means users may confusedly think they’ve been taken to a new page. Modal windows are typically boxes which contain information relevant to the ...
Dipak's user avatar
  • 16.2k
19 votes

Is the ability to finish a wizard early a good idea?

Keep the Finish button There is nothing wrong with the Finish button because it provides an exit shortcut for users who want to save and finish the process early. Otherwise, users who want to edit ...
Kristiyan Lukanov's user avatar
16 votes

Should video lightbox "remember" the last video position?

If you're going to make the choice for the user, I'd suggest using "Resume" since it's much easier for the user to revert back to the start than it is for them to find their place in the video. An ...
Matt O'Keefe's user avatar
  • 1,860
16 votes

Is using a hyperlink to close a modal a poor design decision?

It sounds as if you are seeking a formulaic answer about a specific button pattern fit for an exclusive purpose and feel that this goal is not being met. Straight off the bat, there is no such ...
Andreas Mehne's user avatar
14 votes
Accepted

Close icon and ok button for dialog

The "OK" button has the wrong word. It should be a "Continue" button, as this is what's required of the user. The user is being asked to acknowledge they're aware of the nature of the warning, and ...
Confused's user avatar
  • 2,258
14 votes

UX alternative to Modal Windows on a mobile device

Something I have gone with in the past is to takeover the whole screen for modals. We built a responsive modal so that on desktop you see the modal in a more traditional overlay, but on smaller ...
JonW's user avatar
  • 37.4k
13 votes
Accepted

Single click versus double to cancel something

As you have pointed out, the double click is not a standard behaviour that your users are familiar with in the situation you are describing. It's not good practice to use non-standard interactions ...
Roux Martin's user avatar
  • 14.2k
13 votes
Accepted

Are modal dialogs WCAG compliant?

There is a section of WCAG 2.0 dedicated to this. 2.1 Keyboard Accessible. https://www.w3.org/TR/UNDERSTANDING-WCAG20/keyboard-operation.html Specifically: 2.1.1 Keyboard: All functionality of ...
SteveD's user avatar
  • 8,914
11 votes

What is the transluscent background of a modal dialog called?

It is refereed to as "modal backdrop" in Bootstrap documentation at Modal / Options
Garik's user avatar
  • 1,994
9 votes

Is the ability to finish a wizard early a good idea?

It is definitely a good idea. I have used this approach - at a particular point in our wizard, the wizard has captured the important stuff it needed, so we allowed our users to finish the wizard ...
SteveD's user avatar
  • 8,914
9 votes
Accepted

How can I avoid triple confirmation modals

Instead of Yes/No answers for the second confirmation modal, provide response options that summarize what will happen for each possible response. For example, in the case of file deletion, use buttons ...
Supra's user avatar
  • 785
9 votes

Why does Airbnb put the close button for a dialog on the top left corner?

Airbnb is a US-based company. Most of its revenue generated in the US itself. Statistics shows that ios is the topmost OS used in the US where the close button is located at the top left. By placing ...
Codesigner's user avatar
8 votes

Close icon and ok button for dialog

As a general principle what you want to achieve is clear, easy, self-explaining, etc... ways for your users to interact with your application. In this type of modal an "OK" or "Close" modal would be ...
Alejandro Veltri's user avatar
8 votes
Accepted

save/cancel dialog from pressing cancel

Use more specific language in your CTAs Perhaps you've got a style guide that might prohibit this, but part of the existing problem is that the microcopy is typically generic. Leave the buttons in ...
dennislees's user avatar
  • 11.6k
8 votes
Accepted

Should clicking outside an important modal close it?

In an enterprise webapp we are developing we make the distinction between: modals: can only be closed through very deliberate action, because closing would break some flow or may cause data loss. ...
wintvelt's user avatar
  • 1,444
8 votes

Plus & Minus button position for selecting number of passengers?

In this context, the '+' on the right is more natural, because of the direction we write. However, if the '-' and '+' were presented vertically, intuition would have the '+' on top, contrary to ...
Alex P's user avatar
  • 266
8 votes

Remember dialog sizes or not?

Not a guideline, but the result of long experience. You should remember the size setting, but not the location. If you need to resize the dialog to see something, you will need to resize it again when ...
UXPinball's user avatar
  • 151
7 votes

Are "close" and "x" on a popup redundant?

Create the main action button (or buttons), but keep the X I worked in web-development for quite some time, this is mostly empirical knowledge that I gathered from user observation. In many ...
nsn's user avatar
  • 188
7 votes

Fullscreen modal vs. conventional modal?

I just went through this same process last week, first starting with full screen modal and then retracting it back to a "standard" modal. TL;DR users will hit the back button in the browser. This ...
Aaron Hudon's user avatar
7 votes

Alternative to Radio buttons

What about a drop-down a.k.a combobox? download bmml source – Wireframes created with Balsamiq Mockups There can be as many options as you like (it is dynamically sized), if the options don't ...
Mike's user avatar
  • 3,125
7 votes
Accepted

Is using a hyperlink to close a modal a poor design decision?

The reason a textual link is used instead of a button is to make it somewhat difficult for the user to delete or cancel unintentionally. The primary button in any form would be the Submit button. To ...
Ren's user avatar
  • 3,196
6 votes

What is the transluscent background of a modal dialog called?

This is called a lightbox effect. It can also be referred to as 'out of focus,' as in, the modal is now in focus and the window behind it is disabled. https://uxplanet.org/best-practices-for-modals-...
Refe's user avatar
  • 608
6 votes

Alternative to Radio buttons

To address your specific concern: Since there is no confirmation it feels odd…. Radio buttons are usually used when you can change your selection before confirming. The solution is to use command ...
Michael Zuschlag's user avatar
6 votes
Accepted

Best practices: Position of cancel button in modals

Besides visually grouping together for users to see available actions in proximity, space in the button bar can be reserved to separate destructive actions, or indicate status. Besides the more common ...
Mike M's user avatar
  • 24.7k
6 votes

Why is a cancel "X" icon required if there is already a "Cancel" option in a modal?

The X button to close a dialog is probably about the most consistent thing users will see across all dialogs, windows, popups, overlays, etc. It's synonymous with the 'get me out of here' sentiment. I ...
Roger Attrill's user avatar

Only top scored, non community-wiki answers of a minimum length are eligible