ARIA state and properties are HTML attributes that are added to elements using:
aria-[state|property]=[property-type]
ARIA states define the current state of HTML elements in the accessibility tree. For example:
ARIA properties define purpose or relationships of HTML elements in the accessibility tree. For example:
A range of new states and properties were added to ARIA 1.1. At this stage, no new states or properties have been added to ARIA 1.2. ARIA states and properties are currently categorized as follows:
Widget attributes are specific to common user interface elements found on GUI systems or in rich internet applications which receive user input and process user actions. These attributes are used to support the widget roles.
Widget Attributes | ARIA 1.0 | ARIA 1.1 | ARIA 1.2 |
---|---|---|---|
aria-autocomplete |
Widget | Widget | Widget |
aria-checked |
Widget | Widget | Widget |
aria-disabled |
Widget | Widget | Widget |
aria-errormessage |
NA | Widget - Added in ARIA 1.1 | Widget |
aria-expanded |
Widget | Widget | Widget |
aria-haspopup |
Widget | Widget | Widget |
aria-hidden |
Widget | Widget | Widget |
aria-invalid |
Widget | Widget | Widget |
aria-label |
Widget | Widget | Widget |
aria-level |
Widget | Widget | Widget |
aria-modal |
NA | Widget - Added in ARIA 1.1 | Widget |
aria-multiline |
Widget | Widget | Widget |
aria-multiselectable |
Widget | Widget | Widget |
aria-orientation |
Widget | Widget | Widget |
aria-placeholder |
NA | Widget - Added in ARIA 1.1 | Widget |
aria-pressed |
Widget | Widget | Widget |
aria-readonly |
Widget | Widget | Widget |
aria-required |
Widget | Widget | Widget |
aria-selected |
Widget | Widget | Widget |
aria-sort |
Widget | Widget | Widget |
aria-valuemax |
Widget | Widget | Widget |
aria-valuemin |
Widget | Widget | Widget |
aria-valuenow |
Widget | Widget | Widget |
aria-valuetext |
Widget | Widget | Widget |
Live Region attributes indicate that content changes may occur without the element having focus, and to provide assistive technologies with information on how to process those content updates.
Live Region Attributes | ARIA 1.0 | ARIA 1.1 | ARIA 1.2 |
---|---|---|---|
aria-atomic |
Live region | Live region | Live region |
aria-busy |
Live region | Live region | Live region |
aria-live |
Live region | Live region | Live region |
aria-relevant |
Live region | Live region | Live region |
Drag-and-Drop attributes indicate information about drag-and-drop interface elements, such as draggable elements and their drop targets.
Drag-and-Drop Attributes | ARIA 1.0 | ARIA 1.1 | ARIA 1.2 |
---|---|---|---|
aria-dropeffect |
Drag and drop | Drag and drop | Drag and drop |
aria-grabbed |
Drag and drop | Drag and drop | Drag and drop |
Relationship attributes indicate relationships or associations between elements which cannot be readily determined from the document structure.
Relationship Attributes | ARIA 1.0 | ARIA 1.1 | ARIA 1.2 |
---|---|---|---|
aria-activedescendant |
Relationship | Relationship | Relationship |
aria-colcount |
NA | Relationship - Added in ARIA 1.1 | Relationship |
aria-colindex |
NA | Relationship - Added in ARIA 1.1 | Relationship |
aria-colspan |
NA | Relationship - Added in ARIA 1.1 | Relationship |
aria-controls |
Relationship | Relationship | Relationship |
aria-describedby |
Relationship | Relationship | Relationship |
aria-details |
NA | Relationship - Added in ARIA 1.1 | Relationship |
aria-errormessage |
Relationship | Relationship | Relationship |
aria-flowto |
Relationship | Relationship | Relationship |
aria-labelledby |
Relationship | Relationship | Relationship |
aria-owns |
Relationship | Relationship | Relationship |
aria-posinset |
Relationship | Relationship | Relationship |
aria-rowcount |
NA | Relationship - Added in ARIA 1.1 | Relationship |
aria-rowindex |
NA | Relationship - Added in ARIA 1.1 | Relationship |
aria-rowspan |
NA | Relationship - Added in ARIA 1.1 | Relationship |
aria-setsize |
Relationship | Relationship | Relationship |
Some states and properties are applicable to all host language elements regardless of whether a role is applied. These are defined as "Global" attributes. Global states and properties are supported by all roles and by all base markup elements.
Global Attributes | ARIA 1.0 | ARIA 1.1 | ARIA 1.2 |
---|---|---|---|
aria-atomic |
Global | Global | Global |
aria-busy |
Global | Global | Global |
aria-controls |
Global | Global | Global |
aria-current |
NA | Global - Added in ARIA 1.1 | Global |
aria-describedby |
Global | Global | Global |
aria-details |
NA | Global - Added in ARIA 1.1 | Global |
aria-disabled |
Global | Global | Global |
aria-dropeffect |
Global | Global | Global |
aria-errormessage |
NA | Global - Added in ARIA 1.1 | Global |
aria-flowto |
Global | Global | Global |
aria-grabbed |
Global | Global | Global |
aria-haspopup |
Global | Global | Global |
aria-hidden |
Global | Global | Global |
aria-invalid |
Global | Global | Global |
aria-keyshortcuts |
NA | Global - Added in ARIA 1.1 | Global |
aria-label |
Global | Global | Global |
aria-labelledby |
Global | Global | Global |
aria-live |
Global | Global | Global |
aria-owns |
Global | Global | Global |
aria-relevant |
Global | Global | Global |
aria-roledescription |
NA | Global - Added in ARIA 1.1 | Global |