Disclosure: We are a professional review site that receives compensation from the companies whose products we review. We test each product thoroughly and give high marks to only the very best. We are independently owned and the opinions expressed here are our own.
So does your site have a 404 Page Not Found page? If so, do you think it is helpful to your readers? If you are a WordPress user and have not set one up yet, then odds are you might have one. You can easily check and see if you have one. The easiest way to do that is to type in your domain name followed by a /with gibberish after it. What this will do is bring back a dead link and if you have a 404 page it should bring that up. After looking at yours, does look like it could help someone stay on your site later, or do you think it might annoy them and they click off your site and go somewhere else?
What Does 404 File Not Found Mean?
Before we go any further, let me give you a brief overview of a what a 404 page and how it works. The 404 is a standard response code that tells the web browser that the web server could not find the requested page or file. In technical terms, the client or browser communicates via HTTP protocol to a web server. The server is waiting for a request from the browser. The request is usually a HTML file with a numeric response code and a message. If a 404 code was received, this means an error occurred. Usually, the errors happen because, the file requested was moved, no longer exists, or the URL was mistyped. Along with the numeric response, a human-readable phrase is followed. That message is “Not Found”. Most web servers by default will have a HTML page that will have the 404 error code and the message file “Not Found.”
Can I Create a Custom 404 Page?
One of the easiest things you can do to your site to help out your visitors is to create a custom 404 page. If you are using WordPress then you might already have one created to match your theme. If not check out this page on creating a custom 404 Page for WordPress. With my theme, I was fortunate enough to have a 404 page that matched my theme. But, the sad part it is useless and empty. It does nothing to help the readers or even try and keep them on the site. Because of this, I modified my 404 page and made it more useful for the reader.
What Makes the Perfect 404 Page?
As mentioned before, the most common reason a user gets a 404 page is because of three reasons;
- file does not exist
- file was moved or deleted
- user typed incorrect URL
When creating a customized 404 page, you need three things;
- Link to or mention the sitemap so the user can use the sitemap
- Search box
- keep your 404 page simple. Its alright to be funny but make sure everyone can understand your joke.
So when creating your custom error 404 page, make sure to mention why the user may have found your 404 page and then offer different options to find what they are looking for. When you come up with the content, be nice and don’t point fingers at who is at fault. Just give them a reason why they are seeing the page and how to find what they are looking for.
10 Custom Error 404 Pages for Inspiration
After researching custom error 404 pages I came across many articles that give examples of custom error pages. Since almost every site shows the same the sites and examples, I thought I would give you just a few examples of my favorite 404 pages.
3. Jibjab
5. Slonky
7. CSS-Tricks
8. RetardZone
9. CSS Remix
10. SiteSketch101
Modifying the 404 File Not Found Page
Now that you had a little inspiration, here are the steps you will need to modify your them. If you already, have a themed, 404 page then all you need to do is add your content, links and anything else you would like. But if you don’t have a custom theme, then you will have to create one. I have not had the chance to create one yet, but its is not to hard. WordPress.Org has an excellent tutorial on how to create a custom 404 page to match your theme. The tutorial has a lot of additional information and give you addition information to help create a more advanced 404 page. Just remember, the more code, server calls and javascript you use, it can and will slow your load times down. Slow load times are one thing you want to avoid.
1. First thing you need to do is open your 404 style sheet inside the WordPress Editor
Admin panel >>> Appearance >>> Editor >>> 404 Template (404.php)
2. Inside the content section of the template this is were you would add your content, images and any code you want to appear on your custom error 404 page.
3. Make sure to add links to your sitemap if you have one and add a search box.
4. Once you are satisfied with the results save it and test it. Then your done.
Below is the sample code of what my 404 page code looks like as of June 15, 2010
[sourcecode language=”PHP”]
<?php
/* Mystique/digitalnature */
get_header();
?>
<!– main content: primary + sidebar(s) –>
<div id="main">
<div id="main-inside" class="clearfix">
<!– primary content –>
<div id="primary-content">
<h1 class="title"><span class="error">404.</span> <?php _e(‘The requested page was not found’,’mystique’); ?></h1>
<p>Nuts! You have stumbled across a page that no longer exists or never existed. If you think this is a conspiracy, you could try out the <a href="<?php bloginfo(‘siteurl’);?>/sitemap/">sitemap</a> or you can go back to the <a href="<?php bloginfo(‘siteurl’);?>">homepage</a> and start over again. If that doesn’t help, you could try out our nifty little search form…
<?php include(TEMPLATEPATH . "/searchform.php"); ?>
<!– /primary content –>
</div>
<?php get_sidebar(); ?>
</div>
</div>
<!– /main content –>
<?php get_footer(); ?>
[/sourcecode]
About James
Those are some great examples. That is inspiring me to do something cute on mine.
Yeah, they inspired me as well. I am working on make a better one as well. I quickly put one out on this site, when I found my was useless…
Really fun examples. I just had a plugin melt down the other day and sent a bunch of bad links to Twitter, It was a tragedy, well embarrassing anyway, but it got me thinking about my 404 page and then here you are with some great stuff. I’m inspired to do it up for sure now.
Having a funny 404 isn’t all that important. But having one that helps your visitors is always good thing.