How to setup Custom Error Pages

- Tuesday, January 24, 2012

Custom Error Page allows you to have your own custom personal error pages instead of using the web hosting provider’s error pages or having no page. This makes a website look very much professional in the unlikely event of an error. Web master can also write scripts to notify him if there is an error.

Example: I use a PHP script on to automatically e-mail me when a page is not found. These are some of the most common errors:

• 400 - Bad request
• 401 - Authorization Required
• 403 - Forbidden
• 404 - Not Found
• 410 - Gone

The .htaccess file is what Apache web servers use to allow you to fine-tune your web server configurations at a directory level. Other types of web servers handle the customization of 4xx error pages differently.

How to Set Up A Custom Error Page

Step One

• Creating/Modifying the .htaccess File: You can simply create one with a text editor (such as Notepad on Windows).
• If you are using Notepad on Windows, you will need to enter ".htaccess" (including the opening and closing quotation marks) into the "Save As" dialog box when you create the file, otherwise Notepad will append a ".txt" extension when it creates the file.
• Add the below line of code in .htaccess file. You will of course need to put error-4xx.html files in the main web directory for the above directive to work. The "ErrorDocument 4xx" directive essentially tells the Apache web server that it has hit a 4xx error and and use the document specified in the URL that follows.

//Custom 400 errors
ErrorDocument 400 <local-path>/error-400.html

//Custom 401 errors
ErrorDocument 401 <local-path>/error-401.html

//Custom 403 errors
ErrorDocument 403 <local-path>/error-403.html

//Custom 404 errors
ErrorDocument 404 <local-path>/error-404.html

//Custom 410 errors
ErrorDocument 410 <local-path>/error-410.html

Step Two

Creating Your Error Document File: http://www.example.com/error-4xx.html
It is not good enough to simply let your visitors know that the file could not be found. In order not to lose them, you will need to provide them some way to locate the document they want, or they will leave.

Your page should have one or more of the following things:

• A link to your website homepage.
• If you have a search form for your website, you should definitely put a search box on that page.
• A link to your On-Page Sitemap, which lists all the pages on your website.
• Has the robots meta tag: ‘noindex, follow’
• Has a unique Title Tag
• Has normal crawlable navigation on-page
• Does NOT use any form of redirection

Step Three

Testing the Error Document - When you're satisfied with your page, upload it together with your .htaccess file to your website. Then test it by typing a URL that you know does not exist. Your error page should load up. From this error page, test to see that the links here lead to the pages you intended it to lead.

• Do NOT Use Canonical Tag: Using a Canonical URL tag in Error will create a serious URL confusion for search engines. Example: A homepage link in canonical URL tag of 404 Error page.
• Do not use relative URLs in the Custom Error Pages
  <a href="sitemap.html">Site Map</a>
  instead use absolute URL
  <a href="http://www.example.com/sitemap.html">Site Map</a>
• Use Descriptive and Unique Title Tag.
• Has Normal Crawlable Navigation (header, footer and left/right navigation)
• Has the robots meta tag: ‘noindex, follow’ <meta name="robots" content="noindex, follow" />
• Use relative URLs in your .htaccess file and not absolute URL or else it will cause Apache to issue a redirect to the browser rather than a hard 404 error. This is generally a bad thing, because Web robots (e.g. search engine spiders) won't be able to find broken links easily.
  ErrorDocument 4xx /error-4xx.html
  ErrorDocument 4xx http://www.example.com/error-4xx.html