UX For 404 Error Pages

C Emmanuel Onyema
2 min readJan 27, 2021

Introduction:

Have you ever clicked on or typed a URL (a link), but instead of getting the desired result, an error message that reads ‘404 not found’ or ‘page not found’ pops up instead?, Don’t worry, we are going to briefly understand what it means, implications (especially if you have a website) and possible solutions with focus on user experience.

So, what’s a 404 error?

It’s a HTTP(hypertext transfer protocol) status code, it’s a response from the web server to the web browser (client)as a result of the following:

  • The webpage isn’t available, or that it has been deleted or moved away from the web server
  • Secondly, that the user clicked on a dead URL or misspelt the URL into the browser
  • In some cases, the domain no longer exists.

Implications:

  • You see, when users meet this error messages instead of the desired thing, it creates a bad experience and that isn't what you want for your users, because it could lead them to distrust you and reduce visiting your site.
  • Secondly, when google recognizes that a link to your site returns a 404 error message, they remove it from their search index and reduce your page ranking.

What should make a good ux for an error page?

Here is a chance to remedy the situation and turn lost users into loyal fans

Links:

Links are very essential because they give the user the ability to leave the error page easily. Links can also come in form of a menu navigation, with it they can go to your homepage, or other pages of their choice. Links can also help users progress to other parts of your website such as sitemap, popular post or products.

A search bar:

Search functions give users the sense of control and power and also a chance to search for whatever they need right there on your site, just by entering one or few keywords. According to a report, adding a search function can help increase site conversion rate by up to 50% in some cases.

Report a problem:

This is often like the last resort for the users, When clicked on by users directs them to report an issue they could not find solutions to on the site, so that it can be resolved for them.

Benefits of a well (user centered) designed 404 page:

  • As an advantage, the better the experience of your users with your error page, the higher it is to convert lost users to loyal fans of your brand/business.
  • Reduced bounce rate: Bounce rate means the frequency by which users leave your page
  • An opportunity to communicate your brand values and assure users that they aren't left alone.

Here is my design for a challenge to design a 404 error page.

Your inputs would be greatly appreciated, thank you.

A sample 404 page

--

--

C Emmanuel Onyema

C Emmanuel Onyema is a user centered product designer and developer in beta, a physiology student at Nnamdi Azikiwe University.