If you would have a pop-up with just some information for the user. They don't have to make a choice. Is it wise to give the user two options to close that pop-up (see screen shot) or would you give the user only one of those two options to close that pop-up.

Also how would it be if it was a 'Cancel' button instead of an 'OK' button.


  • Can you talk about the popup's purpose a bit? That might help people give more informed answers. (My default response at the moment is "don't have a popup" ;-)
    – adrianh
    Oct 30, 2012 at 9:18
  • 2
    Why is the close on the top-left, going against every convention since time immemorial? Oct 30, 2012 at 10:20
  • @MarjanVenema close on the left hand side is an iOS convention from desctop, close the program, to iPhone, delete the app! Not saying that its the best way!
    – Igor-G
    Oct 30, 2012 at 10:32
  • @MarjanVenema close on the left hand side is an iOS convention from desctop, close the program, to iPhone, delete the app!
    – Igor-G
    Oct 30, 2012 at 10:33
  • 1
    @Igor-G: Typical. Apple just has to be different again :-) Oct 30, 2012 at 11:13

5 Answers 5


There is no harm in having more than one action to close, as long as they don't confuse the user. I would consider some alternatives too:

  • Clicking outside the box to close (this is fairly extended with the use of image lighboxes)
  • Having a "Dismiss" button or similar. "Ok" is ambiguous, I wouldn't know what the related action is and would be in doubt of clicking or not. "Cancel" would also be confusing, what am I canceling? My correct answer? It can be a problem.
  • Cross on the right side

You could also consider fading the message out after a number of seconds (I think facebook does this with certain notifications).

  • 3
    ... except what if the user is distracted or away from the computer and misses the message. Or what if they have a reading of visual disability that makes reading the message difficult/slow... automatic fade out has issues.
    – adrianh
    Oct 30, 2012 at 9:16
  • @adrianh: totaly agree fade-out is not the best way! the rest of the suggestions are great.
    – Igor-G
    Oct 30, 2012 at 10:30

In this case, I don't think it matters if you give the user 2 ways to close the pop-up or 1. Usually, I stick to the rule of thumb that actions should be possible in multiple ways in order to accomodate different users and what they expect to see. However, I think the pop-up model is so frequently used that just an "OK" button would suffice. The "X" doesn't do any harm if you would like to keep it there, as this is also typically used and wouldn't draw attention. Because it doesn't draw attention, though, you should probably not have just an "X" as some users may not notice it and be confused about how to close the dialog. This applies to what I am thinking of as a typical dialog - yisela's example of a lightbox relies on an "X" in the upper right-hand corner, but it also allows for clicking outside of the box to close it.

As for language, the buttons available should depend on what they can do and the purpose of the dialog. For just a confirmation message, use either "OK" or "Close". "Cancel" should only be used in the case where clicking "OK" would submit something, so they want to be able to cancel without completing the action.


I will go for having two close button as attached in your screen-shot when giving any message to user.

In this case, users main focus will be on your message that you are giving to the user. So after the message, it is good(of-course in my opinion) to show button next to it, of any further action.

Consider a case when message to be shown to user is a bit large. In this case user may find difficulty in finding the close button after reading a long message, as he need to change his focus.

Also I would like to have cross icon to top-right corner of the popup window.

Regarding text of button, it would depends upon the context of message that you are showing to user and further action that will happen after clicking the button.


If the popup is a real one, not a div in the page, the browser/system will provide the "X" to close the window, so you should only provide the one in the code, which should be as understandable as possible.

If you are generating the popup effect with a div, then you can provide the button yourself, as per your screenshot.

But, since your intention is to be sure that the user has read the text you presented to him, I'd say that you should try to avoid any way of closing the window that is not related to acknowledge the actual message, so, don't provide an "X".

We are used to interact with many kinds of confirmation boxes, popups and related interfaces, so when we scan the screen and we see a box with only one option, we know that it doesn't matter what we do, the only option is to close it, so the brain and the attitude is dismissive; many problems happen because of that, but that is another subject. So make the button something the user have to pay attention to, like "I have read and understood the text", or " I agree with ...", something that makes the user stop for a moment and really interact with your box or read the text if he hasn't done it yet.


One addition: I see it written in the title bar: "Correct!"

I assume it's a test or a puzzle game.

It's generally a good practice "not to break the flow", that is, if the application is about filling answers, don't make the user click any notifications.

Instead, use an animation, like, a big green checkmark expanding and disappearing, and perhaps a sound effect.

quiz animation sequence with sound effect

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.