Webpage Coding
Getting Started
#1 Example Webpage
#2 Adding CSS
Compatible CSS
#3 Adding Metadata
#4 JS Masked Email
#5 Sharing SSIs
#6 Support Testing
Password Access
Custom 404 Page
Next section...
JS Applications

Webpage Coding

Customised 404 Error Page

When a webserver receives a request for a particular page it retrieves it from the filesystem and sends it back in the HTTP stream. If for some reason the resource cannot be located then the server instead returns a 404 error code in to the HTTP stream, when the browser receives this it will display its default 404 page.

404 The page cannot be found.

All in all it is fairly obvious that an error has ocurred, but this default error page is ugly. Fortunately the Apache configuration allows an error handler to be set, on triggering a 404 error the server can be directed to return a specific 404 page instead.

This is a far more elegant solution, there is still an error but now it is possible to produce a page that still looks like part of the main website and can also contain any content and further links that you require; perhaps an apologetic comment, an email link to report the problem and links back to the main website.

.htaccess 404 Error Example

The required configuration is quite simple requiring the 404 page itself and a .htaccess file in the top-level directory of the website.

The 404 page is exactly the same as any other page on the website, ideally it should use the same structure and template so that it matches the look of the rest of the site exactly.

The .htaccess file should contain the following line, the final part of which should contain the absolute path to your 404 page.

ErrorDocument 404 /404.shtml

And that is it, a very simple addition to the website that will enhance the overall user-friendliness.

This doesn't solve the error itself though, to do this requires a rather more sophisticated application, this will be discussed in a subsequent section under Web Applications: Custom 404 Error.

Show Style-Switcher...