Icon fonts and accessibility

A few good article links for icon fonts, why they are bad and how you can use them if you really need to.

I’ve have been using svg-sprites from icomoon.io/app for a current project but have been considering how to convert them to CSS-based or icon fonts if the project implementation needs it..

 

Seriously, Don’t Use Icon Fonts – Cloud Four
https://cloudfour.com/thinks/seriously-dont-use-icon-fonts/

Some good points, thoughtfully set up as section titles:

  • Screen Readers Actually Read That Stuff
  • They’re a Nightmare if You’re Dyslexic
  • They Fail Poorly and Often

 

They thoughtfully point you toward a good article on how to implement them properly:

 

Bulletproof Accessible Icon Fonts | Filament Group, Inc., Boston, MA
https://www.filamentgroup.com/lab/bulletproof_icon_fonts.html

 

And the github repo for Bulletproof Icons solution, to make it easy to implement and use.
filamentgroup/a-font-garde
https://github.com/filamentgroup/a-font-garde
a-font-garde – A variety of test cases and tools for safe font-icon usage.