Live data from Hacker News

Icon Fonts are Awesome

css-tricks.com

11–20 of 48 posts

Re: Icon Fonts are Awesome

#11
post #2

Why arent people using SVG for this sort of thing? Isnt that HTML5's vector graphics format? I supose if you're using icons w/ the express purpose of using them with in-line text, then this would be Ideal... but just seems like a weird hack, when there is SVG available... The author of this website claims to simply be ignorant of SVG at the bottom? whats up with that? Why is using a font "hack" better than using the…

There was an article posted here 1 day ago that explored to great lengths why SVG for scalable icons sounds good in theory - but does not work well in practice. And why icon fonts are the way to go for now. See here: http://www.pushing-pixels.org/2011/11/04/about-those-vector-...

Key point: SVG icons don't actually scale that well because SVG lacks hinting.

Re: Icon Fonts are Awesome

#12
post #10
post #2

Why arent people using SVG for this sort of thing? Isnt that HTML5's vector graphics format? I supose if you're using icons w/ the express purpose of using them with in-line text, then this would be Ideal... but just seems like a weird hack, when there is SVG available... The author of this website claims to simply be ignorant of SVG at the bottom? whats up with that? Why is using a font "hack" better than using the…

SVG would be wonderful if it were not for the lack of native support early on in browser land. That skips over the none trivial problem of what it takes to create a symbol/glyph in SVG. Not only do you have to be a competent typographer, but you also have to be a programmer (SVG is very Postscript like). Yet more barriers to widespread use. None of this is fatal, but like speed-bumps, it certainly slows things down.…

Why would you need to be a programmer to make a SVG symbol/glyph? All vector-drawing programs can export it these days. I think creating a font is more difficult.

Having said that, fonts do have some properties that can be advantageous for black-and-white icons; for example, automatically coloring with the text color and style.

Re: Icon Fonts are Awesome

#13
post #2

Why arent people using SVG for this sort of thing? Isnt that HTML5's vector graphics format? I supose if you're using icons w/ the express purpose of using them with in-line text, then this would be Ideal... but just seems like a weird hack, when there is SVG available... The author of this website claims to simply be ignorant of SVG at the bottom? whats up with that? Why is using a font "hack" better than using the…

Pixel hinting. The desired icons in this case are small ubiquitous monochrome glyphs. Text fonts and font renderers have already optimized that specific use-case tremendously - so why not plug into that.

Re: Icon Fonts are Awesome

#14
I am worried by this trend towards using a custom typeface to store icons. Firstly, whilst it looks great in the giant preview pages linked to on HN, these icons often look terrible at smaller sizes / without anti-aliasing. Secondly, whilst they're undoubtedly efficient when you're going to use a lot of them in various sizes, I question whether that's still true compared to an optimised PNG sprite (which coincidentally can solve the first problem too).

Re: Icon Fonts are Awesome

#17
post #14

I am worried by this trend towards using a custom typeface to store icons. Firstly, whilst it looks great in the giant preview pages linked to on HN, these icons often look terrible at smaller sizes / without anti-aliasing. Secondly, whilst they're undoubtedly efficient when you're going to use a lot of them in various sizes, I question whether that's still true compared to an optimised PNG sprite (which coincidental…

these icons often look terrible at smaller sizes / without anti-aliasing.

Not to forget Windows too. Many font-face embedded fonts look hideous with Windows' text rendering, alas.

Re: Icon Fonts are Awesome

#20
post #9

You will have to download an entire font even if you are only using a few arrows. May not be prohibitive, but it should be kept in mind.

You can create a subset of that font to serve if only using a few icons. I've done that with Scribophile thought I can't recall right now what utility I used to do that.

Expert > subsetting > custom subsetting > single characters

http://www.fontsquirrel.com/fontface/generator

Post reply on HN