Chapter 1. Jakob’s Law

Users spend most of their time on other sites, and they prefer your site to work the same way as all the other sites they already know.

Overview

There is something incredibly valuable to be found in familiarity. Familiarity helps the people interacting with a digital product or service know immediately how to use it, from interacting with the navigation to finding the content they need to processing the layout and visual cues on the page in order to understand the choices available to them. The cumulative effect of mental effort saved ensures a lower cognitive load. In other words, the less mental energy users have to spend learning an interface, the more they can dedicate to achieving their objectives. The easier we make it for people to achieve their goals, the more likely they are to do so successfully.

As designers, it is our objective to ensure people successfully achieve their goals when using the interfaces we’ve built by eliminating as much friction as possible. Not all friction is bad—in fact, sometimes it is even necessary. But when there is an opportunity to remove or avoid extraneous friction, or friction that doesn’t provide value or service a purpose, then we should do so. One of the primary ways designers can remove friction is by leveraging common design patterns and conventions in strategic areas such as page structure, workflows, navigation, and placement of expected elements such as search. When we do this, we ensure people can immediately be productive instead of first having to learn how a website or app works. In this chapter, we’ll take a look at some examples of how this design principle can be achieved—but first, let’s look at its origins.

Origins

Jakob’s law (also known as “Jakob’s law of the internet user experience”) was put forth in 2000 by usability expert Jakob Nielsen, who described the tendency for users to develop an expectation of design conventions based on their cumulative experience from other websites.1 This observation, which Nielsen describes as a law of human nature, encourages designers to follow common design conventions, enabling users to focus more on the site’s content, message, or product. In contrast, uncommon conventions can lead to people becoming frustrated, confused, and more likely to abandon their tasks and leave because the interface does not match up with their understanding of how things should work.

The cumulative experience that Nielsen refers to is helpful for people when visiting a new website or using a new product because it informs their understanding of how things work and what’s possible. This underlying factor is perhaps one of the most important in user experience, and it is directly related to a psychological concept known as mental models.

Examples

Have you ever wondered why form controls look the way they do (Figure 1-1)? It’s because the humans designing them had a mental model of what these elements should look like, which they based on control panels they were familiar with in the physical world. The design of web elements like form toggles, radio inputs, and even buttons originated from the design of their tactile counterparts.

Comparison between control panel elements and typical form elements (source: Jonathan H. Ward [left], Google’s Material Design [right])
Figure 1-1. Comparison between control panel elements and typical form elements (source: Jonathan H. Ward [left], Google’s Material Design [right])

When our designs do not align with the user’s mental model, there will be problems. A misalignment can affect not only how users perceive the products and services we’ve helped build, but also the speed at which they understand them. This is called mental model discordance, and it occurs when a familiar product is suddenly changed.

One notorious example of mental model discordance is the 2018 redesign of Snapchat. Instead of gradually introducing changes through slow iteration and extensive beta testing, the company launched a major overhaul that dramatically changed the familiar format of the app by combining watching stories and communicating with friends in the same place. Unhappy users immediately took to Twitter and expressed their disapproval en masse. Even worse was the subsequent migration of users to Snapchat’s competitor, Instagram. Snap CEO Evan Spiegel had hoped that the redesign would reinvigorate advertisers and allow for ads to be customized to users, but instead it caused ad views and revenue to drop and led to the app’s user count dramatically shrinking. Snapchat failed to ensure the mental model of its users would be aligned with the redesigned version of the app, and the resulting discordance caused a major backlash.

But major redesigns don’t always drive users away—just ask Google. Google has a history of allowing users to opt in to redesigned versions of its products, like Google Calendar, YouTube, and Gmail. When the company launched the new version of YouTube in 2017 (Figure 1-2) after years of essentially the same design, it allowed desktop users to ease in to the new Material Design UI without having to commit. Users could preview the new design, gain some familiarity, submit feedback, and even revert to the old version if they preferred it. The inevitable mental model discordance was mitigated by simply empowering users to switch when they were ready.

Before (left) and after (right) comparison of YouTube redesign in 2017 (source: YouTube)
Figure 1-2. Before (left) and after (right) comparison of YouTube redesign in 2017 (source: YouTube)

Most ecommerce websites also leverage preexisting mental models. By making use of familiar patterns and conventions, shopping sites such as Etsy (Figure 1-3) can effectively keep customers focused on the important stuff—finding and purchasing products. By conforming to users’ expectations about the process of selecting products, adding them to the virtual cart, and checking out, designers can ensure users are able to apply their accumulated knowledge from previous ecommerce experiences; the whole process feels comfortable and familiar.

Ecommerce sites like Etsy leverage preexisting mental models to keep customers focused on purchasing products rather than on learning new interaction patterns (source: Etsy, 2019)
Figure 1-3. Ecommerce sites like Etsy leverage preexisting mental models to keep customers focused on purchasing products rather than on learning new interaction patterns (source: Etsy, 2019)

The use of mental models to inform design isn’t isolated to the digital space. Some of my favorite examples can be found in the automotive industry, specifically in regard to controls. Take, for instance, the 2020 Mercedes-Benz EQC 400 Prototype (Figure 1-4). The seat controls found on the door panel next to each seat are mapped to the shape of the seat. The resulting design makes it easy for users to understand which part of their seat they can adjust by identifying the corresponding button. It’s an effective design because it builds on our preexisting mental model of a car seat and then matches the controls to that mental model.

Seat controls in the 2020 Mercedes-Benz EQC 400 Prototype, informed by the mental model of a car seat (source: MotorTrend, 2018)
Figure 1-4. Seat controls in the 2020 Mercedes-Benz EQC 400 Prototype, informed by the mental model of a car seat (source: MotorTrend, 2018)

These examples demonstrate how we can leverage users’ existing mental models to enable them to become immediately productive. In contrast, failure to consider the mental model a user has formed can result in confusion and frustration. The conclusion here also begs an important question: does Jakob’s law argue that all websites or apps should behave identically? Additionally, does it suggest that we should use only preexisting UX patterns, even when there’s a more appropriate solution that’s new?

Conclusion

Jakob’s law isn’t advocating for sameness in the sense that every product and experience should be identical. Instead, it is a guiding principle that reminds designers that people leverage previous experience to help them in understanding new experiences. It is a not-so-subtle suggestion that (when appropriate) designers should consider common conventions that are built around existing mental models to ensure users can immediately be productive instead of first needing to learn how a website or app works. Designing in a way that conforms to expectations allows users to apply their knowledge from previous experiences, and the resulting familiarity ensures they can stay focused on the important stuff—finding the information they need, purchasing a product, etc.

The best piece of advice I can give in regard to Jakob’s law is to always begin with common patterns and conventions, and only depart from them when it makes sense to. If you can make a compelling argument for making something different to improve the core user experience, that’s a good sign that it’s worth exploring. If you go the unconventional route, be sure to test your design with users to ensure they understand how it works.

1 Jakob Nielsen, “End of Web Design,” Nielsen Norman Group, July 22, 2000, https://www.nngroup.com/articles/end-of-web-design.

Get Laws of UX now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.