Custom 404 error pages

What is a 404 error?
A “404” error, also known as “file not found” occurs when a visitor to your website tries to access a page that does not exist. This can happen for a variety of reasons including deleted pages, misspellings, broken links, or outdated search results.

If your site is hosted on web.mit.edu, you can customize the look and feel of this error message to fit with the rest of your website. For example, it might have your office or department logo and contact information. Any directory or subdirectory on web.mit.edu can have a custom 404 error page, but typically there is one per locker or website. You can see an example of the Web Reference custom 404 error page at http://web.mit.edu/ist/web/reference/nosuchpage.html.

Why a custom 404 error page?
Pages move, links break, URLs get misspelled - visitors to your site will most likely be faced with a 404 error page at some time. MIT's 404 error page will not help visitors find what they are looking for on your organization's site. Visitors are left with no choice but to back up and try again. If they have an incorrect URL to begin with, they may just leave feeling frustrated. Providing a custom 404 page that includes your identity, main navigation links to your site and a search box will help visitors to your site find what they are looking for. Usability studies show that visitors who find what they are looking for rate the website as more professional, a site they want to return to, and better overall.

What should a custom 404 error page have on it?
Here are some basic guidelines:

• Start with a simple statement that the requested URL could not be found.
• Have a way for the visitor to contact the site owner or webmaster.
• Provide a link to your organization's home page.
• Give the visitor a search field linked to your site's pages.
• Offer the main navigation to your site.
• Consider providing prominently placed links to the most popular sections of your site.
• Brand your error page with your logo and the look and feel of your site.

How do I create the custom 404 error page?
Use this custom 404 error page template and customize the website name, the links to your home page and contact information or edit an existing page from your website that has the information outlined above. Here is the 404 error page for the Web Publishing Reference pages. We use SSI (server side includes) so we can display the URL that the visitor was trying to find on the error page. This is especially helpful for misspelled URLs. You can also use an HTML page, but you won't be able to display the URL that the visitor was trying to find. Here are two important things to remember when creating a custon 404 error page:

• All image and link paths need to be absolute (e.g. http://web.mit.edu/ist/web/reference rather than ../reference). If the paths are not absolute the error page will not display or link correctly.
• The size of your page should be larger than 512 bytes. Microsoft Internet Explorer thinks any page less then 512 bytes is a poorly written server error message and the browser will display its own error page instead of yours.

What tells the MIT web server to use my custom 404 page?
When the server can't find the URL requested it looks for a .htaccess.mit file located in the root of your website. This text file should include the following line:

ErrorDocument 404 /afs/athena.mit.edu/_your_websites_path_/errors/404.shtml

This file tells the web server that you have a custom 404 page. This is the same file that restricts access to web pages via MIT certificates. Both of these instructions can co-exist in the same file. Here are some sample .htaccess.mit files:

Custom 404 error .htaccess.mit file

Other.htaccess.mit files

How do I start using the custom 404 error page?
Make a directory at the root of your website called "errors". Name your custom 404 error page "404.shtml" and upload it to the errors folder in your website. Upload the .htaccess.mit to the root of your website or the directory for which you would like the custom 404 error page to be displayed.

Test it out
After you've uploaded these two documents to your site, go test it out. Try to go to nonexistent pages in all the directories of your website.