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.
9. CSS Remix
Modifying the 404 File Not Found Page
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.
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
<?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(); ?>