2006-03-30
I made fun of that DivX dialog yesterday (below), but, I really shouldn't do that unless I can do it better. Which I can. But, instead of just showing you my version, I'll instead give you a step-by-step method for designing simple confimation boxes like this one.
- These dialogs have some text and 2 or 3 buttons (more than 3 is rare). First, design the dialog with just the buttons, and label them so that the dialog is usable without any text. This puts the UI burden on the buttons, which is where it belongs, because, while a user might ignore or not even see the text, the dialog will stay there forever unless the user presses one of the buttons, so they're bound to be read sooner or later. (That is, most dialogs have two problems: That the text is confusing, and that it isn't being read.)
- Since this dialog popped up when the user tried to quit during a conversion, the obvious names for the buttons would be "Quit" (do what you set out to do) and "Don't Quit." "Quit" is a good name for the button because it's identical to the menu item, if a menu item is used, and, in case the red button (or whatever) was clicked, it's still OK because "quit" is a standard Mac term. "Don't Quit" is good because it so clearly sounds like what the user should press if he or she wants to reverse the decision to quit. You can probably use "Continue" instead of "Don't Quit," even though it takes a bit of thinking to figure out that the buttons are opposites, because "Continue" appears often enough in UIs that the user will most likely know what it means.
- If that's all there is to say, the text can say simply "Are you sure?" Or, if you want to repeat what the user was doing, it can say "Are you sure you want to quit?"
- Sometimes, such as in this case, the user should be told of some consequences of his or her action that may not be obvious. Here, it's that quitting will stop the conversion and discard the partial results. So the message might say, "Quitting will stop the conversion discard the work done so far. Are you sure you want to quit?" If you think it's unnecessary to mention that the work will be discarded, this can be shortened to ""Quitting will stop the conversion. Are you sure you want to quit?" or "Are you sure you want to quit (and stop the conversion)?"
To summarize, the three simple rules are:
- Make the labels on the buttons carry the full burden of asking the question and providing the choices, because many users won't read the text and won't comprehend it even if they do read it.
- Once the buttons are doing their job, add the text, but make sure any reference to button actions uses the exact same wording as the buttons.
- On a confirmation dialog, never, ever use the word "cancel," either in the text or on a button. The first reason why is that it's too easy to fall into the trap of having "cancel" mean don't cancel, which is guaranteed to happen if any kind of stop or quit action is what's being confirmed. That's where the orignial DivX dialog went wrong. The second reason is that for more complex dialogs "cancel" means "leave this dialog without making my changes effective," and that's not what it means in a confirmation dialog. It's always better to use unambigous words like "stop" or "abort" as I did.
If you compare my dialog with the original, you see that I just made a few changes. One of my buttons even has the same label. But, I followed a process that got me there. What I think the DivX designer did was just accept the default name for one of the buttons, which was "Cancel."
If the confirmation dialog is on a web page and it's generated from JavaScript with the "confirm" method, you're in trouble, because most browsers label one of the buttons "Cancel" and, believe it or not, there's nothing you can do about it. (Internet Explorer has some non-standard alternatives, but you need to stay away from them.) If you can't come up with an appropriate wording, and often you can't, don't use the stock dialog and instead bring up an entirely new window. (If you're using AJAX, you might be able to change some text in the existing window.)