open a highway of information

Create a Great Custom 404 Page in WordPress

Knowledge Base on February 28th, 2010 No Comments

Is your 404 Page a dead end street? Or is it a highway of information with many alternatives? This is the question that has to be answered, and for any modern Web 2.0 stating-to-be site the answer better be a highway of information. If not, AmberPanther has you covered. In this article we will introduce all the ingredients for a great custom 404 Page. Our focus is on the WordPress 404 Page, but the methodologies described here can be applicable to any platform powered site or standalone site.

We are not in the internet business to create problems, but we are here to tackle them, giving informative solutions. A 404 Page screams problems. These problems might not necessarily be your fault, and most of the times will be beyond your control. The problems will be in the form of mistyped URL’s by the visitor, truncated URL’s passed through emails, or broken links. No matter what the problem is, or whose fault it is, a feeling of doubt will arise within the visitor. A doubt about the trustworthiness, the integrity, even the information validity of your site. The end result will be the visitor navigating away and potentially not returning back. What if we provide solutions though? What if we transform our dead end street into a highway of information? The visitor will feel at ease, gain confidence in your site, oversee the problem and navigate through. So let us take a look at what comprises a great 404 Page.

Before you proceed reading, we recommend you to study the AmberPanther 404 page, http://www.amberpanther.com/this-page-does-not-exist (opens in new window). Then keeping it in mind continue reading.

Ingredients for a Great 404 Page:

Correct Headers:

The 404 Page should be sending the correct HTTP status code, that is 404 Page Not Found. Older versions of WordPress where not supporting this, however, now this belongs to the past. You can check the headers and HTPP status code any page sends using our handy too, Server Headers Checker Tool. In the event the 404 Page is not sending the correct header read this article to learn how to force the 404 Page to send the proper headers.

Eye catching image:

A picture worths a thousand words. What a better way to enhance and create the Great 404 Page then, than an aesthetic, informative, eye catching image.

Awareness:

Let the visitor know of the problem. State clearly that the Page is Not Found. The 404 error code does not say much, unless you are a web-savvy. Differentiate between mistyped addressees and broken referred links, so that the visitor will understand it is not solely your site’s fault for the problems.

Assurance:

In the event of a broken link, let the visitor know that the administrator has been notified about the problem and it will be taken care of. (Make sure your great 404 page is sending an email to the administrator though.) This will assure the visitor that things are not taken lightly at your site.

Search:

Make available a search box for your site. This will let the visitor quickly search for what he initially came to your site looking for.

Alternatives:

Alternatives can come in different forms. The most important and essential is a Sitemap. In the case of WordPress we like to provide a list of the latest posts as well. Also, utilize what is available to you. We tested, use, and recommend the Google 404 Widget. This widget will provide alternative link suggestions and a dedicated search for your site based mistyped address or broken link.

Communication:

Provide a a straight forward way for the visitor to communicate the problem to you in the event he feels talkative. It can be a link to the site’s contact form. Also, ensure that the 404 page will notify the administrator of any broken links. This is very important for correct SEO methodologies. This notification capability can be extended to mistyped addresses, however, we do not deem it of great importance. If you think otherwise, feel free to justify your thoughts.

Back to the beginning:

Provide a clear way to direct the visitor back to the site’s home page, in order to start fresh. This can be in the form of a link, or graphic within the content area of the 404 Page.

Navigation Menu:

The menu is an integral and essential part of any website. Ensure it is displayed on the 404 Page, in order to increase the alternatives for the visitor and open more channels of information.

Spice it up with some jQuery:

In the era of Web 2.0, a Great 404 Page cannot exist without some jQuery to spice it up, hiding, showing, animating elements. This will build confidence in you and your site. You take everything seriously, even a problem page, hence the, information you provide will be of value.

This recipe will guarantee a great 404 Page for your site. Such a page will not direct the visitors in making a U-turn and navigating away, rather it will enable them to move forward in many possible directions. If you have any more ingredients to enhance the 404 Page recipe, feel free to share.

In the meantime check out the AmberPanther 404 Page.

Tags: , ,

No Responses to “Create a Great Custom 404 Page in WordPress”

Leave a Reply

We stop spam together!

RSS Feed
on facebook
@twitter
footer