Installs into .claude/skills of the current project.
Are you the author of Aria Patterns?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/andersseen-aria-patterns)
---
name: aria-patterns
description: Apply ARIA only where native semantics fall short, and keep state accurate.
---
# ARIA patterns
ARIA changes how assistive technology reports an element. It adds no behavior, so incorrect ARIA is
worse than none.
## Prefer native semantics
Reach for ARIA only when no native element expresses the pattern. The first rule of ARIA is not to
use ARIA when markup can do the job.
## Keep state synchronized
Expanded, selected, checked, pressed and disabled states must update whenever the visual state
changes. Stale ARIA state describes an interface the user is no longer looking at.
## Implement the whole pattern
A composite widget such as a menu, tab set, combobox or dialog has an expected set of roles,
relationships and keyboard interactions. Adopting the role without the behavior leaves the control
unusable.
## Manage focus in overlays
Move focus into a dialog when it opens, keep it inside while it is open, and return it to the
trigger on close. Content behind a modal must be inert to assistive technology as well as to
pointers.
## Announce changes sparingly
Use live regions for updates the user must know about, such as errors and completions. Announcing
everything makes the page unusable with a screen reader.
