How to Make a Custom 404 Error Page
Avoid ugly error 404 pages that turn visitors away. Give them the option to stay on your site by giving them a custom error 404 page that looks and feels like your site. Having a broken or old link gives a very bad impression and can lose you a customer before you have had a chance to impress them with your well-designed site.
An error 404 page simply means that the web browser could not find the file you requested. This is termed as a "page not found" error. The server generates an error (404), and enters it in the error log, then it returns the page that it is set up to return as standard. These pages are usually very ugly and look nothing like your site. Furthermore, they look nothing like what the visitor was looking for.
How do people react to error 404 messages?
The vast majority of web users are not technically knowledgeable and do not know what an error 404 message is. They simply know it is not what they were looking for and click back in their browser. Some people know to go to the root of the domain but this is still not what they are looking for. The fact of it is that when most people see an error 404 page they think the site no longer exists and will simply go and find another site.
If you think that this does not apply to you consider the following: In 2 years' time, when you added several sections and changed names, etc., your site will have mutated into something else. The fact is that mistakes can be made, links missed or spelled incorrectly and not checked. Even if your site is perfect, someone can still put a link to your site and spell a file name incorrectly, giving a bad impression of your site through no fault of your own.
A custom error 404 page will help to keep a site visitor, even if they turn up at a page that wasn't quite what they were expecting. A custom error 404 page should tell the user where they are, what page they are on, the likely cause of being there and where they can go to find the information they require. It is all about keeping that visitor and turning them into what they were before they got that error 404 - a potential customer.
The last thing an error 404 page should look like is the standard or default error 404 pages. You should aim to make an error 404 page that looks and feels identical to your site, then, with any luck, most users won't even realise that an error 404 page has been generated and therefore they won't have a tarnished view of your site before they buy.
Use the same colors, logo, buttons, links and navigation as you use on your home page. Then give the users a link to a search page, the home page or other important areas as well as giving them your standard navigation system. With many options the user is far less likely to click back on their browser. One important thing to note is that an error 404 document can be served in any directory e.g. www.yourdomainname.com/PDF/engineering/marketing. This means that you should always use explicit and full file names for any links, images, and so on.
What do the error codes mean?
There is technically an error code, or status code, generated every time a request is made to a web server, even if the request was successful. For example the status code 200 means ok. Codes in the 200 and 300 range are generally successful requests that have a file returned. 400 errors are generally bad errors, which are either incorrect or bad requests. If you have access to your server logs or a good statistics package you can see how many error 404's are actually generated. On one site I maintain the stats package shows that for last week 1.3% of all requests are 404 errors. This may not seem like much but when that 1.3% means 38 requests you can see how many visitors you could be losing.
O.K. This is where it can get tricky. The requirements for setting up an error 404 page depend upon your set up and web server. Generally, you need to have administrator access rights to your server. As most shared servers (the most common type for small business web sites) do not allow you to have full administrator rights you may have a problem. Some good web hosts allow you administrator rights to your directory alone, this is very useful. If you are not sure about this ability ask your web hosting company, as they may be able to set this function for you.
How do you create an error 404 page?
An error 404 page is controlled by a file called .htaccess. The dot prefixing the name is important. It is also important to know that windows and Unix systems treat these files differently as the dot is a hidden windows file. This is often apparent when you want to upload or change a .htaccess file as with some FTP (File Transfer Protocol) packages the file is not visible. To get around this upload the .htaccess file as normal and it will overwrite the existing file.
Another problem here is that windows won't let you call a file .htaccess. What I do is save and upload the file as htaccess.txt and then rename it once uploaded.
Now that all that's out of the way, here's how to make your .htaccess file.
- Open up your favorite text editor.
- Paste this code into the editor:
- Save as htaccess.txt.
- Upload the file to the Top Root of your directory.
- Rename the file as ".htaccess".
- Create and upload the error 404 document filename.html
- Type in an incorrect file path such as www.YourDomainName.com/does-not-exist.html
- Revel in your hard work
ErrorDocument 404 /filename.html
What does it All mean?
The .htaccess file used effectively can be a very powerful tool. It can be used for far more than just creating error404 documents. In this case it simply tells the server that the ErrorDocument 404 is /filename.html rather than the default ErrorDoocument 404. If this command were not in .htaccess or if there was no .htaccess at all then the default 404 error document would be displayed.
The .htaccess file can be used to stop certain user agents from visiting the site e.g. - an annoying spider that won't obey the robots.txt file. It can be used in conjunction with .htpasswd to password protect a directory as well as many other things.
In Conclusion
Having a custom error 404 document may not seem like a big deal but when you consider that it needs no maintenance, does not cost anything and keeps your potential customers on your site becomes a smart move. By holding on to your customers you are keeping them on your site ready to buy from you, not your competitor. This is a classic example of the phrase "prevention is better than cure."
The important things to remember are:
- Make sure you have the dot in the .htaccess file.
- Make your error 404 document look like every other page on your site.
- An Error 404 page stops bad and out-of-date links tarnishing your image and keeps customers on your site.