Font Awesome / Icon Fonts?
I am returning to doing more contract work after a few year break being an instructor. I was wondering if web projects still use icon font solutions like Font Awesome to quickly layout and stylize icons for large projects. I have heard there may be some accessibility issues using icon fonts.
If you work on large projects does your group use icon-font solutions like Font Awesome? Just curious.
16 Replies
yes, people use font-awesome, or other icon fonts
probably the most used one is dashicons because wordpress still includes it in the admin page
I have heard there may be some accessibility issues using icon fonts.Yeah, font icons are a serious accessibility issue! Screen readers and the like will read out the character the font is using and not describe the icon. If you can, NEVER use a font icon system, use actual icons/images. With appropriate alt-text. Otherwise you might as well put a banner on your homepage telling ~15% of your users to fuck off and that they're not welcome.
i strongly agree and strongly disagree
yes, they are accessibility nightmares ... if people dont learn how to do it property
you can fix it with a few aria attributes
Or you could use a proper image
but those icons are important for people without visual impairments too
Do five steps to replicate one…sounds inefficient
true, but then you have extra requests everytime you want to show a new icon
The use a freakin' icon my dude
yes, but my icons are a font/svg
Then inline it if you're that worried about one network request
im not, i just keep on using font icons, but i test them how i can
but i agree with you: "raw" icon fonts are an accessibility nightmare
at the bare bare minimum, use a title or an
aria-hidden, depending on the usewhat about react-icons npm package? Aren't they svg and iirc they have font awesome stuff. Tho I'm not sure if they include it all since font awesome is paid i think
good question
just curious, does your group create images for all of the icons? If so do you use JS to do hover / other effects? Just seeing what strategies other groups are doing. I do see custom icon fonts being used on many sites, so it is still popular, but maybe a technique that it is getting phased out
would adding alt text make them access to screen readers properly?
no, because they aren't images
whoops, duh, right