pattern-library 3 linked patterns checked
USWDS Header component
Documents site header variants that include primary navigation, including basic, megamenu, and extended header structures.
Read with a purpose
What this source can teach
Use this source to compare a documented solution with the task and states in your own product.
- Start with the original. Open the source and find the guidance or example relevant to your task.
- Trace the connection. Use the claim notes below to see how this site applies the source to specific patterns.
- Check the setting. Compare the source's platform, people, and constraints with your own decision.
Pattern Decisions This Source Supports
| Pattern | Supported decision | Required contract | Claim note |
|---|---|---|---|
| Global navigation | Choose global navigation when users need repeated access to a small set of top-level product or service sections. | Activating a global navigation item changes to the named top-level section and updates current-state semantics. | USWDS header guidance supports primary navigation in a site header with simple, megamenu, and extended variants. |
| Mega menu | Choose a mega menu when a top-level section has a deep hierarchy or more links than a basic dropdown can comfortably present. | Activating a mega-menu trigger opens the panel and updates aria-expanded on that trigger. | USWDS documents basic and extended header megamenu variants for deep hierarchy and recommends basic dropdowns when there is not enough content. |
| Utility navigation | Choose utility navigation for controls whose primary job is session management, account access, support, search entry, notifications, language, product switching, or global tools. | Activating a utility button opens the corresponding panel, menu, tray, or inline search surface without changing the current primary destination. | USWDS header guidance supports separating search, labelled primary navigation, keyboard behavior, and current section state. |
Comparisons supported by this source
- Mega menu vs global navigation vs navigation drawer
USWDS header guidance identifies megamenu variants for deep hierarchy and warns to use basic dropdowns when there is not enough content.
- Utility navigation vs global navigation vs service navigation
USWDS header guidance shows search and primary navigation as separate header surfaces with labelled navigation and keyboard requirements.
Evidence Role
This source is treated as pattern-library evidence. Its value comes from the specific claims and setting described above.
Publisher: U.S. Web Design System. Last checked: .