The 3-Click Rule

The 3-click rule is a persistent, unofficial heuristic that says that no page should take more than 3 clicks (or taps on a touchscreen) to access. A variation pronounces that the most important information should take no more than 3 clicks to get to. Often, designers apply this rule for website navigation and information-seeking tasks, but some also invoke it for other types of tasks (such as completing a form or a wizard).

The 3-click rule assumes that users will become frustrated and will likely give up on tasks that require more than three total clicks to be completed. It is a simple way of assessing the interaction cost of important information-seeking tasks, but its superficial simplicity is also its downfall.

The big problem with the 3-click rule is that it has not been supported by data in any published studies to date. In fact, a study by Joshua Porter has debunked it; the study showed that user dropoff does not increase when the task involves more than 3 clicks, nor does satisfaction decrease. Limiting interaction cost is indeed important, but the picture is more complicated than simply counting clicks and having a rule of thumb for the maximum number allowed.

 Click counting by itself is not a meaningful metric for several reasons:

  1. The number of clicks needed to complete the task will depend not only on the design, but also on the task complexity — so an absolute number, applicable for all tasks, is not possible.
  2. Not all clicks are equal: some result in long wait times (if, for example, a new page is loaded) and others are instantaneous — for instance, if an accordion is expanded.
  3. The number of clicks will rarely tell the whole story — there are many aspects of the design that contribute to its usability, whether the task flow involves 2 clicks or 10. In the real world, users make mistakes, misunderstand things, and get confused along the way. Simply counting the number of steps in a process misses out on what users actually do, and the opportunities to provide them with a less frustrating experience.

In this article we will focus on why the  3-click rule should not be used blindly for designing website IA and navigation.

NYC government website showing a series of screenshots with very long menu pages full of links.
NYC.gov: Finding where to report a broken water meter takes only 3 clicks, but, along the way, it still offers a laborious user experience that requires a lot of scanning and scrolling. On the homepage, users must click NYC Resources (1), then look through a long page of links.  Halfway down that page (below the fold on most laptops) is a section for Housing & Building with a link for Tenants (2), which brings the user to a very long list of links, with Water Meter Complaint (3) all the way at the bottom, the 133rd link in the list.   

Origin of the 3-Click Rule

The earliest published reference to the 3-click rule (that this author could locate) is in Jeffrey Zeldman’s 2001 book, Taking Your Talent to the Web, in which he mentions an already widespread concept of the 3-click rule among the web designer community of the time.  This book offers no data to support the assertion of 3 clicks as a maximum, simply noting the reasoning that, “It’s widely agreed, even by people who are not idiots, that web users are driven by a desire for fast gratification. If they can’t find what they’re looking for within three clicks, they might move on to somebody else’s site.”

While we have seen demonstrable evidence over the years that web users are indeed driven by a desire for fast gratification, it is notable the first print appearance of the 3-click rule is not supported by evidence or studies, but simply by the assertion that users “might” move on to someone else’s site.

3-Click Rule Pushes Toward Overly Broad Navigation UIs

One of the main design implications of the 3-click rule is that navigation menus should not require users to click through multiple levels in order to find the information they care about.  While this idea is reasonable, pursuing it relentlessly often requires designers to prioritize broad IAs (information architectures) over deep IAs.

In order to avoid long sequences of clicks, designers end up using many specific top-level categories in their menus, rather than fewer and less overwhelming top-level choices.  Both very broad and very deep IA structures have their own usability problems. Very broad IAs with a large number of categories at the top level are more laborious for users to assess and require a lot of UI space. Very deep structures with few top-level categories and a great number of tiers require either a lot of menu diving (often with frustrating hover-revealed menus or confusing sequential menus), or large time spent waiting for category landing pages to load on the journey to low-level pages.

Interestingly, in practice this means that many designers have to choose between two UX myths (neither supported by data): either no more than 3 clicks or no more than 7 main-navigation categories.  This is why such simple rules of thumb, no matter how reasonable they may sound, are unhelpful — they aren’t supported by research, and they conflict, so they push designers to make tradeoff decisions between equally poor user experiences.

Practices Better Than Counting Clicks

Click counting is a rough way of assessing interaction cost and task efficiency, as it does not take into account cognitive factors that occur when users need to read and understand a long list of options, figure out where they currently are in the site’s structure, or build expectations of how much more work they need to do to get to their destination goal.  These elements are at least as important as the sheer number of clicks involved in getting to a particular page.

More important to good navigation are the following:

  • Ensure that menu items have names with strong information scent and avoid vague, unfamiliar, or branded terms.
  • Include clear wayfinding (e.g., breadcrumbs, local subnavigation) that shows users where they currently are in the IA.
  • Avoid multilevel hierarchical dropdown menus (on desktop) in favor of mega menus.  Hierarchical (or cascading) dropdown menus are error-prone, require precise mouse movements, and show only one slice of the site IA at a time.  Mega menus usually display several levels of the information hierarchy and allow users to compare multiple pathways at a glance to understand which “neighborhood” they should be investigating. They also support easy error correction for users that make a mistake along the way. There is nothing more frustrating than a high interaction-cost process that you need to do twice because you clicked the wrong thing or accidentally closed the menu.
Multi-level hierarchical navigation menu on a health care site
Cardinal Health uses hierarchical dropdown menus for navigation. These menus are difficult to interact with, error-prone, and provide far less context than mega menus.
  • Identify the most important information-seeking tasks, and surface links to them from the homepage and from other important pages.
  • For pathways that do involve multiple steps, provide clear landing pages or navigation hubs at key points along the way. These landing pages offer groups of links, often with images or other elements that that help with unfamiliar terminology, provide stopping places along the way (that are retraceable with the Back button), and enable easy lateral movement to sibling pages in the same category. Remember, in most IAs, the higher levels of the hierarchy are general categories and the deeper ones are as more specific (and therefore, may require additional information or disambiguation along the way).
Website page that is a navigation hub, with a series of links on a page, rather than a menu
Accenture’s Cybersecurity capabilities navigation-hub page provides lists of links that would otherwise be several levels deep within hierarchical dropdown menus. The page also includes helpful descriptions of each link for users that are unfamiliar with the terminology.
  • Make sure that when a click results in a new page, the page load time is minimal. 3 clicks that each have a long load time lead to a worse experience than 5 clicks that quickly load.

Summary

Although limiting the amount of effort required to access key information or to accomplish a task is important, the 3-click rule is arbitrary. There is nothing inherent about 3 clicks as a magical threshold before users will get frustrated. More important than focusing on the raw number of clicks is to ensure that navigation is well organized with clear pathways, that content gets progressively more specific the deeper into the site structure your users advance, and that your site visitors always know where they currently are and how to get to their destination.

References

Taking Your Talent to the Web: A Guide for the Transitioning Designer, Jeffrey Zeldman, 2001

Porter, Josh. (2003). Testing the Three-Click Rule. (link)