On this page
States & Properties
State vs property#
Examples
- States — aria-expanded, aria-checked, aria-selected, aria-disabled
- Properties — aria-labelledby, aria-describedby, aria-controls
- Both must stay truthful to the visual UI
Interactive states#
Interactive demo
Toggle states
ARIA state
- Role
- button
- Name
- "Details"
- State
- aria-expanded="false"
Test
| Action | Expect |
|---|---|
Expand disclosure | aria-expanded becomes true |
Check box | Checked state exposed |
Disable control | Disabled state exposed and input blocked |