How to design sites that match user expectations

Consistency is essential to reducing the cognitive load of your interface. When your design is consistent, every interaction feels smooth and frictionless. When it is too inconsistent, the user must expend unnecessary effort.

But consistency in interaction design is a little more specific than simply doing the same things over and over – there are particular kinds of consistency, and particular fields in which consistency is more important than others.

On top of that, doing the same things over and over will yield boring, uniform designs. You need to know when to break the consistency without leading to design chaos. The key, as is most often the case in design, is balance.

In this piece, we'll go into details about what consistency means for web design, why it's important, and describe how to be consistent with what users expect (external consistency).

Why consistency matters

Interaction design relies on the learnability of your system.

To put it simply, when a UI works in a consistent manner, it becomes predictable (in a good way), which means users can understand how to use certain functions intuitively and without instruction.

This makes the product easier to use, which is a stepping stone to making it more desirable. Conversely, when a UI is inconsistent, it hinders learnability, provoking frustration in the user and leading to a bad experience.

But consistency is not limited just to your interface's appearance and behavior.

Your users don't spend all their time just with your product – the majority of their time is on other products, and all the while they are generating ideas and expectations from these other experiences. So if you're consistent with these outside experiences, your UI's learnability will increase without any extra work on your part.

Least astonishment

When in doubt, refer to the Principle of Least Astonishment. Delightful surprises are fine (like how MailChimp surprises users with humor and fun), but your core functions should not stray too far from the norm.

Review doesn't mean the same thing as Verify. Videos shouldn't be mistaken for images. Don't make buttons for primary actions appear only on hover.

In fact, if you're still questioning the nature of consistency in digital design, Apple's iOS Human Guidelines do a pretty good job of summarizing standards for consistency for their apps. In their own words...

1. Is the app consistent with iOS standards? Does it use system-provided controls, views, and icons correctly? Does it incorporate device features in ways that users expect?"
2. Is the app consistent within itself? Does the text use uniform terminology and style? Do the same icons always mean the same thing? Can people predict what will happen when they perform the same action in different places? Do custom UI elements look and behave the same throughout the app?
3. Within reason, is the app consistent with its earlier versions? Have the terms and meanings remained the same? Are the fundamental concepts and primary functionality essentially unchanged?"

From what we've discussed above, we can divide design consistency into two categories: external and internal consistency. External refers to your UI's consistency with other products, while internal is its consistency within itself. Let's take a look at some of the best practices we discuss in Consistency in UI Design.

External consistency

External consistency is not only how consistent your product is with other similar products, it can refer to its consistency to all products on your platform, all software in general, and even non-digital interactions throughout the real world.

So why does external consistency matter? To sum it up, it's about meeting user expectations.

In order to create a design that coincides with what your user is expecting, you must first understand what ideas they are bringing with them before they even use your site or app. This is a concept that usability expert Jared Spool refers to as current knowledge.

Your users' current knowledge is influenced by many external factors, anything from the last site they used to a far-fetched expectation from their favorite sci-fi movie. Don't worry though – for the most part, your users' expectations will be reasonable.

Designing based on what your users already know is not a new concept. This idea has been in place for years, evolving into the common design conventions you'll see today in just about any app or website.

The image carousel, an envelope icon representing email, clicking on the site logo to return to the homepage… these are all referred to as UI patterns.

Next page: using UI patterns, things to avoid and going further...