Create your own custom “404” error page

Create your own custom “404” error page

It will sometimes happen that a visitor will reach a page that doesn’t exist, has been moved somewhere else, or simply mistypes the address of the page. Rather than displaying the default error messages (“error 404″), you can easily create your own 404 error page.

Step 1: Make a “.htaccess” file

If your site does not already use a .htaccess file, you can easily create one. Open a text editor such as Notepad, and insert the following line:

ErrorDocument 404 /404.html

Save the file with the name “.htaccess” (note the leading period). In case a visitor would try to reach a page that does not exist, 404.html would be visited. Of course, you can also use a PHP file, and you can call it what you prefer (for example, “error.html” rather than “404.html”). If your operating system isn’t happy that you are naming a file “.htaccess”, you can call it something else and rename it after you have transferred it to the server.

You can also create your own pages for other errors, such as 403 (Forbidden), 500 (Internal Server Error), and so on. It would look like this:

ErrorDocument 403 /403.html
ErrorDocument 500 /500.html

Step 2: Make a file for the error message

Now create a page containing the error message, and place it in e.g. the root of the folder for the domain. If you use the above examples, the file names would have to be 404.html, 403.html, and so on. To make the error page as useful as possible, try to include relevant information, such as:

  • A search function
  • Link to a site map or a Help page
  • Feature for the user to report the error

Error pages should not redirect to the front page, especially without letting the user know that there was an error.

For your “404″ error page to be shown in Internet Explorer, its size must exceed 512 bytes — otherwise, IE will show its own error message.

“404″ Inspiration

A lot of creative error pages exist, and some people make a big effort to creating them. You can find lots of inspiration for your error pages here, here, and here.