Making buttons easier to read

Question

Sometime ago I found an article about making buttons, or what is written on the buttons more readable. Not so much by design but by what was written on them. For example.

  Not so good
  +-------------------------------------------+
  |                                           |
  |             Delete this item?             |
  |                                           |
  |  +--------+                 +---------+   |
  |  |   ok   |                 |  cancel |   |
  |  +--------+                 +---------+   |
  |                                           |
  +-------------------------------------------+

  Better
  +-------------------------------------------+
  |                                           |
  |             Delete this item?             |
  |                                           |
  |  +--------+                 +---------+   |
  |  |   YES  |                 |   NO    |   |
  |  +--------+                 +---------+   |
  |                                           |
  +-------------------------------------------+

I guess it is a process of making options a little less ambiguous while giving more information with less.

Does anyone have any good articles or tips that could help me improve user comprehension?

Answer 1

For even quicker usage of such dialogs you can try to change the button in a way the user don't even has to read to actual question above.

Instead of "Delete this item?" I would write "Do you really want to delete this item? (it can't be reverted)"

And the buttons would be "Delete it!" and "Cancel" where the delete button would be of red color and the cancel button would be grey and a bit smaller than the main action button. You can see these styles in the Bootstrap framework for instance.

What may also be interesting is whether the main action button should be left or right in this example, but I have found no source that says it should be right (which I would prefer). I only found a litte survey on this topic.

Answer 2

Yes, buttons must say more than just yes/no. Especially if it's an international app used by non-native speakers or a critical app where a mistake can have serious repercussions.

The text on a button should say more than that. But making the text too long will make some users skip the reading process of just fly over the text without really comprehending. So you need something very clear.

I suggest trying to use no more than two words for each button:

1. word: the verb / action
2. word: the object / item

Examples:

• Delete item
• Recover file
• Download image
• Block user
• Save file
• Empty bin
• Draft saved (just popped up here)
• create bookmark
• You are getting the drift…

Example of a clear talking button (in German). It says: "Send Post" and "Cancel":

This is actually a special example due to the use of the not so helpful word "send". But it is still used because the alternative word in the German language would be "veröffentlichen" which is simply too long.

Answer 3

Completely agree with Oliver, and that a nice point that you have brought up by talking about non-native speakers and repercussions tat a minor grammar misunderstanding can create. It also important to label your buttons in sync with the 'tone of voice'. The content strategy of the whole app takes a call on this. Here is an enlightenment - http://uxdesign.smashingmagazine.com/2012/08/21/finding-tone-voice/

I cud not add more links here due to the limitation for new users in posting multiple links ... let me go get some reputations and come back to you :)

Hope you have got some needed enlightenment! Have a great new year ahead :)