- From: Patrick H. Lauke <redux@splintered.co.uk>
- Date: Mon, 30 Nov 2015 22:50:36 +0000
- To: Michiel Bijl <michiel@agosto.nl>, Web Accessibility Initiative Interest Group <w3c-wai-ig@w3.org>
- Cc: Ja Eun Ku <jku@illinois.edu>
On 30/11/2015 21:37, Michiel Bijl wrote: > Jemma and I are doing some accessibility testing on icon > fonts—especially Font Awesome—and how assistive technologies handle > them. I’ve setup a GitHub repository called Font Awesome > <https://github.com/MichielBijl/font-awesome> (because we initially > targeted that specific library; should rename it). I’ve already added > one test example and some test results, but suggestions for more > examples (ways to fix the issue of icon fonts being announced weird), or > test results for existing tests, or even tips on how to display test > results properly; it’s all welcome! Generally, icon fonts can pose problems even for users without any specific assistive technologies - such as users with dyslexia who have specified their own custom fonts - see https://www.youtube.com/watch?v=9xXBYcWgCHA / https://speakerdeck.com/ninjanails/death-to-icon-fonts and http://blog.cloudfour.com/seriously-dont-use-icon-fonts/ However, if you must use them, and you're only concerned in the first instance with screen reader users, a fairly well supported (though verbose) technique is to hide the element with the icon itself with aria-hidden="true" and to have a visually hidden, yet accessible, additional element with actual text description where needed. See the "Accessible icons" advice and following examples in http://getbootstrap.com/components/#glyphicons-how-to-use for instance. 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
Received on Monday, 30 November 2015 22:51:00 UTC