The IA Files 5 - Navigation Breadth and Depth

Posted on Jul 7, 2013 (last modified Aug 11, 2021)

In my previous post of the IA Files, I promised I would begin to share best practices for building effective website navigation systems. One “rule of thumb” at the top of my list relates to Navigation Breadth and Depth. The first part of this rule says that static navigation menus should not exceed 7 (plus or minus 2) items. The second rule says that the depth of static navigation systems should not exceed three levels. I propose that a 7/3 breadth/depth ratio provides a healthy set of parameters for IA’s to design navigation systems within.

Navigation Breadth

Miller’s Magical Number Seven, Plus or Minus Two

So, there’s all kinds of stuff you can read about this Harvard professor dude named George Miller. Some might say that he kicked off the whole field of cognitive psychology. He won the American Psychological Foundation’s Life Achievement Award in 1990 and the National Medal of Science in 1991. Definitely the kind of guy you’d want to meet (supposing, say, you had a DeLorean with a flux capacitor; he died in 2012 at age 92).

He did a bunch of studies, which demonstrated that most people could only retain about seven “chunks” of information in short term memory at any given time (words, numbers, names, etc). The actual numbers were about seven for numbers, six for letters and five for words. In the case of words, he also found that the amount that could be retained was a function of whether the words were known by the listener. The rules, he found, are different for long-term memory, however, where storage capacity seems to be less limited. Though he published a lot of books and papers in his career, he’s probably best known for his paper, “The Magical Number Seven, Plus or Minus Two,” published in The Psychological Review in 1956.

George Miller called the number “magical” because of its mysterious prevalence in so many things. For example:

  • the seven wonders of the world
  • the seven seas
  • the seven deadly sins
  • the seven daughters of Atlas in the Pleiades
  • the seven ages of man
  • the seven levels of hell
  • the seven primary colors
  • the seven notes of the musical scale
  • the seven days of the week

Perhaps, there is really nothing magical about the number at all, but rather, it simply represents a numerical sweet spot in human cognition. Though George was hesitant to assert it firmly, his research seems to have made the implication.

Thus it is this cognitive numerical limit that gives us the rule of thumb for navigation breadth:

Static navigation menus should not exceed 7 (plus or minus 2) items.

'Static' navigation refers to the kind of anchored navigation, which does not change regularly – the navigation structures you hope your users will learn through frequent use. This is opposed to dynamic menus and lists of links like “Related Links”. One could logically argue that too many items, even in a dynamic list, will likely create a lot of visual noise and contribute to information overload. Long lists of links are rarely, but sometimes necessary; a paging “News Archive,” for example.

Navigation Depth

The depth of static navigation systems should not exceed 3 levels.

At my company, Base22, we’ve found through our own experience and usability testing that a good limit for the depth of static navigation is no more than three levels. In fact, we’ve even hard-coded this limit into the widgets we use to render static navigation. If stakeholders feel the need to publish content at deeper levels, we believe the IA is flawed and needs to be revised or the business stakeholders need to come to a better understanding of the IA strategy.

The concepts in a navigation structure are, after all, abstractions designed to collect and represent things that are related. Having a numerical limit to navigation depth forces us to complete the process of abstraction and classification to a certain standard. In this case, that standard is loosely based on factors pertaining to web usability (total number of clicks and what-not).

Depth allows us to limit breadth and thus reduce the overall choices the user has to make at higher levels. But if concepts are too abstract, the navigation labels may not be discreet enough to support reliable decision making. So, depth provides progressive levels of detail below those higher level “chunks” that are more easily scanned and digested. This aids the foraging process through which users pick up and follow “information scent” – getting an increasing or decreasing sense of confirmation as they explore, and discovering new things along the way.

But what about breadth versus depth? Which is better? Research tends to suggests that one should favor breadth over depth for web sites, but it’s always a balancing act. Information Architects have a lot to think about in this balancing act. What are the content and services that are currently available and how should they be classified and organized? What are the kinds of content and services that do not presently exist, but that are likely to come? Who are the users and how do they think? Do we want to influence their thinking and, if so, how?

A basic 7/3 breadth/depth ratio provides a healthy set of parameters to work with. You won’t go to IA hell for stepping outside of those bounds, but you can at least be sure that it’s a good framework. It’s supported by scientific research and it has proven to work well in our experience. Using this as a general “rule of thumb” for navigation breadth and depth will give you a solid starting point so that you can focus on the fun stuff – classification and organization, abstraction and concretization, etc.

Related Resources:

<< Previous: Part 4