9

Currently on our application we have popup/lightboxes that have a close button in the top right corner, and some of the lightboxes have cancel buttons next to the submit button - in the case of a form. We also close the lightbox when a user click outside of the lightbox.

My thinking is we are creating a confusing UX, also adding challenge in programming, by letting the user close the lightbox by clicking outside the lightbox. We want them to make a decision once the box is open.

I want to remove the feature of clicking outside the box to close it, leaving the close icon in the top corner and cancel button. Is this a good idea?

Improve this question
1

5 Answers 5

Reset to default
9

It largely depends on what the dialog is doing, but generally yes, leave as many exit vectors for a modal dialog as possible. As long as other modal dialogs close with the Escape key and clicking outside the window, people will assume yours will too. Clicking away is a common reaction to "Oh, I didn't mean to do that". Forcing the user to interact with the dialog seems much more risky.

It sounds like you might be trying this solution because this is a form and you don't want users to lose their info if they accidentally click out; instead of disabling click-out-to-close

The rare exception is when the user really really shouldn't be able to exit the modal dialog. This should be very rare, but it's appropriate if not acting could be very dangerous. That's quite uncommon; usually doing something is the dangerous sate, rather than not doing anything. On a related note, with destructive actions it's best to give as many exit vectors as possible.

Improve this answer
3
  • Our application has about 10 - 15 situations where the modals ask for information. 5 of these are crucial, whereas the user would be more confused if the box was close unintentionally. What about consistency? Some would close differently than others within our application.
    – bweikulrich
    Commented Jun 29, 2012 at 20:32
  • 1
    "you don't want users to lose their info if they accidentally click out; instead of disabling click-out-to-close"… what? Don't leave us hanging!
    – Kit Grose
    Commented Jun 30, 2012 at 13:18
  • 2
    For what it's worth, throwing up a JS confirm("Closing this form will discard the information you've entered") is a good idea regardless of how the user dismisses the lightbox.
    – Kit Grose
    Commented Jun 30, 2012 at 13:21
6

It is faster for the user to close the popup dialog by clicking outside. Outside area has a bigger clicking area than a close button and smaller distance to the cursor/finger (Fitt's law). Since some users may not know that closing outside also dismisses the popup so having a Close button is good as well. I don't really see how ability to easily exit adds confusion.

Improve this answer
2

It depends...

  • If the dialog contains user inputs, don't close the dialog on click outside because...

    What happens when the user closes it - are the inputs saved/applied or lost? - The user might end up confused or worried. (Especially if there was a lot of input (what if it was lost) or the user didn't want to keep the input (what if it was saved).)

  • If the dialog is a enlarged view from a list, do close the dialog on click outside because...

    The user want to be able to quickly move to another item.

If you do enable clicking outside to close the dialog, leave a margin around it (can be seethrough) were the clicking doesn't close the dialog. - This will help prevent sausage finger mistakes.

Improve this answer
2
  • I like this answer. The question was discovered observing frantic and accidental clicking by users.
    – bweikulrich
    Commented Jun 29, 2012 at 23:32
  • @bweikulrich, with the latest phone models this is even more extreme - there is barely any non-screen area to hold onto, so just holding the phone can press the screen corners.
    – Danny Varod
    Commented Feb 25, 2021 at 9:55
1

Good question, In my opinion, their is no need for a user to click outside the box to close it. As a developer i strongly suggest to retain the flow i,e to retain the ability for a user to make a decision.

For example, if a user has something to sign up and he has option to either submit or hit close button, probably he may rethink the option to signup again (ok ,not necessarily) since , he cannot just blindly dismiss the form.

Improve this answer
1

Yes it should for the sake of user control/freedom, unless there's a cancel button on the modal window. Here's a good article that explains the best practices for modal windows: Modal Windows Best Practices

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.