It goes without saying that the best way to go about errors is to avoid them. People neither have the time nor the nerves to deal with technical problems, while browsing your site with a certain goal in mind. So you should do everything in your power to avoid errors.
Yet, there is little you can do about the unexpected. No matter how hard you try, some users will run into a dead end at some point. It might or not be your fault, but you should be prepared for when it happens.
Customized 404 error pages have become the rule. We see them almost every time that we try to visit a broken or non-existing link. Webmasters have realized that classic 404 error messages can have a negative impact on the user experience. They are negatively phrased, boring and for most people too technical to truly understand. Customized error pages on the other hand can have a positive impact.
Standard 404 error message
Error messages are scary by nature and at the same time they are annoying as nothing else. When users click on a link they expect to find certain information. Being denied that information leads to confusion and frustration. Both feelings that you don’t want your site visitors to have.
As I explained in a previous post, we tend to judge the usability of a website only by its flaws. We don’t see good usability, but we do notice its absence. The same with links, we expect them to work, but if they don’t, we will notice and more than that, we’ll remember it.
Multiple blogs have made the effort to collect 35, 60, or even 70 examples of unique and creative 404 error pages. This offers plenty of inspiration for creating your very own customized page.
Yet, they all leave the core question unanswered: What makes a successful 404 error page? While appreciating plenty of visual examples, isn’t it even more interesting to know how we can avoid the negative impact of 404 error pages, or even better create a positive experience when people click on a dead link?
I looked at many different 404 error pages and identified 6 guidelines that will make your visitors forget about that one non-functional link.
1. Explain the problem
Prevent confusion by explaining what happened. Especially for those among us, who lack the technical background, simple error messages like the 404 error can be very scary. We have learned that error messages are usually not a good sign. We know from experience that a lot of times they go hand in hand with more trouble, such broken hardware or the need to restart an application.
Show your users some empathy and explain what happened, even if it’s the most obvious thing in the world for you. For example, Ethnio kindly explains that the error that occured might be insight ethnio or the requested page might not exist. They keep it brief and to the point, but they make sure the users know it wasn’t their fault.
2. Apologize for the inconvenience
Whether it was your fault or not that visitor to land on your error page, make sure your offer your apologies. The user doesn’t care where he clicks a link or who built that link, all they know is that they can’t access your site the way they want. This leaves them with little choice as to hold you and your website responsible.
Start off with your apologies and chances are good that users will forgive you. Everyone makes mistakes, right? As long as we apologize, it’s no big deal. Dribble don’t offer a lot of information on their error page, but they start off with saying “sorry”. This little word is already enough to make up for the preceding disappointment.
3. Avoid dead ends
http://suspendedanimations.com/404
Obviously, people click on a link with a reason. Make sure they don’t get distracted too much from the little error that they forget that reason. You still want them to find the information they are looking for. By offering alternatives that they can choose from to continue their search, you help them stick to their goal and quickly forget about the disruption.
Smashing Magazine helps their visitors to “get back on track” by offering several links. The visitor can either continue his search, or head back to the homepage and try again.
4. Use humor
Nothing covers an embarrassing situation better than a good joke. Humor connects and lets people be more forgiving. If you can manage to come up with a good joke to wrap your error message in, you provide your visitors with some extra tolerance to manage the incident. See it as neutralizing a negative experience with a positive one.
Your visitors might not get what they expected, but if you can make them smile instead, they won’t hold it against you. Huwshimi show a nice visual of a ninja, who stole the page. They tell the user to come back when “the moon has friends and the fox is borrowed”. This line of text doesn’t exactly make sense, indicating, that you better not return to this faulty address.
5. Turn it into a positive experience
You can also go a step further and give people an incentive for visiting your error page. Put extra effort in it and show your visitors that you care for them, even though you messed up this one time. If people leave your error page with a positive feeling because they have experienced something they had missed otherwise, you can consider yourself a genius.
In general it’s a bad thing if people remember an error on your page. However, if they remember it as a positive experience, you can just as well turn it into something good. Github welcome their visitors on their error page with a nice, responsive visual and a friendly looking alien character. The error becomes secondary once the whole illustration starts to shift when hovering over it.
6. Offer contact options
People who find themselves in scary or inconvenient situations don’t like to be alone. They look for others for comfort. On an error page, it’s kind of the same thing. People are more likely to feel the need to contact you than on any other page of your website. They might want to inform you that something is wrong, or ask you a questions, or maybe they simply want to share their frustration with you.
In any case, make sure you offer contact options and make it clear that you are open for any kind of feedback. For example, Zendesk encourages their users to contact them if they need any assistance. Simple, but powerful.
Conclusion
Customized 404 error pages can help you keep your site visitors happy after clicking on a broken or non-existing link. That is if you know how. Keep your visitors motivated and willing to forgive you for disturbing their browsing experience.
Explain the problem and make sure they don’t blame themselves for what happened. Offer your apologies because they don’t care who messed up. Make sure people don’t forget the reason for clicking on the problematic link. Make them smile and neutralize negative with positive. Offer an unexpected positive experience and be open for any kind of feedback.