Customizing Error Pages

How many changes have you made to the structure of your website? 10? 100? Maybe a lot more? Over time as your site grows, this number will increase, especially if it’s a dynamic site like WordPress or other CMS.

Now, how often have you typed the wrong thing by accident when entering code? It happens all the time, no matter how careful you are – and we’ve come to the point that a lot of people rely on spell-checking. But those programs just make sure it’s a real word, not necessarily whether it’s the right word for the context. And if you’re creating an entire website, is it realistic to think you are going to catch ever single such possible error yourself? You certainly hope to, by going through the website, but there’s always a chance you’re going to miss something that leads to a link not working correctly.

When that happens, and someone clicks on that broken link, they are sent instead to an error page – most commonly with a 404 error. We’ve all seen this page before; it lets you know that the server can’t find what you wanted. This will make the user think that you aren’t keeping your website up to date, but even worse, there’s no way for them to tell you about it. So you have no idea about this problem.

Hosting providers now very often take advantage of this and actually make money off it. I know this might surprise you, but it’s true. If you have not created your own error page, then they have the server set up to send *your* website visitor to an error page that advertises *their* services. Now why would you want to give them free advertising on your real estate like that? You may be surprised to hear that’s a 7-figure industry.

How can you not only stop them from stealing way your website visitors and recapture that potentially lost traffic? It turns out to be quite simple, but you need to be a bit technical to do it.

With most web hosting providers, you can at least partially customize some aspects of the server configuration. I’m going to show you how to do this for Apache, which is the most common web server software in the world. You can also do this with IIS or other web server software; you’ll just have to look up the exact details.

First, you need to develop an HTML template page your error pages. To maintain consistency with the user so they still feel like they are on the same website, you want it to look similar to your main pages. You may not be able to make it exactly the same; the important thing is that it clearly belongs to you.

Next, you will need to decide what content to display on the page. You should let your visitors know that they have stumbled across a dead link, but you also want to provide a streamlined method for them to find their way back to your site. I recommend using the appropriate error message in the page title and at the beginning of the page using h1 tags. You should append a description of the error message to your page title and display this description using h2 tags in your page.

Example:
Error 404: The page you are looking for was not found

Error 404

The page you are looking for was not found. Please check the URL and try again.

 

Now you need to provide a easy “one-click” path to your website. This can be accomplished using a simple text link in the page footer.

Example:
Error 404: The page you are looking for was not found

Error 404

The page you are looking for was not found. Please check the URL and try again.

To return to the [Company Name] homepage, click here.

Now, upload your template as error404.html to your website’s root directory (usually public_html).

To get this new template to be displayed whenever a website visitor tries to access a non-existing page by clicking on a bad link, you just need to create or modify your a .htaccess file, using your favorite plain text editor, put this line into it, and then put the file in the root directory (usually public_html) of your website. Most of the time, you will probably already have an .htaccess file.

ErrorDocument 404 http://yourdomain.com/error404.html

(WARNING: Only experts should ever try to change their .htaccess! You can end up taking your site down completely.)

Now you just repeat this process for each type of error that you want to provide a custom page for. Adjust the filename and ErrorDocument statements appropriately for each error page. To gather a complete list of server response codes, search Google™ for “Apache error codes”. (Adjust as needed for your server software.)

If you are using WordPress specifically, one of the best ways to accomplish a good 404 error page is to first make a backup copy of your old 404.php, make a copy of your index.php file, name it 404.php, edit the guts of the file to get rid of any normal content and instead supply special text for your user. This will give you 100% consistent branding for the page, so your user is less alarmed when they see it, while asking them to let you know about it. Now, you might be thinking, why don’t I just have the system notify me when someone hits that page? The reason you would not want to have this page notify you ever time somebody hits is that, although you may not know it, web robots are crawling through website all day long, and you’d be getting tons of pointless emails.

As you can see, this process is extremely simple and only takes about five minutes. If you are good with HTML and you have a Google AdSense™ account and other affiliate accounts, you can easily customize your template to include your AdSense™ search box and your affiliate links.

Be sure to contact me if you need error page customization.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s