We have all been there: you’ve searched for something on a website and a 404 page has been returned, saying the page does not exist.
This can be a frustration for the user, but an honest and well-designed 404 page can actually allow you to direct that visitor to other useful information on your website. This is an opportunity to show your users how you handle the customer experience, so that even if something goes wrong, you’ll have a plan in place to deal with this.

1. Don’t Just Rely on the Default

Most good content management systems (CMS) will have a default 404 page built in and therefore, unless you update the page, this is the one that will show if a 404 is returned. The default page may just be a line of text with the error code, that could leave your website visitor feeling frustrated and disenchanted with the website experience. There would typically be no suggestions on where else to navigate to, and the design of the page would usually be blank and unconsidered.
Default 404 page
If the website visitor has clicked through to your website from an external link, only to find that the page no longer exists, then it is unlikely that they are going to take the time to click elsewhere on the site. Especially if the one thing they were looking for is unavailable and you have not freely offered up an alternative solution.
With online competition as fierce as it’s ever been, there really is no excuse for not updating your 404 pages, considering with most modern CMS’ this process is fairly straightforward.

2. Think Outside the Box

So a visitor has landed on your website and they are presented with your custom 404 page. But what does it look like? What do you say? Where do you send them next?
As with any business interaction with your customer, it is worth giving this a bit of thought and considering the approach that you wish to take.

You Could Make It Funny

Humour has a funny way, (no pun intended), of diffusing frustration and if done well, can transform a negative experience into a delightful one. Think about how you can add an element of humour into the page, to gently surprise the visitor.
For example, Bluegg has evolved their 404 page with an even more humorous and clever approach.
Initially, the below feisty goat was the star of the 404 page design:
Funny 404 page example from Bluegg

As I mentioned, this has evolved and now the following sits on the 404 page:
bluegg updated 404 page

Bluegg has made reference to the previous 404 goat, linked to the places that have featured the goat story and also added a cheeky CTA at the bottom of “call us, maybe?” I love it. Perhaps one day, they will cite us on their next 404 page update.

3. Make It Relevant

The visitor is on your website, therefore they clearly have some intent to find out more about what you do. It may work well to include some light-hearted elements of your brand in the way you convey your message.
MailChimp does this well on their 404 page, with the MailChimp monkey featured, looking like the Incredible Hulk.
mailchimp 404 page
Another nice example is the Spotify 404 page, shown below. Reference is made to music and heartbreaks and there is a funky little record GIF.
Spotify 404 page
 

4. Add More Value

This is the ethos that we are trying to follow on the Hallam 404 page. As you can see below, we are trying to add value on the 404 page by offering a link to download our Digital Marketing Map.
We have also included a custom search box feature, so that the user can quickly search and be redirected to content similar to what they were searching for.
Hallam 404 page

5. Be Consistent

Make sure that the page looks as though it fits on your website, as you do not want to confuse your visitor further. The header, footer and overall design should feel consistent with the rest of your website. Think about the colours, images and fonts you use, and make sure that this is in line with your brand guidelines.
Marital Forest

To Re-Cap

Hopefully the above points have given you some food for thought when thinking about how to design and structure your 404 pages.
To summarise the points we have discussed:

  1. Don’t just rely on the default
  2. Think outside the box
  3. Make it relevant
  4.  Add more value
  5. Be consistent

If you have found any great or horrendous 404 pages whilst on your online travels, we would love to hear about them, so feel free to comment below!