Why Bother with Usability Heuristics?

People should use their mental energy for the purpose of your site, not the design.

Published in

theCOOP.cc

7 min readApr 22, 2021

Skip down to the end of the article for a checklist to use while creating your designs and a formal heuristic evaluation template.

Why are Usability Heuristics worth learning? One of the hallmarks of a well-designed site is that users accomplish their goals without thinking about the website itself. If a user expends significant mental effort navigating and understanding the website, they will leave and find a different way of accomplishing their goal. Thankfully, there are broad “rules of thumb” or heuristics to help lessen our user’s mental load.

The traditional definition of heuristics defines them as the cognitive tools that help us make quick decisions throughout the day without using significant mental effort.

(Daniel Kahneman’s Thinking, Fast and Slow is an excellent read to understand how people make decisions as well as defining traditional heuristics and their value.)

There are many different types of usability heuristics, but I recommend that you familiarize yourself with Jakob Nielsen’s heuristics. Over 25 years ago, Jakob Nielsen defined his original “top ten” usability heuristics based on his experiences teaching usability. Nielsen’s “top ten” are still the most widely used because they are technology agnostic; they can apply to any space that involves users. Just as importantly, they are a great checklist to use while you are building your website or application.

Evaluating Heuristics

A heuristic evaluation is a simple, inexpensive, but still powerful tool in a Product Designer’s toolbox. It is an excellent methodology to examine a system “as is.” A heuristic evaluation is not a replacement for user testing but a starting point.

Before submitting your project to users, having 3–5 Usability Professionals perform a heuristic evaluation will save time and money on “simple” fixes.

However, even at the initial stages of your product’s development, usability heuristics should be used as a general guideline or checklist to prevent obvious usability issues.

A heuristic evaluation is the UX equivalent to developers’ “bug squashes.” They should be performed often to make a better product, but not be the “end all be all” of creating a great product.

Sample Heuristic Evaluation:

(While doing a heuristic evaluation, keep in mind the original definition. If a website makes you hesitate and think, you may have a usability problem — emphasizing quick decisions with as little mental effort as possible.)

Jakob Nielson’s 10 Usability Heuristics

Visibility of system status:

The system should always keep users informed about what is going on through appropriate feedback within a reasonable time.

Below is an example of the Visibility of System Status. When a cursor hovers over a clickable link, it changes states. This is a simple, often overlooked but important way to communicate to the user that it is a clickable link.

Match between system and the real world:

The system should speak the user’s language with words, phrases, and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

The Trash bin on both Macs and Windows is an excellent example of a “match between system and the real world.” The Trash icon and its functionality is instantly recognizable to users. When a user finishes with a document, they “throw it in the trash.”

Pictured on the left is the trashcan from Mac OS Big Sur, and on the right is a physical trashcan from Walmart.

User control and freedom:

Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without going through an extended dialogue. Support undo and redo.

An excellent example of “User control and freedom” is when a Gmail is sent. The user can unsend an email immediately after sending it.

Consistency and standards:

Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.

Microsoft’s Office Suite is an excellent example of “consistency and standards.” The user can transfer learned knowledge from one product to another, making that product instantly feel familiar.

Error prevention:

An excellent example of “Error Prevention” is when a user receives a warning or notification before deleting something permanently. The information forces the user to slow down and think, while most heuristics do the opposite.

Even better than good error messages is a careful design that prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before committing to the action.

Recognition rather than recall:

Minimize the user’s memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for the use of the system should be visible or easily retrievable whenever appropriate.

Disney+ does a great job of demonstrating “Recognition rather than recall” in two forms. First, they list out the most recently watched videos. The user does not need to rediscover the video they were watching. The second is that users do not have to think about how to watch a video by using a familiar shape and layout. They instantly recognize that they can click on one of the images.

Flexibility and efficiency of use:

Accelerators — unseen by the novice user — may often speed up the expert user’s interaction such that the system can cater to inexperienced and experienced users. Allow users to tailor frequent actions.

Keybinds demonstrate flexibility and efficiency of use on Figma. Advanced users will spend quite a lot of time in Figma, and learning shortcuts helps them become more efficient.

Aesthetic and minimalist design:

Dialogues should not contain information that is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

Google is the standard when it comes to aesthetic and minimalist design. Designers should remember that minimalism isn’t the primary goal, but keeping designs focused and around what the user needs to accomplish without unnecessary additions is the heuristic purpose.

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.

Quite simply, the best error messages tell the user how to correct the issue. There are no guessing or codes to decipher, but what tells the user they did wrong and how they can correct the error.

The user can see that they did not input an email or a password in the below example. To correct the error, they need to input both an email and a password and a link if they have forgotten their password or email.

Help and documentation:

Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.

Slack has an excellent walk-through, using pull notifications, that introduces users to necessary features when they first join the application. This a fantastic “help” feature, as it breaks down the application into smaller components and keeps the user from feeling overwhelmed when they are less familiar with the application.

Familiarizing yourself with the Neilsen top ten will make you a better designer. However, there are several other usability heuristics out there! I recommend reading and reviewing multiple heuristics to further your understanding of the psychology of usability.