Structuring website navigation

Website navigation helps users understand what information your site contains, where they are and where they can go next. It’s important to structure navigation around the way users look for information rather than internal structure.

The main menu is a reflection of your sitemap. There are no shortcuts to second or third level pages. When adding/removing items from the menu, these changes should also reflect the structure and hierarchy of your sitemap.

 

Best practices

  • Organize pages based on what users want from your site
  • Use clear, succinct labels that users can understand
  • Your navigation should have a max of 7 items across the menu and 7 items within a dropdown

 

What to avoid

  • Organizing based on your unit’s reporting structure
  • Using internal terminology or project names
  • Using broad labels such as “Resources”
  • Organizing by audience groups*

 

*Audience-based navigation can be useful when content is genuinely different for each audience. In most cases, topic- or task-based labels make the destination clearer.

UBCO sometimes uses audience-based menu items (e.g., prospective students, faculty) to create succinct destinations that link out to other pages.

 

Keep the main menu focused

  • The main menu should represent your site’s most important subject areas. It does not (and should not) include every page.
  • Use top-level items for broad categories and group closely related pages beneath them. More detailed content can be reached through section landing pages and links within page content and site search.
  • Do not add a page to the main menu simply because it is new or important internally. Its placement should make sense to users and remain useful over time.
  • The menu label does not need to exactly match the page title, but the two should be similar enough that users know they have reached the correct page.

 

Create a logical webpage hierarchy

  • Use broad parent pages to introduce a subject and child pages for more specific information.
  • A landing page can often replace another level of dropdown navigation by presenting clear links to related content.

Popular Articles