10 things a Good 404 Error Page Should Contain:

  1. Link to the sitemap – remember that sitemap is the only page within your website with direct links to all pages of your website. It’s a great place to search for specific web pages on your website. A sitemap gives a user orientation in your website, how its constructed and how can they find the correct web page.
  2. A search box – if you use any kind of search within your website you should include search box in your custom 404 error page to make it easier to the user to find what they are looking for.
  3. Custom 404 page should be written in plain, easy to understand language (doesn’t matter if its English or any other language, it has to be understandable).
  4. It should have a short message explaining why a user is seeing this web page, what went wrong and what are possible reasons for that. You should also apology for any inconveniences that caused. Dont blame the user for visiting your error page.
  5. It should link to the most important pages of your website like category pages, FAQ section, main product areas, login screen, home page etc. depending on your business area, website size and your goals.
  6. It should have an e-mail or contact form to message the webmaster about the broken link and advice for help.
  7. No ads – they just stand in the way to deliver the right message to the user.
  8. Do not use any kind of redirection, let user read the whole page and do what they want, don’t force them do go anywhere.
  9. Custom 404 page should NOT look exactly the same as any other page of your website. It has to be minimalistic. You should not put your all site navigation into the 404 error page as it will only distract people from reading the message. Focus on delivering the message: “Why are you seeing this website, what can you do now and where to go next. Don’t worry my user, i will guide you through to the page you were looking for. Thank you for your patience.”
  10. Custom 404 error page should be more than 512 bytes of size as Internet Explorer version 5 and below do not display custom error pages if they are less than 512 bytes of size. This does not include images. If your page is less than that, you may add some text in comments in your page code. This will increase page size and will be displayed correctly by all web browsers.

What is 404 (File Not Found) page anyway

404 page is a page displayed by web browser by default when a user tries to access a site that does not exist on a server. For example if you mistype an URL, the site will not be found and your web browser will display the 404 (File not found) page.

404 is a HTTP status code [status code definitions, document RFC 2616 of W3C] indicating that the client was able to communicate with the server but either the server could not find what was requested, or it was configured not to fulfill the request and did not reveal the reason why – from Wikipedia.

It generally means that there is no file on a server that fits your request and no page can be displayed.

Why 404 error occurs?

There are several reasons why you encountered an 404 (File not found) error:

  • mis-typed URL
  • a link that is out-of-date (from search engine listing or other websites)
  • internal broken link

Creating custom 404 page

404 (File not found) error message

The standard 404 page doesn’t look to inviting, does it? And your customers will think the same. Its not good. With that page the chances that a client will stay at your website are very, very small.

To change that you need to create your own, custom 404 error page in order to keep clients on your website.

How to setup custom error page

When you have prepared your custom 404 error page according to the guide above you need to upload it to your serve and give instructions to the server to display your custom 404 error page instead of default one.

To display your custom error page instead of default one insert the following code to your .htaccess file:

ErrorDocument 404 /AnErrorPage.html

and change the AnErrorPage.html with name and extension of your custom error page. Also don’t forget to put the correct path to the page on your server. In the case above i assume you place your error page in root folder together with your .htaccess file.

Test you new custom error page to see if it works.

Now if anything goes wrong there are better chance that a user will stay at your website instead of leaving it and never coming back.

Congratulations, you just made your site more user-friendly!

Sample custom 404 error pages:

BBC – http://www.bbc.co.uk/anerrorpage.html

CNN – http://www.cnn.com/anerrorpage.html

Apple – http://www.apple.com/anerrorpage.html

OrangeCoat – http://www.orangecoat.com/a-404-page.html

[Update, September 18, 2008] Should you put analytics codes on 404 page to track it? – thats one of the key phrases [not exact] a user searched for in Google and entered this site. Its a good question actually.

Putting an analytics (any kind of analytics software, not only Google Analytics) onto a 404 error page have advantages. You will be able to check how many times a user encountered a 404 page, from where, where did the user go afterwards, how much time did the user spend on the site. It’s all great information to have.

With those information you are able to see if your 404 page is working properly, meaning is it keeping users on your site or are they leaving your site. If they leave your site immediately, check why and fix it.

You will also be able to check why a user encountered your 404 page. If there is a broken link within your site you can track it and fix it.

Putting an analytics code onto a 404 error page is a good way to improve its goals and help satisfy your visitors and help improve your site usability.

Another good way is putting a special prepared code into your 404 page in that way to receive an email each time a user encountered your 404 page. The script should also send you information about referring URL that caused that error and generate custom message for each user explaining what happened.

Together with analytics software it should work great giving you all the information you may need.