The Shape of Navigation

Why does a website need navigation? After all, with a good search all of the content can be accessed through a single input field. Why not just have site search and be done with the problem of designing and maintaining a complex navigation system?

It turns out that the way people access information makes a difference. People like information that involves sequence. They like to browse. Web navigation provides a narrative for people to follow on the web. Your navigation tells the story of your site.

When browsing a web site, people learn about other available content. This translates into bottom line benefits. For ecommerce sites, this means more sales; for a non-profit organization, higher user engagement in navigation results in more support; or for a medical information site, navigation helps provide a deeper understanding of a disease or cure. In other words, it’s the way in which navigation systems provide access to information that is important.

The best way to understanding navigation shape is through an analogy with storytelling. Like telling a good story, I see navigation shape as a combination these elements:

• Meaning — Just as the theme of a story is important to its narration, semantics play a role in shape. With web navigation, users have a wider semantic peripheral sense of what the site is about. Site search is more surgical — you’re in and out — and users are not as aware of the meaning of the whole thing. Designing for engagement entails the construction of meaning.
• Flow — A gripping plot engages. Flow is about how the elements and events unfold and in which sequence. This recalls Marshall McLuhan’s concept of “hot” and “cold” media in which sequence plays a large role. Hot media, McLuhan suggested, provide complete involvement by the user, and they do so with linear ordering. Cold media result in lower involvement for the user, who often must comprehend multiple parts simultaneously. Web navigation is hot.
• Mode of Interaction — Think of the user as the protagonist. Their mode of interaction is relevant to the shape they experiences. For instance, we can talk about “sit back” and “lean forward” modes of interaction, as well as “known searches” and “exploratory searching.”
• Uncertainty — Emotions play a role in navigation, and uncertainty drives the feelings people experience. Like conflict in a good story, uncertainty creates tension and release in the shape of navigation. Site navigation provides confidence while looking for information
• Framing Factors — “Framing” is the difference in saying “75% fat free” rather than “contains 25% fat.” These two messages are framed differently. Web navigation frames the scope of the interactions people have on a website. It’s viewpoint of the storyteller that structures the narrative.

All of these factors come together to create the shape of web navigation. There is a type of gestalt effect at play here. You task in designing navigation is to identify the aspects that will articulate a given shape.

So when designing web navigation, it’s not just about a UI with good task efficiency or even providing an emotionally positive experience. Look at the whole picture, the entire shape of the navigation experience. Like a compelling story, the goal is to engage the user. Engagement, then, plays a larger role than experience in the design of web navigation.

This was originally written to be a sidebar to Donna Lichaw’s new book, The User’s Journey. Her book had too much awesome content to fix this text, so I’m posting it here.