twitter facebook dribbble email

What to do with a 404 page

Careful! This post is looking a little old and could be inaccurate in many, many ways

The 404 page is one of the most imaginatively designed web pages in a person’s website. A page totally unrestricted by elements such as navigation and headers that are common on most websites. My own 404 page was very bland; it looked exactly like the rest of the website and had only a few links back to the main website. It was ugly and barely helpful.

Redesigning my site provided the challenge to have a go at doing something more creative.

The requirements

Designing an original 404 is all well and good but there are some basic requirements that are needed to ensure the page is useful:

  1. An indication that an error has occurred. This can be through use of language, design or both. In some way the user needs to be able to identify quickly that an error has occurred.
  2. An exit point. Be it a search box or links to a homepage the user needs something more than having to use the back button. Using the back button doesn’t help them find what they wanted. A search box however allows them to search for the information they should be seeing if it still exists in the website.

If you really want to go to that extra level you can suggest exit points based on where the user has come from or the URL they are trying to visit. But be careful, providing the user with too many choices as this can send them running as they become unable to decide what best to do.
The best thing to do is keep your 404 page as simple as possible.

Adding a bit of humour

My website is my personal space; I use it to show off some of my work and write about things I think are useful or have an opinion on. I don’t try to sell my services or any products. With this in mind I tried to insert a bit more humour and personality into the website. One page where I think this worked well is my about page, another is the 404 page.

I wanted to create a page visually distinct from the rest of the website that quickly indicated that it fell outside the normal flow, that had a creative look all while still being useful. To do this I needed a concept that would lead the design and the tone of the language used.

The design concept I came up with, after a few mis-hits was of the site being turned off. Like a power failure the 404 would be the torch or candles in the dark. This meant I could use a dark design that would be visually different from the rest of the site.

404 Design

Many 404 pages read ‘Oops, something’s gone wrong’ or ‘sorry, it seems this page does not exist’. What these do is ensure the user feels they are not to blame for finding the 404, the site instead accepts any wrong doing. However with my sites target audience primarily within the web industry I played around with this formula slightly.

Looking at expansionbroadcast I thought it’s possible to not be so apologetic given the right audience. Although I wouldn’t go as far as to insult the user I went for a more conversational tone like that of my about page.

I’ll not go into exactly what I wrote as you can see the 404 page for yourself, but the text asks the user if they did something wrong before turning back to the website or me as the owner as the source of the problem. Then it’s a case of getting the user back to where they want to be. The language therefore isn’t instantly apologetic but I feel is friendly and doesn’t blame the user for the problem.

Isn’t it a lot of design for a page rarely seen?

Yes it probably is. But web design isn’t always about what is obvious it’s the small touches that elevate a design or the pages rarely seen that done right can actually give people a positive impression of your site or brand.

The 404 page is important because done incorrectly it has the potential to turn users off your site, done correctly it not only gets the user to where they want to be but again can give that positive impression.

Let me know what you think or share any 404 pages you like/have designed.