Why does Siteimprove flag aria-hidden?

Summary

Siteimprove flags aria-hidden because it is intended only for hiding content from assistive technologies, not all users. When content should be hidden universally, the HTML5 hidden attribute is the correct approach, and misuse of aria-hidden can lead to inconsistent or misleading accessibility behavior.

Overview

'aria-hidden' can be used to hide visibly rendered content from assistive technologies.
If an editor wants to hide content from all users, we recommend using the HTML5 ‘hidden’ attribute (along with CSS 'display: none' for browsers that do not yet support 'hidden').

What is aria-hidden?

'aria-hidden' can be used to hide visibly rendered content from assistive technologies.

When can aria-hidden be used?

It is appropriate to use 'aria-hidden' if hiding this content is intended to improve the experience for users of assistive technologies by removing redundant content.

In some cases, 'aria-hidden' can be used with using JavaScript to trigger an element to become visible.

<p aria-hidden="true">This content is hidden.</p>
<p aria-hidden="false">This content is not hidden.</p>

Why Siteimprove flags aria-hidden

Siteimprove flag aria-hidden based on this premise that the HTML5 ‘hidden’ attribute is the correct way to hide elements, and ‘aria-hidden’ could be either true or false based on its use.

Additional resources

Further information on aria-hidden on W3C.