HTML Accessibility

Micro-note on aria-roledescription

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:

donald trump


<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
donald trump


<figcaption>Example of a fascist</figcaption>
<img src="dt.PNG" alt="Donald Trump">

8 replies on “Micro-note on aria-roledescription”

Only people with privilege get the choice to ignore politics. Everyone else literally can’t; politics is what happens to you because of other people. Only someone who knows they benefit from the status quo has the opinion that politics is something they can leave outside of other things. Only someone who knows their opinion is unwanted or likely to be contested hides under false names, “Joe”. The very thing you’ve done here is political. We’re tired too.

Have a think about what you’ve done, and for gods sake mark up your HTML properly.

Leave a Reply

Your email address will not be published.