ARIA hidden element must not be focusable or contain focusable elements
What is the problem?
The aria-hidden="true" attribute is used to hide content from screen readers. However, if elements with aria-hidden="true" are focusable or contain focusable elements, screen readers may still attempt to read or navigate these elements, causing confusion and disrupting the user experience.
Impacted Groups
Why is this important?
Screen readers rely on focus to navigate content. If hidden elements are focusable, screen reader users may be directed to unexpected or irrelevant content, making it difficult to understand the page structure and find the information they need.
How to solve this issue
To fix this issue, ensure that elements marked with aria-hidden="true" are not focusable and do not contain any focusable elements. This can be achieved by removing any interactive elements or keyboard traps from hidden content.
Rule Information
Rule ID
aria-hidden-focus
Severity
Manual Review Required
Rule Group
WCAG 2.0 Level A & AA Rules
Guidelines
- WCAG 2.1 (A)
- WCAG 2.0 (A)
- WCAG 2.2 (A)
- Trusted Tester
- EN 301 549
Customise Guidance
You can customise each accessibility rule in SiteAlly with your own guidance, instructions and even links to your own organisation specific documentation.
Enable your website editors to resolve issues quickly with SiteAlly.
Ready to make your website accessible?
SiteAlly provides automated accessibility monitoring, detailed reports, and step-by-step guidance to help you achieve and maintain compliance.