dnomaid

YouTube

GitHub
500px
Keybase

Blog
FaQ
Tech
About

Next Post »

« Previous Post

Many default 404 pages are rather bland and don’t really give you much information, so I thought I’d write something to help you make yours more interesting.

The default Apache 404 page
The default Apache 404 page

The first thing you’ll need is the error code itself, “404”. Most people know what this means, but you should also write something like “The page you requested could not be found” just in case. Make sure to use interesting fonts and make it match your site. Don’t make it blank page with “404” on it, that’s boring and defies the whole point of having a custom one.

So now you have a page that matches your site, and has “404 Not Found” on it, however it’s still rather boring and doesn’t really give anything you can do. Maybe add a link to your homepage or a search box to help get your visitors on the right track.


/img/posts/Making a decent 404 page/github.gif

I particularly like GitHub’s 404 page, as it has a neat animation that reacts to your mouse, a search box and some links to see the site’s status. Try to find some 404 pages you like, and take bits and pieces from each of them.

To help you along, here’s some more 404 pages I like:

Medium. It’s simple, and gets to the point, without huge images and blinking text.
Medium. It’s simple, and gets to the point, without huge images and blinking text.
LEGO’s 404 page has a LEGO figure and gives information on why you might have found the 404 page.
LEGO’s 404 page has a LEGO figure and gives information on why you might have found the 404 page.
Google has a robot on its 404 page
Google has a robot on its 404 page

Hopefully those examples gave you a bit of inspiration for your own 404 page.


Here’s what it comes down to: make sure you tell the user why they are seeing the page and what they can do to continue, and don’t bombard visitors with information or clutter.


Additional editing by Haden