2

Possible Duplicate:
Save/Cancel/Close button behavior question

I am developing a web application. I have a pop-up with a text field. I am trying to decide how the users can close the pop-up. I currently have two ideas, but am not sure which one is better as I cannot find any research for this.

Users will be using this pop-up text field often as it is one of the main ways of interacting with our project. The pop-up is about 200px wide, 75px tall.

Idea One: Have a cancel button next to the submit button at the bottom of the pop-up.

Idea Two: Have an 'X' button on the top right of the pop-up signifying close the pop-up.

Improve this question
2
  • 1
    I vote: have both. I'd also reconsider having to use a pop-up dialog so often though, that sounds pretty disruptive.
    – overslacked
    Feb 22, 2012 at 22:06
  • 1
    There's a nearly identical question ("Save/Cancel/Close button behavior question"), which was linked in the related in the sidebar from the beginning.
    – dnbrv
    Feb 22, 2012 at 22:31

3 Answers 3

Reset to default
1

If your pop-up contains a text field the user means there should enter some info there and a result of good interaction should be call button Save / Continue or similar.

I think that you will find the answer here:

Is a cancel button necessary

in a windows form?

in a web form?

Improve this answer
1

My recommendation would be to have both. The reason being that the cancel button enables users to have an obvious option to close or get away from the popup which the X button enables user to close the popup intuitively without having to look at the content.

However the question that arises is where is your X icon going to be located,most users are used to have the close option on the top right hand corner ( I don't have any research to really support this but this is what we have observe in test cases,I assume its because windows has the close button on the top right hand corner)

Another point for you to consider is whether you would want to consider the behavior of a lightbox with regards to pressing the Esc key. I know you haven't mentioned if your pop up is a lightbox,but we generally found during user tests that people have so accustomed to closing lightboxes by pressing the Esc key that they seem to expect the same behavior with other popups too (again a disclaimer : this was based on user tests we conducted on one of the websites I designed)

Improve this answer
1

In cases I've used a pop-up to report progress, I used one button for both close and cancel,
where if there is an operation in progress that will be cancelled the button says "cancel" until the operation is complete, then the text changes into "close" since the completed operation can no longer be cancelled.

If there needs to be a way to close the dialog without cancelling an on going operation, I'd add a "continue in background" button.

Are you sure that the pop-up is the correct experience for the process? - Especially since it opens frequently.

As a user, I close pop-ups in all 3 ways - button, X and ESC, depending on what is closer at the moment and sometimes on the text of the buttons (if the options are confusing - I go for the X).

Improve this answer
4
  • could clicking outside the popup also close the popup?
    – Erics
    Feb 23, 2012 at 1:59
  • It works that way in some sites e.g. Amazon's look inside the book. Personally I hate it when that happens. An inaccurate click cause by an air-mouse or small touch-pad can close unintentionally and it doesn't seem natural to me to try and close the pop-up that way.
    – Danny Varod
    Feb 23, 2012 at 11:22
  • Where I have seen it work though is with a gallery of items .. clicking an item opens it into a light box, clicking another item closes the last light box and opens a new one.
    – Erics
    Feb 25, 2012 at 5:42
  • In that situation it makes sense, changing selection should change detail.
    – Danny Varod
    Feb 25, 2012 at 21:50

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