Search code examples
htmlhiddenwai-aria

Is presence of aria-hidden sufficient or is value set to "true" required (aria-hidden="true")


The html "hidden" attribute is a boolean and does NOT need a value set. It's mere presence is sufficient.

What about the "aria-hidden" attribute? Is it's mere presence sufficient? Or does it require the value "true" to be set?


Solution

  • aria-hidden must have a value of true|false. Note, however, that aria-hidden is not needed if you are using the hidden attribute or if you are using CSS visibility:none or display:hidden. All three of these latter three ways to hide will also hide the element from a screen reader. You only need aria-hidden="true" if there's something on the display that you want to hide from a screen reader, such as a decorative element that does not add meaning to the page.

    If you are "hiding" an object by setting its font size to 0 or using a clipping rectangle or "pushing" the element off the screen with x or y, then you will need to set aria-hidden="true" on that element because the former techniques are only visually hiding the element and not truly hiding the element.