Five Efficient 404 Pages Tips: Convert Errors Straight into Profit

Helen Stark

10 years ago

Custom Error Page appears on every site when something unexpected happens with the page link. Technically, 404 error is a request error – this means the user has typed in the URL that doesn’t exist on the server. Even though it’s most likely the user’s fault, it’s still very disappointing for the user. Web designers today create funny and unusual 404 pages that make visitors stay with the site and prettify their unpleasant UX. Moreover, it seems like perfectly designed 404 Page can increase site conversions and even push online shops visitors to buy their products.

404 Page should show the user what to do next and show the owner where on website something needs to be fixed. In general, there can be two reasons for 404 page to occur:

The link is damaged, broken or deleted (doesn’t happen very often these days because webmasters keep an eye on this and add 301 redirect in cases like this);
The user has mistaken and typed the link address incorrectly.

In any case, bad UX of meeting the Error Page should be transformed and paid off with something nice and useful. Let’s speak about tips and tricks on creating the 404 page design that should be applied and about those ones that should be avoided. In other words, these are the practices that will help you actually convert an error into a useful action.

1. Don’t Use Generic Error Pages

Leaving a Generic Error Page is frustrating and doesn’t provide the visitor with any information on what to do next. Custom Error Page should definitely be included in website design. It helps reducing user’s frustration, leads to other popular sections and pages of the site and may even rise conversions for brands.

Huwshimi

Tobi

Some websites automatically redirect a user to the Home Page in any case when the error occurs. It leads to misunderstanding when a person doesn’t get it that the link is broken and tries it again and again. Another bad idea is creating Generic Error Page that doesn’t lead to anywhere. The example below shows such beautifully designed and funny 404 page that offers you to choose what wire to cut. It may seem that cutting a wire will redirect the user to the home page, but after you cut a wire you still stay on this Error Page.

PSU

2. Create a Good Error Message

Message is a key element on a 404 Page. You should explain to your visitors why they ended up on the Error Page and what went wrong. Adding a funny joke or creative text is beneficial and fuels visitors’ confidence.

Lark News

It’s useful to explain to user some peculiarities of the website links, like Bitly does on its 404 Page below.

Bitly

A major rule for 404 Page message: don’t blame the user. Some sites use rude and provocative epithets that mock-up the user. It may seem funny in a context of the site (like you may see below), but not for any visitor. Moreover, most sites start their messages with blaming the visitor of making a mistake.

Homestar Runner

Blizzard

Forget such sentences like ‘You broke it!’, “You have mistyped the address” etc. In most cases people do not type the URL manually, so stop blaming them. It’s better to offer a solution like “check the page url” or “look for something else.” And don’t forget to add messages on all those languages you use within the site so everyone could understand it.

Cartoon Network

3. Offer Easy Navigation Right from the 404 Pages

To make this experience more pleasing and effective it’s better to add a search bar to the Error Page. It helps the visitor to provide the research without having to leave the site immediately.

Git Hub

Audiko

Adding a category list or a few links to the most popular pages also makes the visitor staying longer with the site and shows the respect of the owner to all his customers. It is especially helpful for online stores and brands.

Mod Cloth

Beta Brand

Due to the same reasons you can also leave the navigation menu bar visible on the 404 Page. Provide the users with a link to the Home Page giving them a chance to find what they want. In addition, having the navigation menu bar on the Error Page helps to retain the overall design of the site in one style.

eHarmony

Gig Masters

4. Add Contact Form

Many designs of the 404 Page include a contact form. It allows users telling the owner about their problem with a broken link. Additionally, online stores may leave the registration form on the Error Page to motivate the new visitor for shopping within the site. Some creative companies even add advertisement of their products to the 404 Page.

Blik

Walk with You

5.Offer Creative Design

404 Page design is a way of creating the site’s image and lowering the visitor’s frustration of not finding the necessary information. Most sites tend to keep the Error Page design within the overall design of the site. It may be large background photos that are also used on a Home Page, characters, icons and typography that are used within the site etc.