Broken Links

A 404 page is what a user sees when they reach a page on your website which does not exist. This can be from clicking a broken link, the page they are looking for has been moved, deleted or they have typed in a wrong address.

Why is this important?

Having a custom 404 page is important as it preserves the website’s look and feel and provides a better user experience. It might help you retain a visitor who would otherwise leave when encountered with a standard 404 (Page not found) page.

Step by Step Instructions

Below are instructions for creating a custom 404 page for your website or wordpress site.

Create a custom 404 for your website

  1. Create your custom 404 html page.
    This is the page you want your visitors to be shown when they try to access a page on your site which does not exist.
    Save the file as 404.html and put it in your website’s root directory. (e.g: in /public_html )
  2. Create a file (if it doesn’t already exists) named .htaccess in your website’s root directory.
    The name of the file is .htaccess (and yes that includes the . in front of name).
  3. Modify the .htaccess file.
    Add the following line:
    ErrorDocument 404 /404.html
  4. Test that it works.
    Type a url that you know does not exist and check that you are shown the 404.html page which you have created in step 1.

Note: Not all web servers (especially free ones) might support this functionality. Check with them to see if they support customized .htaccess. Or if you have done the steps above correctly with no success, then chances are your web server does not support customized .htaccess.

Create a custom 404 for your wordpress site

Creating a custom 404 page might be as simple as creating a 404.php in the wordpress themes folder at
http://<your-website-url>/wp-content/themes/<name-of-theme-you-are-using>/404.php
or it can require a few more extra steps. It depends on the wordpress theme you are using.

There is a very good and detailed instruction for doing so on the wordpress website at http://codex.wordpress.org/Creating_an_Error_404_Page

Tips for what to include in the custom 404 page

Just telling your visitors that the page can not be found is not good enough. You need to provide them with a way to find the document they were originally after or they will leave.

Below are some points on what you can include in your custom 404 page.

  • The 404 page should have the same look and feel as the rest of your website.
  • Include a link to your main page, with a suggestion that the visitor can find what he/she wants there.
  • Your web site search engine (if you have one).
  • A link to your website’s site map (if you have one).
  • A form allowing visitors to report the broken link.
  • If you have a blog, consider having a list of popular posts.

Create an animated 404 page.

I found this really cool animated 404 page which you can download and use for your website.
It’s that of a rocket blasting off to space.
Take a look at it here.
Do download it here.

Noteworthy and Entertaining 404 pages

Below are some interesting 404 pages worth checking out to get inspiration for your custom 404 page.

Your Turn

Got a good 404 page? Or know of a cool one? We love to hear about. Share it with everyone in the comments.