Jan
9
2009
So how would you order the buttons on a form?
(A) OK | Cancel
or
(B) Cancel | OK
Option A is the natural reading order in English (e.g. Yes / No), but putting ‘OK’ last as in option B is more like the Next in ‘Previous / Next’ which moves the user forward and improves flow. Which is best?
From the reading I’ve done, the order doesn’t seem to matter. What is important is that you follow these rules of thumb:
- Be 100% consistent through your whole site – this is really important
- If most of your users use Windows and you are building a web app then use the windows guidelines and put OK first
- If most of your users use MAC OS then follow Apple and put OK last
- Hey… Do you really need the Cancel / Reset button? If you don’t need a cancel / reset button then I say lose it all together and just give the user 1 button whether it is OK or Save, hitting a reset or cancel button by accident after filling in a huge form is a real pain!
- Set the most commonly selected button as the default
- Space them out! Give a good amount of white space between the buttons
- Make the most commonly selected button more visually obvious (in terms of size and colour)
- Label buttons to explain what it does, so rather than ‘Submit’ on a contact form use ‘Send email’
Here’s an example – it’s big, bright obvious button (please don’t click it, it doesn’t go anywhere!)
- Matt
