Using ARIA

For: Development

Name, Role, Value (4.1.2 level A)

https://www.w3.org/WAI/WCAG21/Understanding/name-role-value

Use ARIA (Accessibility Rich Internet Applications) to enhance accessibility only when HTML is not sufficient.

Please remember that Bad ARIA is worse than no ARIA.

ARIA adds extra information that lets people who use assistive technologies know what is going on. If a component needs more description than HTML provides, you need to mark it up with an ARIA pattern.

Avoid creating custom widgets when HTML elements already exist.

If you have a complex component, check whether it fits into a defined pattern from the ARIA authoring practices.

Custom widgets that might need ARIA patterns are:

• accordions
• modal dialogues
• tabs

If you use an ARIA pattern, include the ARIA attributes, take responsibility for the keyboard interactions as part of the scripting, and test it with assistive technology.

Status Messages (4.1.3 level AA)

https://www.w3.org/WAI/WCAG21/Understanding/status-messages

When conveying a status message, use ARIA live regions or ARIA alerts to announce the message to screen reader users.