Back to Website Launch Checklist

How to create and set up a custom 404 error page

How to create and set   up a custom 404 error page

Let's face it, sometimes things go wrong. Maybe you've moved a page and forgotten to 301 redirect it, or maybe there's a typo in an external link to your site. Whatever the reason, 404 errors happen a lot and it's good to be prepared. A custom 404 error page shows users that they're still on your site, and makes them considerably more likely to continue their visit instead of just closing the window.

How to create a custom 404 error page

Creating a custom 404 page is really straightforward, but just requires a tiny bit of behind the scenes tinkering in your .htaccess file. This is a small file in your website's root directory which allows you to configure certain aspects of your server. If you don't have this file, simply create a blank file in your root directory called ".htaccess".

Once you've found or created your .htaccess file, you want to add the following line to it:

ErrorDocument 404 /404.html

This tells your server to send the user to the page 404.html any time they encounter a 404 error. This can be any URL you like, but do make sure to create a specific page for this error (i.e. don't redirect to your home page, as that's only going to confuse people.)

Once you've got .htaccess set up, build a web page as normal in your chosen file (404.html in our example) and you're good to go! Read on for a few ideas of the kind of content you should be including in your custom 404 error page.

What to include in a custom 404 error page

The error message

Even though this is now just like any other page of your site, remember that it still serves a very specific function - to tell users that they've encountered a 404 "page not found" error, so be sure to mention this clearly on the page. You can word this however you like - apologise, or just explain that something went wrong.

Links to the main sections of your website

Bearing in mind the user probably wants to be on your site, but not on an error page, it's your goal to make it as easy as possible for them to find what they were originally looking for. If you have a huge site this may not be possible, but on most sites you'll have a fair idea of the main sections that most of your users head for, so why not include a list of common links to help them on their way.

A search bar

A last resort for some users, a crucial piece of functionality for others - a working search bar on your 404 page will allow users to simply type in what they were looking for and find it immediately. You can even integrate Google Custom Search Engine into your website if you don't already have search functionality built in.

Hopefully this article has helped you get to grips with custom 404 error pages. It's a detail which is often overlooked as we generally design the bits of a website which we want people to see - but a little time spent on it can save you some valuable traffic which you may have lost otherwise.

  Back to Website Launch Checklist