Desktop Navigation Layouts

Five layouts cover most desktop navigation needs. Horizontal global only is the simplest, one bar, best suited to shallow, broad structures with few top-level categories. Stacked horizontal bars add a secondary bar beneath the primary one, giving more room for categories without going vertical. Horizontal global with vertical local pairs a top bar for site-wide navigation with a sidebar for navigating within whatever section someone is currently in. Vertical global only puts the entire navigation in a sidebar, which suits spaces with many top-level categories or labels that vary a lot in length, multilingual sites, for instance, where translated labels can be unpredictable lengths. Vertical global and local nests both levels together in one sidebar, often with expandable sections.

The right layout usually reveals itself once you look honestly at two things: how many top-level categories the content actually has, and how much that number needs room to grow.

Exercise

The scenario: Four information spaces, each needing a desktop navigation layout.

1. A news organization with twenty top-level content categories and deep local navigation within each one.
2. A small professional services firm with five service areas and minimal hierarchy beneath them.
3. A large enterprise intranet that will be translated into fourteen languages, with labels varying significantly in length across translations.
4. A government agency website serving three distinct audience groups, each with their own separate content hierarchy.