Labeling Icon-Only Links
A response to “Accessible SVG Icons” on CSS-Tricks.
Note
Message thread
Barry wrote on
Is there any difference between:<a href="/" aria-label="Good Label"><svg aria-hidden="true" … ></svg></a>
and<a href="/"><svg aria-label="Good Label" role="img" … ></svg></a>
And why not use <title> in this case?
Matthias Zöchling wrote on
In reply to previous comment.
In theory they are the same, see html5accessibility.com/stuff/2020/11/07/not-so-short-note-on-aria-label-usage-big-table-edition/, but …
… the second form is more verbose in VoiceOver, because SVG with aria-label is announced as a group, so rather go with aria-label on the link.
Get involved
Feel free to share this thread. But keep in mind, it was published more than three years ago, so comments are closed.