Test your knowledge of ARIA roles, properties, and live regions used in accessible web development.
0 / 5 completed
1 / 5
What does the ARIA attribute `role="navigation"` communicate to assistive technologies?
role="navigation" marks a landmark region containing navigation links, helping screen reader users jump directly to the site navigation.
2 / 5
Which ARIA attribute provides an accessible name for an element when no visible label text is present?
aria-label provides a text string as the accessible name directly on the element, useful for icon buttons without visible text.
3 / 5
What is the difference between `aria-live="polite"` and `aria-live="assertive"`?
aria-live="polite" announces updates after the user finishes their current action; aria-live="assertive" interrupts immediately and should be used only for critical alerts.
4 / 5
What does `aria-expanded="false"` communicate on a disclosure button?
aria-expanded="false" tells screen reader users that the controlled region (e.g. a dropdown or accordion panel) is currently collapsed, and "true" indicates it is open.
5 / 5
When should you use `aria-labelledby` instead of `aria-label`?
aria-labelledby references the ID of an existing visible element to use its text as the accessible name, avoiding duplication and keeping visible and programmatic labels in sync.