Left Navigation/Menu

The Left Navigation/Menu contains the primary navigation of a single site. In Viewport 2 and Viewport 1, the Left Navigation is collapsed to the “Menu” button. It is optional for site Home Pages and should be used for all Content Pages. Up to three levels of a site structure can be displayed in the Left Navigation/Menu, with different color shading indicating each level and bold text indicating the selected page. The top link should always connect to the site Home Page. All sections within the Left Navigation/Menu can be expanded to preview what is available prior to loading a specific page.

When to Use

• On all Content Pages in your site. The Left Navigation will only be visible in Viewport 4 and Viewport 3.
• You want to provide users with access to all site content from your Home Page.

When to Consider Something Else

• You want to make use of the full screen in larger Viewports.
• You can support users’ top site tasks by providing primary navigation through some other RD component, such as Navigation Buttons.

Other Guidance

• Information Architecture: Large sites can be difficult for users to navigate, especially on small screens. Sites with wider information architecture (fewer levels) are generally easier for users to manage. A good rule of thumb is “10 x 10”. Aim for 10 or fewer Level 1 pages and 10 or fewer Level 2 pages under each Level 1 section. Avoid creating “deep” sites with many Level 3 pages.
• Links: Avoid linking to non-CDC web pages and non-HTML documents. This RD component support primary navigation to content within the same CDC site and the content should exist as web pages. Including other types of links will negatively affect the layout.
• Link Labels: Use short labels for your left navigate, 3 words or less. Longer titles will wrap, take up more space in Viewport 1 (phone view), and cause more difficulty when scanning. Choose only the most essential keywords when creating your link labels – users are often quickly scanning the page when making a decision about where to go next.
• Matching Page Titles: Ideally, Page Titles and Left Navigation/Menu link labels match to help keep users oriented after they make a selection. If Page Titles must be more descriptive, try to match the keywords used in the Left Navigation/Menu link label toward the beginning of the Page Title.
• Parent and Child Pages: If you create a site section (e.g. Level 1 parent page with several Level 2 child pages), parent page should include navigation to the lower level pages. This will support easier navigation within a site in Viewport 2 and Viewport 1, when the full Left Navigation is not displayed.

The left navigation menu is maintained in the SSI localRDLeftNav. Use the WYSIWYG editor to enter the menu topics as nested unordered lists.  Set the top-level topic in Heading 3 style.