https://www.orbitmedia.com/blog/website-navigation/
Navigation Breadth & Depth
Breadth
- There should not be more than 6 items in the navigation bar.
- If more than 6 items are needed, please work with the sites team (sites@byu.edu) to discuss secondary navigation accommodations.
Depth
- Sub-navigation should not go deeper than three levels in web content. (All content should be reachable within three clicks.)
- If more than three levels are needed, please work with the sites team (sites@byu.edu) to revise the navigation.
- Drop-Down Menus
- In order to improve the user experience on the web, drop-down menus are no longer supported in BYU’s header. The navigation bar will accommodate six links instead. Please work with the sites team (sites@byu.edu) to discuss and work through this transition.
- Static, Long-standing Links
- Links within the navigation bar should be long-standing and not seasonal or promotional in nature.
- Good examples of a navigation link: About, Academics, Programs
- Navigation links to be avoided: Link to a Campus Event, a Christmas Campaign, or anything that has a short or limited life-span
Partner or External Sites
- Links within any navigation element will not be used to send a user to an external or partner site. These needs should be handled within the content of the page.
- Example: A link to a sponsor’s account should be placed inside the content of the page and not as a navigation item from the global or sub-navigation bar.
Navigation Link Labels
- Long navigation link labels should be avoided for end-user ease of use.
- Navigation link labels should not include full sentences.
- Navigation link labels in any level of navigation should contain no more than 25 characters, including spaces. Please work with the sites team (sites@byu.edu) to discuss and work through your label if it exceeds 25 characters.
- Navigation link labels in the navigation bar should be limited to one or two words like Programs, Training, etc.
- An exception to the two-word rule includes labels where a conjunction is needed like “Admissions & Aid,” or for a phrase like “Frequently Asked Questions.”
- If you feel you need more than two or three words, please work with the sites team (sites@byu.edu).
- Examples
- Good navigation link labels:
- Programs
- Students
- Departments & Centers
- About Us
- Bad navigation links to labets:
- Applications and Submissions for Financial Aid
- Why should I apply to BYU
- Why does BYU have a honor code?
- Avoid duplicate navigation item names
- The sites team (sites@byu.edu) will work with you to ensure best practices are used to eliminate end-user confusion for link labels across the site.
- Ensure your navigation links are worded in a way that helps your user know where they will end up if they click them.
Updating and Launch
When redesigning a section of BYU.edu that includes navigation, all navigation should be updated across the entire section of the site as a whole and not piecemeal.
For example, all pages for BYU Admissions should update their navigation model across all pages at once and not launch the new navigation model one or two pages at a time. We should try to avoid multiple navigation models within one section.