The JUNO team can help you configure your site navigation.
Go to https://junolive.atlassian.net/wiki/pages/resumedraft.action?draftId=796721189 for color and font options.
About navigation
Site navigation is made up of multiple parts:
Site logo
Primary navigation menu
Subnavigation menu
Side navigation menu
Profile icon menu
Navigation is identical on desktop and mobile devices, with two exceptions:
Primary navigation is located at the bottom of mobile screens. It is at the top of the page on desktop devices.
Mobile devices only show 4 links in the primary navigation menu, even if there are more on desktop devices. Any additional links are still accessible in the side navigation menu.
[SCREENSHOT: App and Desktop with 5 parts labeled.]
Internal and external links
Whenever we refer to links on this page, they can be internal or external. Internal links go to another page on your site. External links go to another website.
Primary navigation
[SCREENSHOT]
An example [image]. See the tables below for details.
Element | Options | |
---|---|---|
1 | Links (Desktop) | Add or remove links (Max number) |
2 | Icons | Change icons Get the list from the brand page, move it here |
Fewer primary navigation links fit on mobile devices. Your site’s home page is always the first link, and More is always the fourth link. You can choose two more. They don’t have to be the same as the links in the desktop view. Think about what is most important to your mobile app users!
Element | Options | |
---|---|---|
3 | Links (Mobile) | Choose 2 links to appear on mobile devices. |
Subnavigation
[SCREENSHOT]
An example [image]. See the tables below for details.
When you click a primary navigation link, a subnavigation bar appears with additional links for that section of the site.
Element | Options | |
---|---|---|
1 | Links (Desktop and mobile) | Add or remove links (0-# max number) |
Side navigation
[SCREENSHOT]
An example [image]. See the tables below for details.
Side navigation is a comprehensive list of navigation links. It includes everything from primary navigation and subnavigation, as well as additional links.
This design makes the switch between desktop and mobile experiences seamless. No matter your screen size or where you are on the site, you can find anything in the More menu.
Element | Options | |
---|---|---|
1 | Links (Desktop and mobile) | Add or remove links (0-# max number) |
Rename sections
Remove section names
Only top nav items can have icons
Top section should be primary nav links only. (question: matches desktop, even if primary nav different on mobile?)