How to develop effective error messages

Handling errors on a form can make or break a sale, user registration or any user input needed to complete a task. By just following a few simple rules you can make the whole error handling process a lot easier for your user.

Of course, in the first place I would like to think you have already been through a process to minimise errors throughout the form/task. However, human input will always be prone to errors here and there and so you have to make sure these errors are quickly and painlessly rectifiable by the user. Remember, you will not be around to tell users what they have done wrong, so you must make sure they have all the information to hand to carry on with their task individually.

So let’s take a look at a how not to handle errors on forms:

So what’s wrong with this error handling? A few things are unsuitable here.

The first thing that I spot is this: (Message 1500). What benefit does this have to the user? Well to the average Joe Blogs this means absolutely nothing. But to myself, I thought hang on a second. The only benefit of having an error code is to identify which error has occurred. So, on this mystery website I decided to do a search for this Message number. To my disappointment and surprise… no results for Message 1500, however other message numbers were displayed. I tried the other 2 Message numbers shown in the hope they would be more fruitful. Alas no results for them either. So, in conclusion, do not put meaningless information in your error messages. Especially if they do not immediately help the user to fix the problem.

Perhaps in this instance they could have hyperlinked or tool tipped the message numbers to further information. I think this would be overkill for this situation but it’s an idea for more complex errors.

The error messages themselves are rather lengthy. You should try and keep them to the point and short. This helps save screen space and the user will be more likely to understand the error and faster, as we usually scan text and do not read it fully.

The helpful instance these error messages do have, is that they tell the user how to rectify the problem and they are located next to problem area.

Another common problem is placing errors in useless places.

Apart from not identifying any one problem with this form, the error message has been placed in an ineffective area on the screen. It doesn’t really help the user if they have to read the error message and then scan the whole form for the glitch. It is more time consuming and frustrating for a user.

So what should you consider when designing error messages?

There are 3 things that you should remember each time you are informing the user of an error. I call it the 3 i’s:

• Illustrate – to the user where the error is located
• Inform – the user what the error is
• Instruct – the user how to fix the error

Here is an example of the 3 i’s in action:

This is a good example of error handling. It appears next to the problem area and illustrates where the issue is. It informs the user what is wrong. It instructs the user how to fix the problem.

With these 3 steps you will make the error quicker and easier to find, understand and fix. This will really enhance the usability of your forms and give them a high ease of use factor. Your aim is to give your user a pleasing user experience not a stressful one. So remember to make the bad situations a breeze to walk through.

Users do remember when they could not complete a task, or struggle to do so and this can result in users not coming back for a second go. Do not lose users or customers because of poor thinking when dealing with errors.

Try and help them out as effectively as you can by considering the 3 i’s and writing the error message in plain old English. Keep those jargon words out and do not put in unnecessary information. Keep user goals in mind and remember they did not design the system – you did and you are the one who can help them out of problematic situations.