Use navigation landmark regions
SkillWeb & browsingnavigation-landmark is a skill for AI agents that work on web pages. It guides the agent to check that templates, rendered HTML, and shared components use proper navigation landmark regions, and to validate the final browser-facing markup rather than only the source framework abstraction.
Available today. Use it from your connected AI after setup.
No other account needed.
Have an AI agent that can load skills.
Then ask your AI: use the Use navigation landmark regions skill
What your AI can do with it
- Review templates for correct navigation landmark regions
- Check rendered HTML for navigation landmark usage
- Inspect shared components for landmark regions
- Validate final browser-facing markup, not just source abstractions
Getting started
- Have an AI agent that can load skills.
- Add the navigation-landmark skill to the agent's available skills.
- Ask the agent to review a template, rendered HTML, or shared component; it applies the skill when the task involves navigation landmark regions.
What this skill tells your AI
The instructions your AI receives, as published by thedaviddias/front-end-checklist in skills/navigation-landmark/SKILL.md and read by ahel’s review.
Navigation landmarks allow screen reader users to quickly jump to and identify different navigation areas—without them, users must tab through every link to find what they need.
Quick Reference
- Wrap navigation links in nav elements
- Use aria-label to distinguish multiple nav regions
- Provide skip links to bypass repetitive navigation
- Screen reader users navigate by landmarks
Check
Verify navigation areas use nav elements with aria-label or aria-labelledby to distinguish primary, secondary, and footer navigation.
Fix
Wrap navigation links in nav elements with descriptive aria-labels like 'Main navigation' or 'Footer navigation'.
Explain
Explain how navigation landmarks help screen reader users quickly identify and jump to different navigation areas.
Code Review
Review templates, server-rendered HTML, and shared components that output markup related to Use navigation landmark regions. Flag exact elements, attributes, and routes where the rendered HTML violates the rule.
For full implementation details, code examples, and framework-specific guidance,
see references/rule.md.
Rule page: https://frontendchecklist.io/en/rules/html/navigation-landmark
Signals
- GitHub stars
- 74k
- Forks
- 7k
- Last commit
- Aug 2026
Questions
- Does it check the source framework code or the rendered output?
- It validates the final browser-facing markup, not just the source framework abstraction.
- When should the skill be used?
- Use it when reviewing templates, rendered HTML, or shared components related to navigation landmark regions.
Advanced
- Item type
- skill
- Key
navigation-landmark- Source
- github.com/thedaviddias/front-end-checklist