User-friendly error messages: 7 tips

Why are error messages important?

A lot of websites make usability mistakes on their form pages. And that costs visitors. On a form page that’s extra painful because if you lose a visitor there, you loose a very valuable visitor. A visitor who’s willing to make the effort to get in touch with you or perhaps even to order something. A visitor who fills out a form (or tries to) is a visitor you should cherish.

Here’s a few tips.

1. Use the language of the form

If the form is in English, the error messages should be in English. Sounds self-evident, I know. And on single-language websites this usually isn’t a problem.

But on multi-language websites it often is. Error messages are often overlooked in the translation process. Make sure they aren’t on your website.

2. Use understandable language

Don’t use code or words only programmers know the meaning of like “Customerrelation_gender_error” or “FieldT12empty”.

That’s pretty much all I’m going to say about that one.

3. Be nice

How hard is it to just be nice? The person filling out your form is a potential customer.

Now is not the time to get smart and say things like “Your letters stink” if somebody gets the captcha wrong. Instead, say “You did not enter the correct text displayed in the spam-prevention image box. Please try again.”

Sounds a lot nicer, doesn’t?

4. Be specific

General error messages like “Fill out all the required fields” are an excellent way to scare off potential customers.

An error message like “Invalid credit card” isn’t exactly helpful either.

Give the user more details about what went wrong and what he can do to fix it: “There was an error processing your credit card. Please check your name, credit card number, and card expiration date for correctness. Remember, these must match the card exactly.”.

The more specific your error message is, the easier it is for the user to fix the problem.

5. Don’t blame the user

If the user has made a mistake while filling out your form it’s not a good idea to rub his nose in it.

Don’t tell the user what he did wrong. Tell him what he should do to get it right.

Don’t write:

  • You forgot to fill out your email address.

But write:

  • Please fill out your email address.

6. Avoid spelling errors

Check the spelling of your error messages. Error messages are hidden away and often get overlooked. Make sure an editor checks them.

7. How do you check all this?

Leave your form empty, press the ‘Send’ button and read the error messages. Imagine it’s somebody else’s website and see if everything’s clear and if there isn’t anything that would annoy you.

Next, put in some ‘wrong’ data (email address without an @, postal code that doesn’t exist, date of birth in 2020, etc) and see what kind of error messages that generates.

It really isn’t that hard. So hop to it!

Would you like to know how your site’s usability could be improved?
Time for an expert review.


Read more articles about , , Usability.

Want to stay informed about new articles?
Subscribe to our RSS feed or our newsletter.


  • http://www.israeltour-online.com Julia Slavin

    Nice tips in overall. I could only add a few to strengthen the point:
    * Make a tip per a field – it’s not so nice to get to the top of the page, read the message and look down for the relevant field.
    * Where is possible to validate the input in real time – do it and show the tip immediately after the field loses focus.
    * Show positive indicator after verifying the data. For example, if the visitor has submitted a valid email address, color the field’s borders in green.
    * Keep the error tips as short as possible, even if it makes them less mannered. For example, instead of “To create a strong password, please use both letters and numbers. Passwords may be maximum six characters long”, say “Please combine up to 6 letters and numbers”. This bullet a little bit contradicts your 4th tip about being more specific. I suppose that a compromise should be found to keep the message clear yet brief.
    * Present your tips in a way that doesn’t take any effort from the visitor, for example clicking on an (?) icon to switch the tip on and off.

    Good luck with your forms!

  • http://www.agconsult.be Els Aerts

    Thanks for adding your tips, Julia!

  • http://marijnsomers.blogspot.com Marijn

    pingback: http://marijnsomers.blogspot.com/2009/10/web-usability-blog-hits-nail-on-error.html

    Love your blog, and specially this post!! I couldn’t agree more!!

  • Pingback: En guide til feilmeldinger i webløsninger – Stammen.no

  • Pingback: 10 most popular usability articles in 2009 - The Web Usability Blog

  • Erika

    Hi,

    Did you notice that under ’3. Be nice,’ your example text “You did not enter the correct text etc” is critiqued in your very own ’5. Don’t blame the user’? I cringed at the “you did not” myself. How about, “Those characters didn’t match. Try this one”?

    I couldn’t agree more with the mantra to never blame the user. It is always up to us to be clear and accommodating.

    :-) erika

  • http://www.agconsult.be Els Aerts

    @Erika: You’re absolutely right. ‘You did not’ is to be avoided in error messages. My bad.

  • Atomiton

    One comment regarding email addresses. If they didn’t enter an email address, sure, “please enter an email address” is good. However, if it’s an invalid email address. saying something like “Please enter a valid email address” isn’t the best, because they may have made a typo and won’t catch the “VALID” word in the middle. Instead, something like: “We couldn’t validate the email address. Please check your email and enter a valid address.” may work. I know the wording isn’t the best, but I’m just thinking off the cuff. The point is, if the user has made a typographical error, it’s usually good to point it out, as most users will only glance at the error message and assume they’re missing something.

  • Pingback: 10 most popular usability articles in 2009 | Uxable