Andy Moore

Making something nice and user friendly from something as ugly and unhelpful as a basic 404 is easy. Making it so that it logs the error and reports it back to you is good practice and should result in a better managed website with less errors.

If your 404 page looks like that you’re letting your users down when you could do a little something to help them out.

A bog-standard 404 page isn’t very helpful. It tells the user it hasn’t worked and tells them you’re not that bothered about it. A 404 like that on a site is a bad strike, I give a site three strikes before it’s binned. How many users only give one strike?

What makes a good 404 page? This is mine from one site I run:

It’s clean, crisp, simple and doesn’t bog them down with a million links. It’s quick and to the point. It says “We screwed up, we’re sorry” then moves on.

The main things is to apologise to the user, it’s your fault, not theirs, so offer some helpful links or redirect them to your index page.

If there’s no link to your index page, no option to search, no apology, or no redirection there’s nothing to persuade them to hang around and execute your call to action.

People are less likely to buy, click, subscribe or register if they get a bad impression from basic errors like 404s. A site riddled with bad links isn’t much fun for the visitor.

Some time back I needed a tool that’d tell me about all the files missing on my site, I wanted to be able to see which files were 404′ing the most and also be able to monitor errors in real-time. I got sick of pressing F5 to reload the standard cPanel error log.

How to handle Error 404s gracefully with .htaccess

Providing your hosting environment supports it and your administrator has it enabled htaccess is the business:[code]## catch error 404s and send them to error-404.html
ErrorDocument 404 /error-404.html
## catch error 404s and send them to a script
ErrorDocument 404 /index.php?error=404
## catch all error 404s and just echo text
ErrorDocument 404 “Ah bugger, it’s a feckin’ 404″[/code]There are thousands of tutorials to do this if you need them.

The three examples we use above are.

1. Loads the page contents of error-404.html
2. Loads the contents generated by a script
3. Returns plain text statement inside the quotes

The 404 handling script I wrote handles the errors and logs them to a database. I can either view a historic report with a count of how many times that error has happened or a real-time report which will update the document before my eyes showing errors as they happen.

You’ve seen the friendly 404 page above, that’s generated to the user, the back end logs the error and gives us two reports to view it in.

Report 1 = Real-time AJAX / auto-updating -Working demo

Report 2 - Historic view - Working demo

You can download the script here, it explains what you need to do along the way but the basics of it are outlined here.

First you need to set up your database with the table we’ll use to log and report back missing files:[code]CREATE TABLE `ERRORLOG` (
`id` smallint(6) NOT NULL auto_increment,
`url` text NOT NULL,
`date` timestamp(14) NOT NULL,
PRIMARY KEY (`id`),
KEY `date` (`date`),
FULLTEXT KEY `url` (`url`)
) TYPE=MyISAM COMMENT=’404 logging ‘ AUTO_INCREMENT=1 ;[/code]Then we need to configure our .htaccess file to catch all missing file requests and point them to a script:[code]ErrorDocument 404 /errorlog/index.php?log[/code]Now we need to setup a few variables in our script. [php]// configuration variables
$host = ‘localhost’; // your database host - usually localhost
$uname = ‘xxx’; // your database username
$pword = ‘xxx’; // your database password
$database = ‘xxx’; // your database
$table = ‘ERRORLOG’; // database table name
$results = ‘30′; // how many results to show when viewing the report
$homepage = ‘http://www.andymoore.info/’; // your main url - include the http://
$seconds = ‘4′; // how many seconds to wait before redirecting a lost user
$daysdata = ‘30′; // how many days of data to store in the database[/php]If you’re following this you’ll now have your database set up to log errors, your .htaccess file pointing 404s at a script and some basic variables so the script knows about it’s environment.

That’s really all there is to it, create the database table, set up .htaccess to catch the errors, configure the variables prior to upload and it should work.

This entry was posted on Saturday, January 27th, 2007 at 12:29 am and is filed under usability. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.