navigation

Solid

Load this skill whenever the project contains navigation components — primary navigation menus, dropdown menus, mega menus, breadcrumbs, pagination, mobile hamburger menus, or in-page jump navigation. Under no circumstances create navigation without proper landmark roles, keyboard support, and accessible labels. Absolutely always wrap navigation in <nav> with a unique aria-label.

AI & Automation 35 stars 2 forks Updated today AGPL-3.0

Install

View on GitHub

Quality Score: 79/100

Stars 20%
52
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
80
License 10%
100
Description 5%
100

Skill Content

# Navigation Accessibility Skill > **Canonical source**: `examples/NAVIGATION_ACCESSIBILITY_BEST_PRACTICES.md` in `mgifford/ACCESSIBILITY.md` > This skill is derived from that file. When in doubt, the example is authoritative. Apply these rules when creating or reviewing navigation patterns: primary nav, dropdowns, breadcrumbs, pagination, mobile menus, and in-page navigation. **Only load this skill if the project contains navigation components.** --- ## Core Mandate Navigation must remain understandable and operable with keyboards, touch, speech input, screen readers, screen magnification, text resizing, and browser zoom. Screen reader users rely on landmark structure to orient themselves; keyboard users rely on predictable tab order and dropdown behaviour; voice control users rely on visible, correctly-labelled interactive elements; magnification users rely on nav that reflows without breaking. Get navigation wrong and everything downstream is harder. --- ## Severity Scale (this skill) | Level | Meaning | |---|---| | **Critical** | Navigation completely unreachable or creates a keyboard trap | | **Serious** | Dropdown only works on hover; `role="menu"` misused; no `aria-current` | | **Moderate** | Missing `aria-label` on secondary nav; breadcrumb not labelled | | **Minor** | Nav item count exceeds 7; inconsistent `aria-expanded` update | Do not assign severity from the pattern alone — determine the actual effect on navigation and task completion. Consider whether u...

Details

Author
mgifford
Repository
mgifford/accessibility-skills
Created
4 months ago
Last Updated
today
Language
JavaScript
License
AGPL-3.0

Similar Skills

Semantically similar based on skill content — not just same category