Shit happens. Errors, I mean.

They happen on our websites. And they happen in real life. Sometimes it’s because we made a mistake. Or maybe a system failed. Maybe it really was the user’s fault.

Whatever the cause, these errors—and how they are communicated—can have a huge impact on the way someone experiences your website or app. Often overlooked, an ill-constructed error message can fill users with frustration, and send them packing.

A well-crafted error message, on the other hand, can work wonders. It can turn a moment of frustration (abandonment) into a moment of delight (and ideally, conversion).

Every error, regardless of who is to blame, becomes a point of friction for your users. Well-written error messages can help reduce that friction. As UX designers, we like to reduce friction. So let’s get on with it.

Introducing the 4 H’s

So how do we write, or rewrite, our error messages to keep our users on track?

It’s not that difficult, really. We just need to consider the 4 H’s of writing error messages.

Error messages need to be:

Human

Helpful

Humorous

Humble

Let’s look at these more closely.

1. Human

The number one rule is to make sure your error messages sound like they’ve been written for humans.

There’s nothing more frustrating than an error like this one. It sounds like it has been written by a robot. For a robot.

Put your customer service hat on—think of your error message as a conversation with your user. Make sure it’s polite, understandable, friendly and jargon-free.

The Firefox error message is a better example.

Think about your audience. How would you explain the error to them, in human speak? Write those words down. That’s your error message, right there.

2. Helpful

OK, so your error message is readable. But is it helpful?

The rules to crafting helpful error messages are fairly straightforward. Ask yourself:

Is it visible?



There’s no point displaying an error message if the user doesn’t even see it. Think about the message size, colour and location of your error messages. Make them prominent.

Does it explain clearly what went wrong?



Your error message needs to explain the problem as clearly as possible. And it needs to be specific. A vague error message that says, “An unexpected system error has occurred” is just lazy programming. It’s of no use to anyone.

And most importantly ...

Does it help the user recover?



What do they need to do next? How can they get back to what they were doing, as fast as possible?

3. Humorous

A short sprinkling of humour is often a great way to diffuse the frustration of an error. Keeping your tone light-hearted can help to keep the user on-side—especially if this suits the tone of your brand.

There are plenty of great examples of humorous error messages. Here are just some of my favourites:

When last.fm goes down, it’s always amusing.



When you type too many full-stops when creating a new message in GMail …

My favourite example comes from Yahoo!. Check out what happens when your date of birth is greater than today.



However, be careful with humour.

It’s not always appropriate to use humour in your error message.

It really depends on the severity of the error—users can take a joke if it’s a simple validation problem, or a Page Not Found error. That’s why funny 404 pages are all the rage.

But if things become more serious—for instance, a user losing a significant amount of work—then saying “Oops!” is entirely inappropriate. If my email program had just lost an hour of my hard work, the last thing I would want to see is a cutesy message from a trouser-less chimp.

4. Humble

Perhaps your user is at fault. Maybe your instructions just weren’t clear enough. You know what? It doesn’t really matter.

What does matter is how you deal with the situation.

It’s always better to assume that your site or app is at fault, not your user. You must never imply that the user made a mistake. Always be humble.

And for those times when the fault is clearly on your side, apologise.

Get down on your knees if you have to. Acknowledge that you made a mistake. Don’t try and defend yourself. Say “Sorry”.

Don’t say, “We’re sorry that this occurred.”

Don’t say, “We apologise for any inconvenience.”

Say, “Sorry.” And mean it.

Users are far more likely to stick with you if you’re brave enough to admit that you screwed up.

In Summary

In an ideal world, we’d have no error messages. Your users would float happily through your site, error free. And then they’d ride home on unicorns. Unfortunately, we don’t live in an ideal world. There will always be errors, and there will always be error messages.

Prevention, of course, is better than cure. It is always best to prevent errors from happening in the first place. But when errors do arise, think about the 4 H’s. And use them to turn that moment of friction into an opportunity for conversion.