accessibility glossary

aria-hidden

aria-hidden is an attribute that hides an element and everything inside it from assistive technology, while leaving it fully visible on screen, most often used on purely decorative icons and images.

Setting aria-hidden=”true” on a decorative icon next to a text label (like a small arrow icon beside a “Next” link) prevents a screen reader from announcing the icon redundantly, since the visible text already conveys the meaning. It should never be applied to interactive or focusable elements, or to content with no other accessible equivalent, since that would hide real information or controls from assistive technology users entirely.

A frequent, serious bug is applying aria-hidden to a container that still contains a focusable button or link inside it, which creates a confusing state where keyboard focus can land on an element the screen reader is told doesn’t exist.

Need help with Accessibility Remediation Services? See how halfAccessible can help.

Accessibility Remediation Services