WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Font Awesome Icon Accessibility Help

for

From: Preast, Vanessa
Date: Aug 1, 2017 7:48AM

Are there some good, current resources on using SVG-based icons accessibly? Some of the resources I had found were old and seemed to suggest accessibility problems with SVG-based icons.

Also, what about using Unicode for icons?

Best,
Vanessa

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Patrick H. Lauke
Sent: Tuesday, August 01, 2017 8:39 AM
To: <EMAIL REMOVED>
Subject: Re: [WebAIM] Font Awesome Icon Accessibility Help

On 01/08/2017 13:56, Jim Homme wrote:
> Hi,
> I am learning to work with Font Awesom icons as part of web development training. I want to learn to make them accessible now so I won't have to re-learn them correctly. Hope this makes sense. Can anyone please point me to information aboutmaking these accessible?


While not perfect, the information on
http://fontawesome.io/accessibility/ might start you off in the right direction. This is cribbed in part from the accessibility advice on http://getbootstrap.com/components/#glyphicons-how-to-use (different icon font system, same idea behind it though).

Of course there are gaps here - particularly when it comes to users who may have their own font preferences set that override author-defined fonts. Moving to SVG-based icon solutions is the more robust approach here in most cases.

P
--
Patrick H. Lauke

www.splintered.co.uk | https://github.com/patrickhlauke http://flickr.com/photos/redux/ | http://redux.deviantart.com
twitter: @patrick_h_lauke | skype: patrick_h_lauke