I’m Dudley Storey, the author of Pro CSS3 Animation. This is my blog, where I talk about web design and development with , and . To receive more information, including news, updates, and tips, you should follow me on Twitter or add me on Google+.

web developer guide

my books

Book cover of Pro CSS3 AnimationPro CSS3 Animation, Apress, 2013

my other blogs

Massive Head Canon: Intelligent discussion of movies, books, games, and technology.

my projects

A Sass color keyword system for designers. Replaces CSS defaults with improved hues and more memorable, relevant color names.

CSSslidy: an auto-generated #RWD image slider. 3.8K of JS, no JQuery. Drop in images, add a line of CSS. Done.

tipster.ioAutomatically provides local tipping customs and percentages for services anywhere.

Create A 404 Redirect Page

seo / search engines

Estimated reading time: 1 minute, 39 seconds

What if a link doesn’t work on your site? Mistakes happen, after all. Pages move, filenames change… it’s even possible that the user has typed in the right domain name, but completed the page name incorrectly.

The traditional response to this is the familiar "404 — Page Not Found" error, which is almost completely useless. Wouldn’t it be better to guide and inform the user? If they got close enough to get the domain right, they probably only need a nudge in the right direction to find the page they were after.

Fortunately, we can do just that. There is another special file, called the .htaccess file, that functions as a “trap” for occasions like this. (It can also be used to make password–protected pages, among many other functions). Note that not all web hosting providers will allow you to create or modify an .htaccess file.

The .htaccess file is a plain text file. For our purposes here, it contains a single line:

ErrorDocument 404 notfound.html

In this case, the .htaccess file is instructing the browser to find a page in the current directory called "notfound.html" in response to a 404 error. All we have to do is create the notfound.html page and upload it.

What should this page contain? Well, first of all, it should look somewhat like the other pages in the site. An almost–blank page will not help much more than the standard 404 browser error. Second, it should contain navigation to the most important areas of the site. A search form is often placed on the page, as is a link to the web site administrator (since if the user clicked on a link and ended up here, you should know about it). Aside from that, a 404 page can contain almost anything.

A custom 404 error page allows the user to find their way back into the site if they’ve fallen through a crack. It also lets them know that you care enough about them to put them back on track.

comments powered by Disqus

This site helps millions of visitors while remaining ad-free. For less than the price of a cup of coffee, you can help pay for bandwidth and server costs while encouraging further articles.