It’s important to remember that our sites are really self service software applications, and they’re very likely not as intuitive as we think they are. Referencing back to one of my previous posts, “Is elitism the source of poor usability,” we have to remember that our customers probably aren’t as tech savvy as we are, and they are definitely not anywhere near as familiar with our sites as we are. So, it’s important that we’re very clear in our messaging when something goes wrong.

So what does it take to write a quality error message?

1. Be specific
   It’s so important that we tell our customers exactly what went wrong. Our developers have to write code for every possible instance, but all too often we resort to generic and vague language in our error messages. Here are a couple of examples:

   

   As a customer, I’m not sure what I’m not sure what happened or what I should do about it. I might try once again, but if I got this message a second time I would be gone.

   

   This either/or scenario is really an example of a lazy error message. Which is it? Is the address improperly formatted or does it contain invalid characters? We need to tell customers specifically what is wrong and tell them how to fix it.

   Here’s a much better example:
   

2. Use clear language
   It’s very important to avoid anything that even remotely resembles tech jargon. Try instead to use short words that are part of everyday language.First, a bad example:
   

   Huh? Customers understand “password” but “authentication credentials” are certainly unclear and sound kind of scary, frankly.This one is much better:

   

   This is both specific and written in clear and simple language.

3. Strong visibility
   Error messages need to be extremely prominent. Use color and other symbols, such as exclamation points, to help the error message stand out. It’s also helpful to separate the error messages from the rest of the page with white space. Include the message prominently at the top of the page and also at the specific field, if it’s a form error.Here’s a good top of page error:
   

   I would like to see more white space around the error message, but otherwise this is really good.And I really like this way to highlight a particular field where the error has occurred. It may not be pretty, but then it probably shouldn’t be. It should stand out, and this does. Even better, we get a very specific message telling us exactly what’s wrong with the field.
   
   

4. Be polite
   Whenever an error occurs during our customer’s experience with our site, we’re in danger of losing her if we don’t handle it well. So, let’s be as courteous as possible. The cost of courtesy is zero, and it allows us to come across as friendly as possible.Here’s one that is both specific and polite:
   
   

   Here’s one that goes the extra mile to suggest calling Customer Service if there is still a problem. This is a very nice touch that will go a long way towards saving the sale.
   
   

5. Provide examples for how the information should be entered correctly
   It’s very important they we’re not only specific in defining the problem that occurred but also specific in explaining how to correct the problem. If the customer has entered his email incorrectly, we cannot assume that he knows what he did wrong or how to enter it correctly.Here’s an error message that explains the format pretty well:
   

   However, the customer may not understand what “domain” means. It may be be better to also use a real example with a well-known domain like “name@aol.com.” Even better, incorporate the information the customer entered, if possible.For example, the error might say something like:

   You entered “kevin” for your email address, which is not a complete address. Please enter an “@” symbol followed by an email provider after your email name. For example, “kevin@yahoo.com.”

Even better, be proactive. Stop the error before it occurs.

I really love how Restaurant.com handles their form fields. Upon entry to a form field, a dialogue box dynamically appears next to the field with some helpful information. The movement that occurs upon entry really draws your attention to the helpful information, which I find considerably more effective than help text persistently present under or next to a field. It’s far easier to ignore static text than something that appears when you enter the field.

Additionally, the folks at Restaurant.com have included some great help text that provides important information. In this example, they’re letting us know the address must match the billing address on our credit card. Excellent!

And here, we get some specific information about the value of our password and the basic requirements for the password. And we get some nice politeness to close it out.

Save those sales. Give error messaging your full attention.

Error messages should get just as much attention as any other site functionality in the requirements processes for our sites. We should give error messaging as much attention as we give to marketing copy. It may not be sexy, but it’s critically important if we want to avoid needlessly losing sales.

What do you think? How much time to you put into error messaging? Do you have examples of particularly good error messaging? Would you add anything to the list of quality error message attributes?