From time to time we have visitors to our websites that land a little bit less than perfectly as they arrive. Usually this landing stems from some sort of broken link or missing content. This causes the user to land on the 404 page. Now this is also an opportunity that many web designers still fail to capitalize on, even with the numerous community contributions that discuss ways in which you can dress up the 404 and make the page more of a useful addition to the site. Rather than just having it sit there with no other function than to alert users that they have lost their way.
This post will break down a few ways that you can do a little bit more with the 404 page of your site or others that you design, and hopefully get you in that mindset for thinking of other creative ways that you can address some of the more commonly passive areas of the site. So take a look below and ask yourself, can you do more with your 404?
What It Can Do
Now the first thing that we have to realize is that a 404 page, while it does have a specific function, which is to let visitors know that they have effectively taken a wrong turn. However its usefulness does not have to stop there. Just because it is destined for that one function does not mean it cannot take on other functions as well. Why allow ourselves to be limited in how we use this space?
Back from the Breach
First off, a useful 404 page is easy to design, and doing so is usually the best idea. For you are already starting off on the wrong foot with any visitor who has been sidetracked from their intended destination, but the 404 page provides you an opportunity to recover. But if your 404 page is merely tasked with this alerting of misdirection, then you are not seizing this chance to correct this breach. So that is the main thing that a more complete and helpful 404 construct can do for your site. If you take the time to craft one which goes that extra mile for the users benefit.
Help Them Find Their Way Again
As you pull back from the breach, why not take a moment via your 404 page and help the users find their way again. There are any number of reasons that the visitor could have gotten thrown off track and wound up at your 404 page. So use this as a chance to take their hand and guide them along to where ever it is they intend to go next. Allow them to virtually browse through the content on the site easily so they can use the 404 page as somewhat of a mall directory. They are here, now get them to where it is they need to go. Include an archive of your content, however creatively presented and arranged as you can.
You want them to stick around and delve a little bit deeper into your site, but if you do not have anything to encourage this action, then what incentive do they really have to look around? They have effectively errored out already. We need to show them that there is something more worth sticking around for. With most users who land on a 404 page they will decide one of two things almost immediately. Either what they were looking for is gone, or they need to look more carefully for it. If you have an archive or search box in a prominent position on the page, this may be the only nudge the user needs to look around. It at least improves our chances of keeping the user from simply bouncing.
If you are not up for including a full archive of the site content, then at least use this as an opportunity to give them a little preview of the what they can expect from the site. Rather than wasting this moment with the user, why not give them a something of a teaser to entice them further into the site. Rather than the 404 being somewhat of a negative first impression, build it so that it still provides an insight into the site itself. Offer some key content that has been proven popular and effective with other visitors. Or even a mission statement of sorts to alert the users as to what the site is all about so that they at least have that take away.
What It Can Be
Design sites tend to realize that a 404 Page can be so much more than it appears upon first glance, and in the online design community we see many exciting examples of a kind of transformation taking place. 404s are becoming more than just a landing page, they are becoming an interactive addition that borrowing on that old slogan of Be All You Can Be.
We have already discussed a couple of ways that you can make the 404 page useful via the other section, but it is important to highlight that it has this potential. It does not just have to be a place holder of sorts for misplaced or missing content. It can be a virtual directory. An introduction to the site itself. And so much more. But unfortunately there are times when this part of the design is forgotten about until the last minute and so it feels that way on the site. Like an afterthought. Or worse, it is a completely underestimated area of the design and therefore its potential is never fully realized.
Now going beyond just being useful and helping to guide the users along their way, some have taken a different tack with their 404 page. You can use the space as a virtual learning annex. By filling the 404 with information of some sort, the page becomes a different kind of interactive addition to the site. One that could prove so informative that the users will be inclined to return to your 404 page on purpose! That is often unheard of, but there are some examples where when it is done correctly, this is the case. Take Smashing Magazines 404 page as one extremely creative way to transform this misstep into something so much greater.
By having their 404 page to act as a tutorial for a better 404 page is a beyond brilliant use of this space. Be playful with your ideas and approaches to this web design solution and your 404s are more likely to be a shining example to others, rather than a virtual design cautionary tale. Take this opportunity to create a site FAQ and build it into the 404 page. Again, allow for some whimsy and character to shine through the page. This is a unique opportunity to fully put the attitude and tone of the site on display without being limited by the various rules that tend to accompany the other areas of the design. Here we are somewhat freer so to speak.
A Design Chimera
One of the ways that we can further benefit from thinking more freely about our 404 Page designs, is that we can evolve it in ways that we had previously never considered. We can combine this page with elements of other pages to form a sort of web design Chimera. With most web designs we have a few pages that tend to be standard and included beyond those that hold the main content. Whether it be an about page, a contact page, whatever, there are other key points of information that the users tend to look for. Why not include some of this on the 404 page as well?
We can create a sort of hybrid on the page that works in some of the information that is included in some of the other stand alone pages. This may feel somewhat redundant, but we have to bare in mind that not everyone will happen across our 404 pages. The other pages tend to get visits intentionally, while the 404 visits tend to be accidental. So it is not necessarily redundant as much as it is a consolidation of the important information from the site for those who get lost. So this hybrid approach might be something to consider as well.
The Last Word
That is a quick breakdown of some of the ways that you can upgrade both the design and function of the 404 pages that you create. Whatever route you end up taking, know that doing a little bit more with your 404 and offering that extra hand to help users along, can go a long way for showing a dedication to both your users and the content of the site itself. So what are some ways that you would suggest doing more with these page designs? What elements have you seen included on other 404s that struck you as original and creative? Leave your thoughts in the comment section below.
A Few More for the Road
Here are a handful of other fine examples of those who have taken the time and put in the effort to design an informative, useful, and playful 404 page. Check them out for a little dose of inspiration to get your creative juices flowing.