Photo by Mick Haupt via Unsplash
A website’s navigation is a collection of user interface components. The primary goal of navigation is to help users find information and functionality, and encourage them to take desirable actions. Navigation components include global navigation, local navigation, utility navigation, breadcrumbs, filters, facets, related links, footers, fat footers, and so on.
When approaching a design or redesign project, it is important to take a look under the hood and start by defining or redefining the IA. The IA doesn’t need to be final before beginning to wireframe and prototype, but a first pass is necessary to get a handle on the volume and complexity of the content. Making navigation component choices based on looks alone can force you to change an ideal IA to something that doesn’t best serve the needs of users or accommodate your content.
Navigation Design is often more effective when it is informed by these complementary methods.
Define the concepts and relationships that inform effective structured content design
Creating structures and schemes that make the location and use of content clear
Identify and assess the quality and usefulness of existing content
Observation of users performing tasks in their own environment
Define a system for labeling and classifying content to make it easier to find, understand, and use
Interface illustration that focuses on prioritization, functionality, and behavior
- Determine usage priority: How much will users rely on this navigation component? For example, will users primarily navigate the site using local navigation? Or are they likely to more heavily rely on related links?
- Determine placement: On which pages should navigation be present? Where should it be placed within the page layout grid (e.g., top, left, right, bottom)?
- Establish patterns: Which navigation design patterns best support findability and discoverability — tabs, megamenus, carousels, accordions, and so on?
Navigation Design typically produces insight and solutions focused on these areas:
A recommendation for navigation affordances in a website or application.
Navigation Design Resources
Four Tradeoffs When Designing Navigation Menus
Dan Brown | EightShapes
Navigation design: Almost everything you need to know
Rebeka Costa | JustInMind
Implement Global Navigation to Improve Website Usability
Interaction Design Foundation
Classification, Navigation, and the Secret Lives of Watermelon
Andy Fitzgerald | Anthro-Tech