ARIA Hidden Focusable Content Check

RuleSets of AccessMonitor - the validator of web accessibility practices

ARIA Hidden Focusable Content Check

Description

The “ARIA Hidden Focusable Content Check” evaluates whether all elements with aria-hidden="true" contain focusable or interactive content, such as buttons, links, or inputs.

Example outcome

I haven’t found any elements with the aria-hidden attribute that have focusable content.

Impact

Fixes

To address inappropriately focusable hidden content:

  1. Locate the element that contains aria-hidden="true".
  2. If that’s appropriate, remove focusable children from hidden containers.
  3. If the children element(s) are interactable, remove the aria-hidden="true" attribute.
  4. Finally, is most suitable, you can also disable the focusable element while it is hidden from assistive tech.

Resources