We’ve all come across the dreaded “404 Error – Page Not Found” error. Pretty uninspiring and not particularly informative.

This is where the term ‘graceful failure’ comes in. It’s actually okay that you’ve stumbled across a 404 page – it’s there to let you know that the page doesn’t exist, has been moved or you’ve typed in the wrong URL – but why not turn the negative user experience into a positive one?

It’s easy enough to set up a custom 404 error page and you’ll likely have seen these styled up to match the website branding. With some creativity and design you can go a lot further to improve user experience, also ensuring that the user stays on your site. To start with you can give the user some information (in Plain English – no techy speak here) about why they may have encountered an error along with some ‘what next?’ options such as returning to the homepage, searching for the page they were after or consulting the site map (which, incidentally, every website should have).

While you’re there why not change the ‘Page not found’ message to something more creative and in tune with your website’s voice? We can go one better than the generic “Oops, something went wrong” or “Uh-oh, looks like you broke the internet!” by tailoring the message to your website products or services. Good examples of this are Lonely Planet’s “Some places are great to lose yourself in, but not on this occasion” and KitKat’s “Darn, you’ve stumbled across the only kind of break we don’t like”. Then with the addition of an appropriate image, even video, and some suggestions to help the lost user get back on track you’ve probably turned what was a negative experience into a positive one by retaining the visitor, if not enriching their impression of your brand.

So, in summary, when creating a custom 404 error page:

  • tell the user what went wrong;
  • offer some useful places to go next; and
  • be creative!

Here are some examples of 404 pages we’ve enjoyed stumbling upon:

Example 404 error pages
(Credits: Deezer, Lego)

Example 404 error pages
(Credits: Leaf Queen, Teehan+Lax)

Example 404 error pages
(Credits: Magnt, Emailcenter)

Example 404 error pages
(Credits: Launchlist, Heinz)

Example 404 error pages
(Credits: Specialized, Ook)

Top