5 essential elements of a successful 404 error page

Default avatar.
August 01, 2014
5 essential elements of a successful 404 error page.

404 pages are one of the most overlooked aspects of any website design, and when they're not overlooked, the tendency is to create something fun—in the hope that a bit of humour will lessen the user’s irritation at the missing information.

Many designers opt for the default 404 believing that the rest of their scheme is so full-proof as to not require a back up plan. Others crack a joke, or use the page as a little web experiment.

There's nothing wrong with being humorous if that's what the page requires, but fun and functionality are not mutually exclusive, and a good designer will always ensure that their user find the way to the information they were looking for.

1) Craft your error message

The most important part of a 404 page is the error message. An error message with an apology and some helpful suggestions should be front and center. Try to offer an explanation of what went wrong, for example: "The link you clicked may have been wrong" or "The post your looking for may have been deleted". The language that we use is very important, so we certainly want to choose it with care.

Users can be sensitive creatures, especially when things are already not going the way they expected. Often times, the blame for this inconvenience immediately falls on our shoulders, even if we had nothing to do with placing the link that brought them to our site. So our relationship with the user is starting off a bit strained. This is what makes our language important. We want to win them back, not further the stress. So we need to avoid placing any blame on them with the phrasing we choose.

2) Always include a search box

We know the user wants to find something on your site, we know they haven't found it. Be grateful that they're prepared to give you a second chance and make sure you have a well functioning search box.

Even if we have nothing else (which as you will get from this post, is not all that recommended), a search box is a must. Since the visitor didn't find what they were looking for, we need to set them on the right course. Repair this breach by giving them a convenient and handy way to search for that missing link (pardon the pun). This gives them a compass to offer them their bearings

This small curtesy works wonders in winning back the trust of the user.

The only exception to this rule is if you're site is so small (ie. a single page site) that a search will only ever produce a handful of results, in which case skip to the next tip.

3) Provide a category list

If the user has a specific topic that they came to your site looking for, having a list of your various categories can be extremely useful. This way if what they were looking for is now gone, they can hopefully find something else on the site that is in the same vein, and they'll be encouraged to stick around a bit longer. And if they are curious, this gives them a little more insight into the other subjects that you cover or deal with throughout your content.

Once again, this is a place where we need to be sure and not to overdo it and overwhelm the user. Sometimes, less is more, and that principle holds true in the case of your category list. If your category list is somewhat extended, perhaps just sticking to the most popular would be appropriate.

4) Upsell your featured posts

If you're working on a blog, magazine, or any other site that has posts then this is a fantastic opportunity to direct the user to the content you're already promoting. Those posts that we tend to want to feature widely, can find a good fit among the added functional elements of our newly expanded 404 page.

From our most popular posts, to the most recent content that we have up for the public, or even just the posts we personally feel shine brighter than the rest of them; whatever the case may be, these are the posts that we want to put in front of any user landing on our 404. It is something of a longshot that we keep a user once we have effectively "lost" them (or gotten them lost with the misplacement of blame falling on our shoulders), but if we’re going to go down, we might as well go down swinging.

5) Don’t forget key links

The last added element we are going to cover in this post is the inclusion of some key links to various important pages on our site. Naturally, which links matter most and deserve this 404 placement really depend on the site, brand, mission, and more. But offering links to the key pages of our site can go a long way to enticing a lost user on our site to stay long enough to find who we are and what it is we do.

With that in mind, adding a link to our home page, about page, our archives and/or our contact page wouldn't be a bad idea. This is not to say that our navigation need appear on the 404 page in full matching fashion as it does on every other page, but a scaled down set of key links would serve nicely instead.

Rob Bowen

Rob Bowen is an emerging filmmaker, celebrated author/podcaster and poet, and most recently the co-founder and imaginative co-contributor of the creative design and blogging duo at the Arbenting and Dead Wings Designs.

Read Next

20 Best New Websites, April 2024

Welcome to our sites of the month for April. With some websites, the details make all the difference, while in others,…

Exciting New Tools for Designers, April 2024

Welcome to our April tools collection. There are no practical jokes here, just practical gadgets, services, and apps to…

14 Top UX Tools for Designers in 2024

User Experience (UX) is one of the most important fields of design, so it should come as no surprise that there are a…

What Negative Effects Does a Bad Website Design Have On My Business?

Consumer expectations for a responsive, immersive, and visually appealing website experience have never been higher. In…

10+ Best Resources & Tools for Web Designers (2024 update)

Is searching for the best web design tools to suit your needs akin to having a recurring bad dream? Does each…

3 Essential Design Trends, April 2024

Ready to jump into some amazing new design ideas for Spring? Our roundup has everything from UX to color trends…

How to Plan Your First Successful Website

Planning a new website can be exciting and — if you’re anything like me — a little daunting. Whether you’re an…

15 Best New Fonts, March 2024

Welcome to March’s edition of our roundup of the best new fonts for designers. This month’s compilation includes…

LimeWire Developer APIs Herald a New Era of AI Integration

Generative AI is a fascinating technology. Far from the design killer some people feared, it is an empowering and…

20 Best New Websites, March 2024

Welcome to our pick of sites for March. This month’s collection tends towards the simple and clean, which goes to show…

Exciting New Tools for Designers, March 2024

The fast-paced world of design never stops turning, and staying ahead of the curve is essential for creatives. As…

Web Tech Trends to Watch in 2024 and Beyond

It hardly seems possible given the radical transformations we’ve seen over the last few decades, but the web design…