“OK-Cancel” or “Cancel-OK?” How about both!

For the majority of my career I have worked on enterprise class software applications and websites that were built on, built for, and built with the Microsoft Windows operating system. Dialog boxes (and other user interactions), in this environment typically have an “OK-Cancel” at the bottom. Screen Shot 2013-02-11 at 11.45.49 AM
Most desktop computer users are using the Windows operating system; (see http://www.w3schools.com/browsers/browsers_os.asp) so I have always felt comfortable designing web-based screens to follow that convention.

In recent years, I have had the opportunity to also work on Apple Macintosh computers. A lot of what I do is write papers, create presentations, send/reply to emails, etc., so other than the crazy (non-backspace/Delete) keystroke difference between the two systems most things are about the same for me.

Screen Shot 2013-02-11 at 11.46.25 AM
One notable exception is that when using my MacBook the buttons at the bottom of dialog boxes, etc. are “Cancel-OK” and not “OK-Cancel.”

I recently had the opportunity to sit in on a training session for a customized Adobe CQ implementation designed and developed by a large third party organization. This was a great opportunity to see how other organizations are designing authoring environments with this very powerful WCMS system.

One thing that I noticed about the CQ implementation was that sometimes the buttons on dialogs were aligned as “OK-Cancel” and other times “Cancel-OK.” In my career I have filed a lot of bugs having to deal with “Button order consistency” (or lack thereof). I couldn’t help thinking that different designers worked on the project, perhaps across organizational and geographic boundaries—some which were using a PC, while others were using a Mac.

At first I thought that the various 3rd party designers on this project should create a button order standard, and be able to stick with that standard for the entire project. I had always gone with the “OK-Cancel” standard because it would work for the majority of users. This standard, however, forces the 9.3 percent of users with an Apple operating system to slightly modify the way that they interact with dialogs when they are working on the web.

Nowadays with the proliferation of devices and operating systems and environments, it seems to make better sense to use a responsive design with regards to button order.

Why not “sniff” the browser and the operating system and systematically determine the button order that best matches the standard for that environment?

This would present “OK-Cancel” for PC and Android-based web applications, and “Cancel-OK” for Mac OS or iOS systems

“Mary-Anne” or “Ginger?” “OK-Cancel” or “Cancel-OK?” I guess it depends on who you are, or what device you are using!