5 ms·
Don't ship icons as fonts either. SVG was made for a reason.
by SSLy 8y ago
Don't ship icons as fonts either. SVG was made for a reason.
- ggreer 8y agoI agree that icon fonts are a hack, but the web is made of countless hacks. This specific one seems benign. Users won't notice or care whether you use icon fonts or images. Icon fonts are approximately the size of the equivalent images, they work alright across platforms, and they're pretty easy to use and deploy.
- RandomInteger4 8y agoMaybe I'm mistaken, but f I recall correctly, I think the issue with icons as font was accessibility, rather the average user with full sensory capabilities.
- ggreer 8y agoSimilar to icon images, you'd use aria-label, aria-hidden, and title attributes.
- danShumway 8y agoIt's not benign -- icon fonts are bad for accessibility because screen readers will read out the actual glyph unless you use pseudo-elements or extra markup. Additionally, many users on limited connections will turn off web fonts, and then your icons will break. It's a hack that was necessary at one point, but has been largely displaced, like table layouts or image-based drop-shadows. SVG is just better nowadays[0]. You can even use the same pseudo-element tricks to insert them purely in CSS, which is yet another accessibility win. [0]: https://css-tricks.com/icon-fonts-vs-svg/ https://css-tricks.com/icon-fonts-vs-svg/
- anoncake 8y agoAt least in Firefox, the user can enforce their font preferences and ignore the fonts specified by the web page. Icon fonts break that.
- microcolonel 8y agoOne benefit of shipping icons as fonts is that you can use hints to make them work on non-multiple grids.