Errors

Error messages help to prompt users when something’s gone wrong.

It doesn’t matter whether they’ve misspelled a URL or we’re carrying out maintenance on our end (like a 503 error). The message should be succinct, reassuring and useful.

Validation

Build services that are flexible enough to allow users to give data in a way that they would naturally. For example we should allow users to enter a postcode in upper or lower case, with or without a space.

Validation errors should only be triggered on mandatory fields. They must be factual and help the user move on.

Example

There's a problem

Check the form. You must:

  • Enter your full name
  • Enter an email address

Enter your full name

Enter an email address

Find out more about how we design forms or about validation messages.

404 page not found

Users see a 404 page when they follow a broken link; from another website, from our website, from search results, by mistyping a url or following a link to a page that we’ve moved or deleted. It’s a frustrating experience for more confident users, and troubling for the less experienced.

A good 404 page:

  • reassures the user
  • helps them get back on track
  • doesn’t make them feel as though they’ve done something wrong

Basic 404 page

Update the standard 404 page with this message.

Example 404 page content

This page doesn't exist

You may have followed a broken link or we may have moved or deleted this page.

Go back to the [service] homepage

You can:

  • check the link and try again
  • go to [the service] to find the information you're looking for

Advanced 404 page options

Make a guess about what the user might have been looking for

Add some code to your 404 page that displays a url, taking common misspellings into account.

There’s more information about how to add this to your 404 page here: alistapart.com/article/perfect404

Page content: Were you looking for this page? [show the whole url]

Use custom messages that reflect how the user arrived at the 404 page

Show a message that tells the user in more detail what has happened. In some cases, we can even take the opportunity to thank them for making us aware of a problem.

Use these custom messages for the following scenarios:

Mistyped URL or out-of-date bookmark

Page content: There isn’t a page at this address. Try searching for the page you were looking for or go back to the [service] home page.

Broken link on one of our pages

Page content: Thank you for finding a broken link on our website. We’ll fix it as soon as we can. In the meantime, try searching for the page you were looking for or go back to the [service]home page.

Broken link on somebody else’s website

Page content: It looks like you followed a broken link to our website. We’ll try and let the owner of that website know about this problem. In the meantime, try searching for the page you were looking for or go back to the [service] home page.

Broken link from search results

Page content: Thank you for finding a broken link to our website. We’ll fix it as soon as we can. In the meantime, try searching for the page you were looking for or go back to the [service] home page.

503 internal server error

People will see one of our 503 pages if our server is not available, either because we are carrying out some work or because it is getting an unusually large amount of traffic.

A generic error message, given when an unexpected condition was encountered and no more specific message is suitable.[56]

A good 503 page:

  • reassures the user
  • is honest about what has happened
  • gives the user an alternative

You’re doing planned server maintenance

Show this message when the website is not available because of work being carried out on the server.

Page title: We’re doing some work on our website

Page content: Try refreshing your browser window. If that doesn’t work, try again later - [a few minutes] should be enough.

If it’s an emergency and you need to speak to someone, call us on [service contact centre number].

An unexpected problem has happened

Show this message when the website is not available because of an unexpected problem (like an unusually high volume of traffic).

Example 503 page content

There’s a temporary problem with our website

We know there’s an issue and we’re working to fix it.

Try refreshing your browser window. If that doesn’t work, try again later.

If it’s an emergency and you need to speak to someone, call us on [service contact centre number].

Feedback

Did you find what you were looking for?