Error 404: Customize your Broken Links

Most people have seen them, and you can force one by misspelling  any web address. Error 404 pages have become a part of a website’s personality in the past few years as opensource blogging platforms like WordPress have included the file in their standard setup. You can also make one from scratch if you aren’t using a pre-defined framework and most browsers will bring up that page when an address that does not exist on your server is entered. The 404.php (or .html) file allows the developer the ability to customize what is shown on this page, and even provide extra features. To define your own, you may need to find your .htaccess file (for Apache based servers) and update where it sends the user with ErrorDocument 404 /path/to/your/error/file which is relative to your home directory. If you don’t feel like doing that, you can always borrow a pre-made script and toss that into the skillet.

The standard 404 page looks like this:

A customized 404 page can look like any of the following examples, which are modeled after the theme of their relative sites:

http://www.bioneural.net/404/

http://www.mensunderwearstore.com/404pagenotfound

http://www.ateaseweb.com/404.php

http://www.youcastr.com/404

http://bluevertigo.com.ar/error_404.html

Some features to consider adding to your own 404 error page are building them into your theme, having suggestions for other pages, possible explanations, and including a comical image. One factor to consider is that the user who arrives here may have done so without knowing why what they entered did not take them where they wanted to go, so making it easy for them to get to your home page or a related page is very important. On this same line of user-friendly thinking, don’t overload them with options. One way to do this is with a static list of your main links like Heinz does: http://www.heinz.com/404

Alternatively, you can include a search bar so that the user can utilize your internal search and possibly have better luck. With a blog setup, you can use plug-ins like Related Posts just like you would at the end of an article.

A more advanced tactic includes tracing how the user arrived at the 404 page.  This allows you to explain that either you can’t control the link another person has posted outside your site, or explaining to them that they may have arrived at a problem area, and it is being addressed. You can parse the url they entered, retrieve the keywords they entered to find the link, and then use that information to populate ideas about what they may have been trying to find. To do this you need to find out where they came from, what it was they wanted to find, and where they go afterwards.

Post some code

Do:

• Suggest other places for the user to go, like your homepage
• Let them know they arrived at a page that does not exist
• Style the page so that they know they are still at your site, or know they at least arrived at the correct domain

Don’t:

• Make the user feel like it is their fault that they arrived here
• Force reliance on the “back” button

A note to dabblers who have tools included with their hosting for custom 404 pages: most of these write horrible code, and can really make search engines not like you. Yahoo is one example, where their default from the tool is to direct 404 traffic to the site’s homepage with a 302 redirect. Google hates 302 directs as they are intended to be temporary and not counted towards any aspect of your SEO.