Save and Canvel buttons in popup screen

4 Jun 2009 - 2:38am
2 years ago
13 replies
525 reads
Yohan Creemers
2008

Hi Michael,

The position of Save and Cancel is no longer a matter of logic, only
of convention. The best would be to detect which operating system the
visitor is using and place the buttons accordingly. Second best option
is to find out which operating system is used by the majority of the
user base, and follow that convention.

Both Microsoft and Apple offer excellent User Interface Guidelines.
It's advisable to follow the guidelines unless you can motivate why
deviating is better.

Another useful resource is:
http://rosenfeldmedia.com/books/webforms/info/description/

- Yohan

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=42574

Comments

4 Jun 2009 - 4:39am
Nils-Erik Gustafsson
2009

Hi,

if your target users use Apple computers, follow Apple's convention,
having the OK to the right and Cancel to the left. (This is the better
solution from a Human Factor's perspective.)

If your target users use Microsoft Windows applications, follow
Microsoft's conventions, having the OK to the left and Cancel to the
right. (Consistency, above all...)

In either case, have both buttons next to each other, and not as in
your sketch, which follows the now defunct Motif standard,
distributing the buttons across the window's width.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=42574

19 Nov 2011 - 4:52pm
Josh Coe
2009

[redacted]

4 Jun 2009 - 4:55am
sudhindra
2004

Hi Michael,
Instead of having Save and Cancel on opposite ends (which is against
convention and Fitts' Law), if you want to provide differentiation between
the 2, use the Yahoo-like Save and Cancel. They have Save as a big button
but Cancel as a rather less-emphatic link.

Sudhindra V.

4 Jun 2009 - 7:38am
Anonymous

Hi Michael

I'll echo what Yohan says. Detect the OS. If it's Apple, place
'Cancel' to the left and 'Save' to the right. If it's Windows,
place 'Cancel' to the left and 'Save' to the right.

What Sudhindra mentions is good option to consider too.

You might want to have a look at these articles by Nielsen and Tullis
on placement of OK and Cancel buttons as well:
http://www.theuxbookmark.com/2009/05/interaction-design/ok%u2013cancel-or-cancel%u2013ok-ok-and-cancel-buttons-whats-the-right-order/

-Abhay

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=42574

4 Jun 2009 - 8:13am
Lisa Rex
2009

Try this URL if the above doesn't work:

http://www.theuxbookmark.com/2009/05/interaction-design/ok–cancel-or-cancel–ok-ok-and-cancel-buttons-whats-the-right-order/

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=42574

4 Jun 2009 - 9:01am
Jack L. Moffett
2005

This topic comes up often. Check out the following threads:

http://www.ixda.org/discuss.php?post=25587
http://www.ixda.org/discuss.php?post=15561
http://www.ixda.org/discuss.php?post=16084

Best,
Jack

Jack L. Moffett
Senior Interaction Designer
inmedius
412.459.0310 x219
http://www.inmedius.com

Most people make the mistake of
thinking design is what it looks like…
People think it's this veneer—
that the designers are handed this box
and told, "Make it look good!"

That's not what we think design is.
It's not just what it looks like and feels like.
Design is how it works.

- Steve Jobs

4 Jun 2009 - 9:05am
Jack L. Moffett
2005

On Jun 3, 2009, at 10:19 PM, Josh Coe wrote:

> I would not put the Save and Cancel buttons on opposite sides from
> each other (via Fitts' Law). Keep the buttons near each other so the
> user takes less time to move from one to the other.

On Jun 4, 2009, at 5:55 AM, Sudhindra V. wrote:

> Hi Michael,
> Instead of having Save and Cancel on opposite ends (which is against
> convention and Fitts' Law)...

That doesn't make any sense at all. There is no reason to move the
mouse from one of these buttons to the other. You pick one of them.
Fitt's law doesn't enter into it.

Best,
Jack

Jack L. Moffett
Senior Interaction Designer
inmedius
412.459.0310 x219
http://www.inmedius.com

In our society,
the scarce factor is not information,
it is time to attend to information.

- Herb Simon

4 Jun 2009 - 1:00pm
gfrances@iconta...
2008

"That doesn't make any sense at all. There is no reason to move the mouse from one of these buttons to the other. You pick one of them. Fitt's law doesn't enter into it."

I agree. But I would still want to see the buttons placed side by side (in the lower right). At the moment it looks more like an oversight than a deliberate design choice.

4 Jun 2009 - 2:48pm
Elana Glazer
2009

I agree with Sudhindra. I would have a Submit button and a cancel
link. (Alternately, you could use a colored button for Submit and a
less obvious color (i.e. gray) for Cancel.)

Both these options will serve the same objective - providing a cue
which option is best for moving forward, while providing a way
"out" should the user not want to complete the task.

In both cases, the location of the main button (Submit) is less
relevant since it is the visual cue, not placement, that is aiding
the user select the most appropriate action.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=42574

4 Jun 2009 - 7:56am
wlmeurer
2009

Here's a great article by Luke Wroblewski that might help:
http://www.lukew.com/resources/articles/PSactions.asp.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=42574

19 Nov 2011 - 4:53pm
Josh Coe
2009

[redacted]

4 Jun 2009 - 9:15pm
cfmdesigns
2004

I say it doesn't matter. Users won't experience massive confusion and
be unable to deal with things. Odds are that they have seen buttons in
each position before, yet they still live.

And if it doesn't matter, it isn't worth fighting over.

Just keep the order the same throughout the app, and you're fine.

-- Jim
Via my iPhone

On Jun 3, 2009, at 8:43 PM, Michael <ramlal.minjus at xs4all.nl> wrote:

> I know there are conventions when using the save and cancel buttons.
> Windows for example has the save button on the left and cancel on the
> right.
>
> at the moment i have a problem. We use webapplications with pop-up
> screens at work. here we have a major discussion goeing on wheter the
> save button should be left or right...pfff.
>
> here is an example of a screen. Given that the user works his way
> from left top to right bottom i say the save button right.
>
> our developers disagree
>
> http://yfrog.com/0fpopupwindowp
>
> ________________________________________________________________
> Welcome to the Interaction Design Association (IxDA)!
> To post to this list ....... discuss at ixda.org
> Unsubscribe ................ http://www.ixda.org/unsubscribe
> List Guidelines ............ http://www.ixda.org/guidelines
> List Help .................. http://www.ixda.org/help

4 Jun 2009 - 4:39pm
Matthew Turner
2009

"That doesn't make any sense at all. There is no reason to move the
mouse from one of these buttons to the other. You pick one of them.
Fitt's law doesn't enter into it."

Strictly true. But depending on where the pointer appears when the
item pops up it can make a difference. On many systems I use daily,
the pointer appears already over the default option--thus making the
move to the non-default a longer trek in this layout.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Posted from the new ixda.org
http://www.ixda.org/discuss?post=42574

Syndicate content Get the feed