Navigation DesignMethod
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.
Preparation
Navigation Design is often more effective when it is informed by these complementary methods.
Domain Modeling
Define the concepts and relationships that inform effective structured content design
Category Design
Creating structures and schemes that make the location and use of content clear
Content Auditing
Identify and assess the quality and usefulness of existing content
Contextual Interviewing
Observation of users performing tasks in their own environment
Taxonomy Design
Define a system for labeling and classifying content to make it easier to find, understand, and use
Wireframing
Interface illustration that focuses on prioritization, functionality, and behavior
Steps
- 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?
Outcomes
Navigation Design typically produces insight and solutions focused on these areas:
Navigation Design
A recommendation for navigation affordances in a website or application.
Navigation Design Resources
Four Tradeoffs When Designing Navigation Menus
Dan Brown | EightShapes
Website Navigation Best Practices - 9 Navigation Design Tips and Warnings
Andy Crestodina | Orbit Media Studios
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
