8

I find moving the mouse leftwards from it's normal position more easier. Is it the same for all users or at least for you? If not, what's the best position to keep the close button for a popup. This more of a question about the ease in movement of the mouse for an average user.Not just about the position of the close button.

Eg: from apple.

Popup that appears when you click on the link that is placed towards the right side of the page.

What is the best method to use to close popups taking into account both mobile and desktop use?

Improve this question
5
  • 2
    But on mobile, it'll be bad. Top left is for right handed users the hardest point to reach on mobile (or the right bottom).
    – Michael Schmidt
    Aug 18, 2015 at 11:07
  • 1
    And to play off of what @MichaelSchmidt said, the flip side will be bad for left handed users.
    – UXerUIer
    Aug 18, 2015 at 17:08
  • 1
    As long as the popup can also be closed by tapping or clicking the dimmed area around it, I don't really care :D
    – CodeManX
    Aug 18, 2015 at 18:25
  • Duplicate of ux.stackexchange.com/questions/8382/… which in turn is duplicate of ux.stackexchange.com/questions/7/…. Really, this question has been made many times
    – Devin
    Aug 19, 2015 at 2:39
  • @MichaelSchmidt I agree. Having the menu trigger button on top-left is a big mistake that most of the apps and websites make. even though they provide drag-in from left option, users are more likely to reach their thumb and tap that icon which is a very tricky and annoying thing.
    – Rahul
    Aug 20, 2015 at 10:39

7 Answers 7

Reset to default
10

Use workflow analysis to figure it out

  • Think about the user's workflow for a popup. A typical workflow might be:

    1. User sees something onscreen
    2. User wants to find out more, and presses a popup trigger
    3. Popup is displayed
    4. User re-orients vision to the popup, and reads the popup title.
    5. User may close the popup after the title (if it's not useful information), or may read the body text (if it is useful) then close.

  • Design a layout that corresponds to this workflow. For most countries, users read left-to-right, top-to-bottom. This usually means that placing the dismiss button on the top-right or bottom-right is most compatible with the workflow:

enter image description here

  • Both of these approaches provide better visual flow than a close button on the top-left, since readers will tend to start reading pages and dialogs from the top and usually from the left, for left-to-right languages (see the F-pattern).
Improve this answer
1
  • 1
    This assumes you're not trying to sell any information, but rather expecting them to provide their own reasoning as to why they should read it.
    – insidesin
    Aug 19, 2015 at 8:33
2

Find your balance

Do not ask the question, Which is the best position?

But instead ask the question What do I want to get from the popup and how can my exit point help?

Most of the time a little bit of ambiguity will work wonders for advertisements. You want to challenge the typical location of things, this is to escape falling victim to sleep-walking behaviours (or more simply, people who instinctively click away before looking). You have to balance difference with annoyance, you don't want it to be too easy to navigate around, but you don't want it to be too hard as well.

Apple does this well, and they know it. You are used to seeing the exit button in the top right and so when this popup displays, it forces you to 'search' for the button, which may only be a few seconds to the average user, but is a large deal more productive/aggressive than the 'instant closure' of a user in autopilot.

Note: Apple users will instinctively look to the top-left, but I would say there is a good chance that Apple uses this correlation in lieu of challenging Windows users, after all, it's for a piece of hardware that is staple in converting regular PC users to Mac products.

Improve this answer
2

Have a look at Similar Question asked before

In a nutshell given that both the patterns have been used, let the decision be driven by which OS is your audience likely to originate from. If it is iOS then place the close on the top left and if windows then top right.

If you closely notice you will find discrepancy everywhere. For e.g. Inbox app(by google) places a close button on the top left(compose message window) in their ios app whereas if you go to the same window on the web version the close control is on the top right.

Personally I feel comfortable with Top right(but then it could be because in spite of being a Mac user now I was a PC user for the longest time)

Improve this answer
1
  • It really does come down to the audience and the expectations of the users. If you are aware of both, then cater to each and the answer is obvious. That's why I think your answer is the most helpful.
    – tonytrucco
    Aug 18, 2015 at 18:11
0

This concept of what is easier is very very relative.

It might be easy for left handed users if the left side had an X, but difficult for right handed users, and vice versa...

This sort of notion comes back to the whole debate of what is better Ok/Cancel or Cancel/Ok? What they found is that it doesn't matter. What matters is consistency, because breaking consistency is where the true problem lies.

Improve this answer
0

I think that certain situations could warrant a solution like this:

enter image description here

Improve this answer
3
  • 2
    My worry with pop ups if unwarranted is that text will probably go unread with a frantic user trying to find the close.
    – UXerUIer
    Aug 18, 2015 at 17:50
  • 2
    Another potential pitfall of this approach is if there's important text in the popup that a user might want to copy. Tapping anywhere to close would remove that ability completely.
    – tonytrucco
    Aug 18, 2015 at 18:09
  • @tonytrucco Per my opening line: "I think that certain situations could warrant a solution like this:"
    – MonkeyZeus
    Aug 18, 2015 at 19:32
0

Top right is consistent with close buttons for browser windows. If it is moved, users could think it's deliberate and deceitful.

Improve this answer
-1

Top right seems to be the most common placement for close (x) buttons in dialog windows in the Web

Improve this answer
2
  • 1
    If you can please elaborate on your answer. As it is it's more like a comment.
    – Mayo
    Aug 18, 2015 at 20:12
  • -1 for having an opinion based one line answer without credible sources or own experience. Please improve your answer. Thank you
    – Benny Skogberg
    Aug 18, 2015 at 20:56

Your Answer

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

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