Global navigation connects main pages. Each main page contains subpages visible only after entering that section—typically through sidebars, subtabs, or expanded menus. Subpages connect only among themselves and to their parent page, creating a tree structure.
Common in systems where content has natural categorical divisions. Balances the navigation freedom of fully connected with the structure needed for deep content hierarchies.
Behavioural position
Supports
- Browsing — structured exploration within known domains
- Navigating — efficient when mental model matches structure
- Re-finding — hierarchy provides memory cues
Challenges
- Uncovering — opaque hierarchy frustrates actors
- Exploring — hierarchy constrains free exploration
- Cross-section browsing requires backtracking to top level
The model assumes actors can predict or learn where content lives in the hierarchy. When categorisation is unclear or content fits multiple categories, actors experience friction.
Variants
- Two-level tree. Global navigation for top level, single level of subnavigation.
- Deep tree. Multiple levels of nested categories; past a few levels, prefer multiple shallow trees or search-first navigation.
- Expandable tree. Sidebar or menu shows/hides nested levels.
- Faceted tree. Multiple independent hierarchies.
Wayfinding states
- Breadcrumb trail — path from root to current location
- Section indicator — visual cue of current main section
- Depth indicator — how deep in hierarchy
Related components
- Sidebar, dropdown, tabs, breadcrumbs - implementations of multilevel trees.
- Breadcrumbs — for wayfinding
Resources & references
- Tidwell, Brewer, Valencia (2020) Designing Interfaces, 3rd ed.
- Rosenfeld, Morville, Arango (2015) Information Architecture, 4th ed., Chapter 6: Organization Systems
Consequences
- content sits at addresses the actor can learn and re-find, and the trail from the root to here is available as orientation without spending extra chrome on it
- the hierarchy is now a standing guess about how the actor categorises, and it will be wrong for some content and some actors; a thing that belongs in two places has to be filed in one
- lateral movement costs a trip back up: two sections that turn out to be related have no path between them that the structure recognises
Related patterns
Complements
- Searching — escape hatch when hierarchy fails
- Command menu — quick access bypassing hierarchy
- Deep linking — enables direct access to any node
Alternatives
- Fully connected — for deep hierarchies
- Hub and spoke — for hierarchical relationships
- Pan and zoom — for hierarchical spatial data
- Pyramid — for hierarchical content
- Step by step — for structured but non-linear content
Related
- Information architecture
- Intent & Interaction — efficient when mental model matches structure
- Hybrid patterns