Aria-relevant property is an optional value to an aria-live region. Aria-relevant property is used when the web page contains frequently updating content such as a live chat. Aria-relevant property helps in intimating the updated content to the assistive technology. In some cases it is also important for the user to intimate the logs that are removed. Aria-relevant property supports values such as additions, removals, text and all.
Aria-relevant property is used to intimate the semantically meaningful changes. In a chat log the top most messages are removed to provide space for new messages. These removals does not have any meaning. If a buddy is removed from the chat it means they are no longer available for chat and is a meaningful removal. When aria-relevant=”additions” and aria-relevant=”removals” has to be used to denote the changes aria-relevant=”all” can be used.
Use aria-relevant=”removals” and aria-relevant=”all” wisely. Aria-relevant=”additions” and aria-relevant=”text” are the default values on a live region.
Examples of aria-relevant property on Paul Adam’s
and OOA-Accessibility helps in understanding the concept better.
| Value | Description |
|---|---|
| additions | Element nodes are added to the DOM within the live region. |
| removals | Text or element nodes within the live region are removed from the DOM. |
| text | Text is added to any DOM descendant nodes of the live region. |
| all | Equivalent to the combination of all values, “additions removals text”. |