THE PATTERNS

To recap, this chapter talks about several aspects of navigation: overall structure, knowing where you are, figuring out where you're going, and getting there efficiently. The patterns address these issues to varying degrees.

The structure of an application or site is tied intimately to navigation within it. It's impossible to separate them, actually. One could arguably put structure-related navigation patterns like Clear Entry Points, Hub and Spoke, and Pyramid into Chapter 2, which discussed how to organize the content, because these patterns talk about how multiple pages interrelate. You can "tack on" some others—Global Navigation, Color-Coded Sections, Sequence Map, Breadcrumbs, and Escape Hatch—to individual pages after the basic navigational structures are designed, and thus they might move further down the design progression into page layout (the topic of Chapter 4).

And there's one more thing to note. Clear Entry Points, Modal Panel, and Hub and Spoke restrict access to navigation, not expand it (as many of the others do). Complete freedom to move anywhere at any time isn't an unalloyed good; sometimes clarity of understanding means that less is better.

In any case, we'll start with the patterns that describe navigational structures: how the pages (or windows or dialog boxes) of a UI interlink. If you draw a picture of the links between the pages of the UI, you might see some of these patterns:

Get Designing Interfaces now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.