WebAIM - Web Accessibility In Mind

E-mail List Archives

Question on descriptive control labels

for

From: Kian Badie
Date: Apr 6, 2022 11:45AM

I am creating a custom audio player, and I am confused on how to label the
buttons. For example, I currently label the play button with just
aria-label="Play" but I can't tell if that is sufficient for a non-sighted
user. For me, If I see a play button and a time scrubber scrubber grouped
together I can guess it is an audio player. But if a screen reader just
announces "play button", is that enough?

I am having trouble finding resources online that clarify this. MDNs
"Accessible multimedia" article (
https://developer.mozilla.org/en-US/docs/Learn/Accessibility/Multimedia)
mentions nothing on this. It looks like able player (
https://ableplayer.github.io/ableplayer/) adds a label to the container
element and gives it a region role. It looks like that gives a more
descriptive screen reader announcement. While that is a clue for me on how
to write things, I haven't seen much else online describing this technique.
Any insight would be much appreciated!

Thank you,
Kian Badie