WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Guidelines on making <i> icons accessible?

for

From: Jonathan Avila
Date: Jul 23, 2017 3:24PM

Vanessa, there are two issues:
1. There is no accessible name for screen readers and other assistive technologies. The code suppresses the font icon from being announced to a screen reader/spoken by speech recognition user but doesn't replace it with an accessible name. ARIA can be used to add an accessible name on the anchor element.
2. The font icons will likely disappear if a user with low vision or a cognitive disability replaces the font on the page with a more preferred font. Currently #2 is not clearly/directly required by WCAG 2. But to help users who replace fonts you can add role="img" to the icons so that they may use this to exclude them from being replaced in their custom style sheet.

Jonathan

Jonathan Avila
Chief Accessibility Officer
Level Access, inc. (formerly SSB BART Group, inc.)
(703) 637-8957
<EMAIL REMOVED>
Visit us online: Website | Twitter | Facebook | LinkedIn | Blog
Looking to boost your accessibility knowledge? Check out our free webinars!

The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.