Intelligent 404's

Apr 22, 09:49 PM—Micah Wylde

Broken links are a reality of web design. You may work tirelessly against them, you may even purchase automated tools to check for them, and yet they will still arise (especially in sites of any size.) So as the problem won't go away, best is to prepare for it.

What is the problem?

When a user tries to access a page that doesn't exist the webserver returns a 404 error page. The default page that the Apache web server (which, being the web server I use and am familiar with, will be used in these examples) is not very user friendly, and for those of your visitors who are not confortable with the web in general, getting this mysterious "Page Not Found" error can be intimidating. Indimidated vistitors is not something you, as the web designer, want.

So what can I do about it?

The solution is two-fold: firstly making a less intimidating 404 error page, and secondly using your visitors to help you find broken links. These steps together will help you eliminate broken links, as well as help users find where they were meaning to go. The examples below are for the Apache http server and the PHP Hypertext Preproccessor. However, if you use another server (unless you use the bug ridden mess that is IIS) it should work the same, except for the configuration of the server to serve the right 404 page. Similarly, if you are more familiar with another scripting language by all means use that. Though I personally believe that for web-applications php is superior to, say, perl.

The Appache Configuration

The appache configuration is simple. Simply create a file in your root directory called .htaccess (or edit the one that is already there if there already is one) and add (or append) this line to it:

ErrorDocument 404 /404.php

The User-Friendly Error Page

Now create in the document root a file called '404.php'. Open it in your text editor of choice. If you are using a templating system like the one I described in a a previous article then you would create this page as a normal page using that template. Otherwise try to recreate in the php the general look of your site. Some usability experts have suggested that the design for a 404 page should be minimalistic, so you can choose if you want to take that route. In large letters in an auspicious place should be the words 'The Page You Requested Could Not Be Found.' Also on this page should be a search box and either a link to your site map of your site map itself. Important to remember when designing a 404 page is to not be too demeaning to your users. Many will be unused to the layout of the web, so insulting them because they mis-typed a url is not a constructive solution. For accordionsoftware.com my error message is this:

Page Not Found

The page you requested could not be found. This is probably because it does not exist. This could be the result of a broken link by a search engine or another site, a broken internal link, or you might have mistyped the URL. Please verify that the URL is correct. We have been notified of this, so if it is a problem with the site we'll try to fix it as quickly as we can. If you're still having a problem feel free to email the webmaster at webmaster@accordionsoftware.com. Thank you for your patience in this matter.

Note that many soft words are used, for instance 'probably' and 'could'. While to us it is readily apparent that this error message came up because the page that the user called does not exist, telling them that in a mean way will not help the attendance of your site. Also, the possible reasons for the displaying of this page are layed out. You can see the full page at http://www.accordionsoftware.com/eowurhaldfh.

Writing the PHP

The second part of the intellegent 404 is some php coding. The purpose of this code is to email the webmaster when a user travels to the 404 error page from a broken link. This is achieved by checking if the referer was your page. If so, it executes the php mail() function (guess what that does) which mails to you the url that the user was trying to go to, allowing you to fix the problem. The code is as follows:

if(ereg("accordionsoftware.com",$_SERVER['HTTP_REFERER'])) mail('wyldeone@gmail.com',$_SERVER['REQUEST_URI']." could not be found","A user from ".$_SERVER['SERVER_ADDR']." tried to access ".$_SERVER['REQUEST_URI'].", but it was not found.");

Of course, it is neccesary to change 'accordionsoftware.com' to your own domain and 'wyldeone@gmail' to your own address. This script is pretty simple. First it tests whether your domain name is found in the refer information, through the function 'ereg'. If it is found, it dispaches an email to the address listed with extra information, such as the ip address of the user and the page that they were trying to access.

Where to go from here

Using this strategy you can create incresinly intelligent 404 error pages. For instance, by testing if the referer is any of the major search engines, you could let the user know that the search engine's link is out of date. If the refer information is from another site that has a link to you, you could both notify the other site that their link is out of date and notify your users that this is the case.


Search:


This site is a collection of musings and articles on varied topics such as web standards/css, programming, digital rights, and, well, accordions.

Categories

Recent Articles:

Feeds

Links