Jakob Nielsen’s ninth usability heuristic for user interface design

Help users recognize, diagnose, and recover from errors.

Melissa Vela
UX Collective

--

The number 404 built from Legos where the top Lego is dark green and goes to red, orange, yellow & light green at the bottom
Photo credit: Andrew Martin from Pixabay

Great products are dependent upon great user experiences. To ensure the best experience for users, a heuristic evaluation is performed to help identify issues within a digital product. One of the most popular sets of principles used to evaluate a system are Jakob Nielsen’s 10 general principles for interaction design. This article will focus on the ninth one of these principles which is Help users recognize, diagnose, and recover from errors. If you missed the eighth one, please click here.

Principle #9: Help users recognize, diagnose, and recover from errors

Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

Good designs should aim to prevent errors from ever occurring in the first place, but sometimes this goal just isn’t realistic. To best meet the needs of users, designs must also provide ways for users to overcome any errors they encounter when interacting with the system. This can be achieved three different ways. First, users should be informed of errors so they can recognize they made one. Second, the system should diagnose the error for the user by telling them in plain, easy to understand language what went wrong. Third, the user should be given clear directions on how to recover from the error.

Recognize

The most straightforward way to inform a user of an error is to use an error message. This can be achieved with text alone or with text that is accompanied by a visual cue like a red X for example. The error message must be highly noticeable and visible to the user.

Upon login, Pinterest will inform the user if they enter an email address that is not associated with a Pinterest account. They do this using red lettering which is a good signal for most, but for the color blind user, it doesn’t help much. Mailchimp goes a step further by adding a visual element to the red highlighted text on their error message. This helps the user to recognize the error even better.

Log in screens for Pinterest and Mail Chimp
Photo credit: pinterest.com Photo credit: mailchimp.com

Diagnose

The error message must use simple language when describing the problem to the user. Errors should be presented in everyday language, not using code or jargon. The language should also be precise in describing the problem while remaining gentle and non-condemning to the user. The message needs to go beyond just stating that there has been an error. It needs to describe the problem that occured. A common example of this can be seen in the 404 error message.

Google gives users the traditional 404 message when entering a Google URL that doesn’t exist on the server. They are cute and honest and say, “That’s all we know.” The branding agency FreshSparks goes beyond the standard 404 message by giving the user some suggested links to guide the user to other content.

404 Error pages for Google and the branding agency Fresh Sparks
Photo credit: google.com Photo credit:freshsparks.com

Recover

Designs need to help users recover from errors by providing actionable ways to fix them. Advice should always be detailed and constructive. The best way to do this is to give the user instructions as well as shortcuts within the error itself so they can recover from the error immediately. Users must be given a way to fix mistakes they make while interacting with a system.

One of the most common ways of allowing users to recover from errors is to provide the user with an undo or back button. Internet browsers have back and forward buttons for this purpose. Many types of applications including word processors like Google Docs feature an undo and redo button so users stay in control of their interactions.

Web browser that shows the back and forward buttons and Google Docs that shows the undo and redo buttons
Photo credit: medium.com Photo credit: Google Docs

In order to provide users with the best user experience possible, they need to be given ways to recognize, diagnose, and recover from errors. These error messages should be highly visible, easy to understand, constructive, and actionable when appropriate. The guidance of good error messages help users to stay on track and out of trouble which leads to a better overall user experience.

Thanks for reading! I would love to hear your ideas and thoughts about this topic in the comments.

The UX Collective donates US$1 for each article published in our platform. This story contributed to UX Para Minas Pretas (UX For Black Women), a Brazilian organization focused on promoting equity of Black women in the tech industry through initiatives of action, empowerment, and knowledge sharing. Silence against systemic racism is not an option. Build the design community you believe in.

--

--

UX Researcher striving to make a positive impact on the world. I’m passionate about travel and other cultures. I love learning languages.