# Navigation Design

#### Main Menu

**Main Navigation**

Purpose: Serves as the primary navigation for the site, guiding users to the most important sections of the website

[![3. Navigation Design-1.png](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/scaled-1680-/3-navigation-design-1.png)](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/3-navigation-design-1.png)

- Use clear, descriptive labels for each level menu item, avoid jargon to ensure language is understandable by any user.
- Limit the number of top level items to prevent visual clutter.
- Use drop-down for subcategories.
- On mobile devices a hamburger or toggle menu should be used.
- All menu items should have hover, focus and active states.

#### Secondary Navbar

**Secondary navigation**

Purpose: Secondary navigation should provide contextual or secondary navigation used on subpages.

**Accepted Variant**

Font-weight: Bold  
Text: Uppercase  
Font size: 16px  
Line height: 32px  
Letter spacing: 0

[![3. Navigation Design-2.png](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/scaled-1680-/3-navigation-design-2.png)](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/3-navigation-design-2.png)

- Secondary menu will be positioned sticky on webpage scroll and relative to website header.
- To be used on subpages if necessary.
- Use clear, descriptive labels for each level menu item, avoid jargon to ensure language is understandable by any user.
- Limit the number of top level items to prevent visual clutter.
- On mobile devices a hamburger or toggle menu should be used.
- Al menu items should have hover, focus and active states.

#### Side Menu

**Side Navigation**

Purpose: Side menu navigation should provide contextual or secondary navigation used on subpages.

[![3. Navigation Design-3.png](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/scaled-1680-/3-navigation-design-3.png)](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/3-navigation-design-3.png)

#### Footer Menu

**Footer Navigation**

Purpose: Contains secondary links that are important for legal, informational and support purposes

[![3. Navigation Design-4.png](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/scaled-1680-/3-navigation-design-4.png)](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/3-navigation-design-4.png)

#### Breadcrumbs

**Breadcrumbs Navigation**

Purpose: Breadcrumbs should provide a visual trail of the user’s location in the site hierarchy helping with navigation and orientation

**Accepted Breadcrumbs Variants**

Font size: 14px  
Line height: 32px  
Letter spacing:0

[![3. Navigation Design-5.png](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/scaled-1680-/N8b3-navigation-design-5.png)](https://guidelines.risa.gov.rw/uploads/images/gallery/2025-10/N8b3-navigation-design-5.png)

**[Navigation Design Document](https://guidelines.risa.gov.rw/attachments/84)**