UI: Users are illiterate

il·lit·er·ate: unable to read or write <an illiterate population>

Technically, users are not truly illiterate, but it sometimes seems that way. Users are able to read, yet they choose not to. I am not referring to the “computer illiterate” public. When I say that users choose not to read, I include every type of computer user: from the grandma playing solitaire to the DBA creating an multi-tier distributed Oracle database (I’m not even sure if such a thing exists, but it sounds good…)

Axiom

Allow me to concisely state this as an axiom:

Tim’s First UI Axiom: Users don’t like to read

Evidence supporting this axiom:

• Users call technical support asking “How do I get this automatic updates box to go away?” “Is it asking you to restart your computer?” “Yeah… should I do that?”
• Software install box pops up in Internet Explorer, user just clicks “Yes” to get it to go away.
• Random error message pops up in Buggy Piece of Software #2,956,322, user doesn’t want to be troubled with errors so clicks “OK” to make it go away.

The evidence supporting the axiom also show why it came to be true. Users have been trained out of reading by the consistent level of unnecessary white noise. If every program was designed to display text only when necessary, people would sit up and take notice when there was actually text on the screen.

Corollaries

Now, starting from this axiom, consider some of the logical consequences:

• Since users don’t like to read, there is an extremely high probability that any text you display on the screen will not be read. For example, having a dialog that asks “Do you want to discard your changes?” with buttons labeled “Yes”, “No”, and “Cancel” will likely have a large number of users clicking “Yes”, which is probably not the action that they really want.
• Since users don’t like to read, when faced with an option of reading a large amount of text and a small amount of text, they will opt for the smaller amount of text. In the scenario of a dialog asking “Do you want to save your changes?”, using buttons that say “Save” and “Don’t save” are much more user friendly than Yes/No/Cancel. For information on how to easily make this sort of dialog, see vinnyp’s blog post about TaskDialog.
• Using mnemonically useful icons is a very good thing. The recognition time of colors and shapes is much faster than recognition time for a few words in 10pt font.

Application: Toolbars

Do not misinterpret this rule to mean that all text is bad. On the contrary, text is often necessary. Most of us have encountered a toolbar with cryptic icons and no text explanation. The following is a toolbar in the Opera web browser:

So what exactly does the trash can do? The meaning is cryptic without accompanying text. Hovering displays a tooltip that reads “Closed”. This helps a little bit, since most people can figure out from the combination of the icon and text that the trash can will allow you to access tabs that have been closed. Requiring the user to hover over the icon before the text is displayed, however, reduces the discoverability of the feature. I used Opera for a month before I realized it was there.

The “View” button (eyeglasses icon) is even worse. The tooltip doesn’t really help here. What does “view” mean? What do the eyeglasses do? Clicking this icon actually displays and hides the toolbar below (containing the zoom and other options). Interestingly, the “view” toolbar actually shows a very effective type of toolbar item. Icons with text allow quick recognizability through a mnemonic icon, and good discoverability through the use of a short cogent phrase of text.

This sort of toolbar can also be seen in Windows Live Writer:

In this toolbar, you see that items that would otherwise be difficult to pictorialize have text associated with the item. However, however, there is still one icon on the lower row of icons that is completely non-obvious: the check mark icon on the far right. Can you guess what it means? The tooltip tells us: “Post properties”. I never would have guessed that from the icon. This icon might have been better placed in the toolbar above, with associated text explaining its purpose.