404! Help your users a little when things go wrong
It's been a while and we need to do better! So here's a quick post about building and showing useful 404 error messages for your users when things go wrong... It's aimed at informing you as a client in what to ask your web design company to do...
What is a 404 page?
There are alot of boring status codes attached to web pages when things go wrong (if you are that way inclined have a look at this list!.) The most common of these is the “404 error code” which simply put means a visit to a page or resource (i.e. an image) on your website which doesn’t exist.
Why would users see a 404 / page not found page?
There are 3 main reasons but probably plenty of others:
- A user goes directly to a page but mistypes the page address.
- You mistype a link on your website and then a user clicks it and finds themselves at a page which doesn’t exist. Alternatively someone else links to your site using the wrong page.
- You redesign your website and update the web pages that your website has. As part of this process you put up new pages and take down old ones or the new web company decides to change the page addresses to smarten them up. Maybe they change the about page from ‘http://yourwebsite.com/about.htm” to “http://yourwebsite.com/about-us/”. For a period the search engines will continue to hold your old pages in their index so people might search for you and be taken to a 404-error page. In this case also, where other sites have linked to you, those links might stop working too.
What not to do?
I thought this was worth writing a quick post about because just this week I’ve seen a couple of websites where the 404 page I’d term as a “total failure” 404. This is when the site displays an unhelpful 404 message that is just the server’s default page. Often times this can appear as just plain confusing to users. Here are two examples of what these might look like below:
As you can see – neither is particularly nice or helpful to the user and may just add to a little niggle of frustration (although the second is slightly better than the first – at least attempting to explain a little.) In some cases your user might just exit your site completely and go elsewhere, especially if they have found their way there using a search engine.
What to try and do:
The best way of approaching your 404 is to think about what you would like your users to see if this is what they saw on first visiting your site (for whatever reason). Some key principles:
1. If you can, keep the general site navigation and treat it like any other page.
2. Be helpful. Offer users a way out and a way to move forward. For example you could include a site map or if your site has a search function – display a search box on the error page.
3. Say sorry! and possibly with a hint of humour to lighten the mood. To try and keep your users onside – apologise but in a no-nonsense tone of voice. Allow them to get in touch with you and report the problem. Obviously this all depends on what overall tone of voice you are using on your site in general.
For coldpie we tried to roll all these things together into our 404-error page. Take a look!. It doesn’t need to be complex or time consuming and you only need to create one error page which will then stand you in good stead moving forward.
Further reading
A few web magazines have taken some time to write up in more detail some of the ideas surrounding constructing 404 error pages. Others have also focused on the “Art” of 404’s – where designers have gone out of their way to construct delightful and sometimes beautiful error pages. As a good starting point I would suggest taking a look at the posts on Smashing Magazine:
How to prevent things from happening in the first place
It’s probably worth noting that you should also try and prevent your users from seeing the 404’s where possible. There is no stopping them from mistyping a page name – however you should try to prevent broken links and try to ease the transition from an old site to new.
To check links try the w3’s page at http://validator.w3.org/checklink. Here you can check your whole site in one swoop.
Automatically forward on old pages to new ones. At coldpie we often will spend a few hours at the end of a build setting up a list of what old pages that will automatically forward to new ones. This will help Google and other search engines to update their index. Whilst you are there though make sure to use the correct headers when forwarding to the new page. Take a look here for more info. If you have any questions give me a shout in the comments.
Tags: client-help, error-pages
