TIL ARIA role presentation

POSTED ON: Sep 30, 2022

The presentation role and its synonym none remove an element's implicit ARIA semantics from being exposed to the accessibility tree.

Think of this as a reset. You use role="presentation" to remove semantic meaning from an element.

<!-- how it looks -->
<h2 role="presentation">Democracy Dies in Darkness</h2>


<!-- how it acts -->
<div>Democracy Dies in Darkness</div>

via MDN

Related TILs

Tagged: accessibility

TIL aria-expanded for showing when things are hidden/shown

The aria-expanded attribute is set on an element to indicate if a control is expanded or collapsed, and whether or not its child elements are displayed or hidden.

Oct 31, 2022

TIL ARIA role presentation

Think of this as a reset. You use role=presentation to remove semantic meaning from an element.

Sep 30, 2022

TIL reduce-motion-blur

Dizziness and vertigo are symptoms of a vestibular balance disorder. If the user has set up a user preference that they prefer motion-based animation be disabled/reduced, we can tap into that. As web developers, we can also support them.

Sep 29, 2022

Next: TIL aria-expanded for showing when things are hidden/shownThe aria-expanded attribute is set on an element to indicate if a control is expanded or collapsed, and whether or not its child elements are displayed or hidden.
Previous: TIL reduce-motion-blurDizziness and vertigo are symptoms of a vestibular balance disorder. If the user has set up a user preference that they prefer motion-based animation be disabled/reduced, we can tap into that. As web developers, we can also support them.