Font-Embedding Icons the Right Way—A Legitimate Alternative to Images(somerandomdude.com)

31 pointsby joshuaccvor 15 Jahren4 comments

Font-Embedding Icons the Right Way—A Legitimate Alternative to Images

http://somerandomdude.com/2012/01/31/font-embedding-icons-the-right-way/

3 comments

zokiervor 15 Jahren

Where do the default glyphs come from? Are they specified in Unicode standard, and is there a default glyph for every code point? Is there some font that has collected those?

edit: after some googling it appears that those code points are defined to be the glyphs from "ITC Zapf Dingbats". There is reference glyphs for all code points, and there is no "standard" font. I guess some font foundries license ITC Zapf Dingbats to cover that range in their font?

yewvor 15 Jahren

Most Unicode fonts don't include glyphs for all code points (and those that do are usually relatively low quality).

If your selected default font isn't appropriate, an application can use font substitution to render selected glyphs using another font.

DanBCvor 15 Jahren

I like the mapping to Unicode where possible.

May I ask: What's this like for accessibility? How do screen readers render these?

jurigavor 15 Jahren

The icons can be made "invisible" to screen readers by including the icon in a custom data attribute (e.g. [data-icon]) and using the right unicode character.

The creator of IcoMoon (http://keyamoon.com/icomoon/) has made a nice demo video:

http://www.youtube.com/watch?v=EWq7idrW2yU

mjmahonevor 15 Jahren