Feedback messages and error messages

Never leave site visitors in the dark when they’ve made an input error, when they need to wait, or when they’ve encountered some sort of problem. Immediately let them know what’s happening and what to do next.

Use feedback messages to orient visitors to their location on your site or to acknowledge their actions. For example, after people submit a question, they might see a page saying, “We’re processing your request—this may take a few minutes.” Or after customers have purchased something, they might receive feedback saying, “Thank you for your order. Please print your invoice.”

For these kinds of feedback messages:

• Clearly confirm the user-initiated actions.
• Provide information in a consistent, straightforward manner.
• Be courteous. If people may need to wait, tell them.

The most important type of feedback—and often the most overlooked from an editorial perspective—is the error message. A well-written error message can create a trust-building safety net for your website’s applications.

Error messages are an integral part of the user experience. Yet many sites, to their detriment, treat them as an afterthought, using wording that seems to have been created solely for engineers. Such messages often leave site visitors frustrated about what just happened and confused about what to do next.

Example
   !
Error 678!

To make your error messages user-friendly:

• Be specific. Help the person understand what went wrong.

Example
Before
Invalid data
After
Enter a day from 1 to 31.

• Be constructive and positive. When an error is caused by something the user has done, don’t chastise or place blame. Instead, tell people what they need to do to set things right.

Example
Before
You entered a ZIP code of the wrong length.
After
Please enter a 5-digit ZIP code.

• Be helpful. If the error involves filling out a required field, have the form remain filled in as much as possible with the information the user provided. Draw attention to the missing field or fields by using markers such as exclamation points, asterisks, or the word Attention before any missing field. Explain what such markers mean—for example, with an instruction like “Fields marked with an asterisk (*) are required.” You can use red text in addition to these methods, but don’t rely solely on people being able to see the color—some of your site’s visitors may be colorblind; others may be blind.
  
  
• Avoid technical jargon. In all your UI text, but especially in error messages, write so that the average person with little or no technical background can understand what’s going on.

Example
Before
Are you sure you want to navigate away from this form?
After
Are you sure you want to close this window?

• Be courteous. Consider the reaction of the site visitor suddenly faced with your error message. Use polite language, and employ a friendly tone if it’s appropriate for your site. One way to achieve a friendly tone is to use the second person—you and your. But don’t use these pronouns if the result could be interpreted as suggesting blame.

Example
Before
Sign-up rejected. You did not enter a password of the required length.
After
Please enter a password that is at least 8 characters.

• Use the appropriate capitalization. Messages in sentence case are easier to read than those in title case or in all uppercase. (See “Capitalization” for the rules governing sentence case.) Use all uppercase letters only for brief one- or two-word alerts such as “warning” or “time-sensitive.”

Example
WARNING: Previous version detected. Delete all previous versions of this program before installing the new one.

Example
Before
Email Address Not Found, Please Try Again
After
Email address not found. Please try again.
Better
We can’t find this email address. Please check the address and try again.