UI Coach guide
Navigation Design Patterns
How to choose and structure navigation so people know where they are and where they can go next.
By UI Coach Editorial ·
Navigation is the product's map. If the map is wrong, people live in a few pages they already know and never find the rest. Patterns matter, but information architecture matters more. A beautiful sidebar cannot save a pile of identically named sections.
Start with the user's objects
Group by what people work on: invoices, messages, campaigns, patients. Grouping by your org chart or by internal tooling names produces menus nobody can parse. If two items cannot be distinguished by a short label, they should not both be top-level.
Show location
The current section should be visible. Breadcrumbs help in deep hierarchies. Tabs help within an object. Do not rely on color alone to show selection. Selected states need a second cue: weight, underline, or a persistent marker.
Pick a pattern for the density
Mobile tab bars work for a handful of peer destinations. Desktop sidebars work for tools with many sections. Top navigation works for a small set of areas with room for a utility cluster. Mega-menus can work for large content sites and usually fail in dense apps if they hide the only path to a daily task.
Search is not a substitute for IA
Search helps experts and large catalogs. It does not excuse unlabeled destinations. People cannot search for a feature they cannot name.
Common mistakes
- Hamburger menus on desktop for five items that could have been visible.
- Icons without labels in a tool people use weekly, not daily.
- Changing navigation between sibling pages.
Practice this on UI Coach
Enterprise and SaaS challenges force navigation choices. Sketch the object model on paper, then the menu. UI kits can supply components after the structure is honest.
Sources
- Nielsen Norman Group on navigation and IA
- Nielsen Norman Group on horizontal versus vertical menus