Cancel the Cancel Button

Usability expert Jakob Nielsen asks in this week’s article, “Should the OK button come before or after the Cancel button?” He recommends sticking with the standard that the operating system of your visitors use. So, if you’re creating a web application for a Mac focused crowd, you would put OK last and for pretty much every other web app, you’d put OK first, as it is on Windows.

I use a Windows machine all day at work and a Mac laptop as my personal computer at home and I never even realized that the dialog box buttons were reverse, which shows that this isn’t exactly the most pressing usability question. Still… I wanted to add something that wasn’t discussed in his article and that’s button use on web forms.

How many times has this happened to you: you fill out a lengthy web form and at the end, you accidentally hit the “cancel” button instead of “submit”? I can’t be the only one who has lost their data and cursed at that useless button.

Long ago, I realized I have never had to use the “cancel” button at the end of a web form, so I stopped including them in any forms I code. I usually don’t go about filling in forms that I don’t intend to send, but on those rare occasions when I have changed my mind, I simply don’t hit the “submit” button — instead I go to another web page.

I’d argue in favour of not including a “cancel” button at the end of any web form.

If you feel your forms do require a cancel button, I’d recommend prioritizing the buttons so that it’s very easy and obvious to send the form and require a little more effort for the user to cancel.

This type of prioritization is perfectly illustrated in the screenshot above, which was created by LukeW. Luke as also has written a fantastic article about creating very usable web forms, which is worth a read if you’re a front-end web developer.