Skip to main content


🤡 The wrong way to use aria-roledescription to call out someone as a fascist:

https://html5accessibility.com/stuff/2020/10/06/micro-note-on-aria-roledescription/

#a11y #webDev #politics #ARIA


aria-roledescription is not a label

It is an alternative expression of the Aural UI of the role of an element.

inappropriately using aria-roledescription may inhibit users’ ability to understand or interact with an element.
ARIA 1.1

The wrong way to use aria-roledescription and call out someone as a fascist:

code

<img aria-roledescription="fascist" src="dt.PNG"
alt="Donald Trump">

This is wrong because you are not identifying the subject of the image as a fascist, you are overwriting the <img> element role so it effectively becomes a <fascist> element. Also, there is no explicit text identification of the subject as a fascist.

A much better way to achieve the aim of identifying a fascist (and not misusing aria-roledescription):
Example of a fascist
code
<figure>
<figcaption>Example of a fascist</figcaption>
<img src="dt.PNG" alt="Donald Trump">
</figure>

https://html5accessibility.com/stuff/2020/10/06/micro-note-on-aria-roledescription/


André Polykanine reshared this.

in reply to Steve Faulkner

Big issues with Aria-description or ARIA-describedby: it's hard (or impossible) to review that text character by character or word by word. Also, I believe localized strings will not trigger multi-lingual TTS.
in reply to victor tsaran

@vick21 these issues are solvable by the browser in their accessibility tree representation no?
in reply to victor tsaran

@vick21 as far as aria-describedby goes that should have a DOM representation as well as a description string representation, no?
in reply to Steve Faulkner

Yes, but these are usually are not rendered in to virtual buffer or are not located within context, sometimes for the right reasons. Say, a description is generated on-focus. It will disappear as soon as the focus moves away. So, it sort of depends on the screen reader and OS, but the behaviour is inconsistent. A good exampleare automatically-generated image descriptions.
in reply to victor tsaran

@vick21 Arguably, only attaching/exposing an accessible description on focus is a bad practice, and doesn't fit into the "right reasons" bucket.
⇧