31–40 of 48 posts
text-shadow: 0 0 5px #0000ff;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…
> Why arent people using SVG for this sort of thing? Isnt that HTML5's vector graphics format? 1. SVG is slow, text layout engines (therefore fonts) are fast 2. SVG support is pretty terrible (not available on Android 3. I don't think you can use SVG in pure CSS, so you need markup, not so with fonts (theoretically you can use SVG as background, practically I'm sure it works half the time best) 4. You can't hint SVG,…
A big warning for anyone trying this out, don't use it in places where exact placement is required. Browsers (and operating systems) render fonts VERY differently. Just changing the cleartype-settings in windows can make the text placement completely off. Especially after a few letters as the error propagates the more characters you accumulate over one row. Might not be an issue if you only place one letter/icon, whi…
Your icon can only use one color.
Earlier quoted context omitted.
> Why arent people using SVG for this sort of thing? Isnt that HTML5's vector graphics format? 1. SVG is slow, text layout engines (therefore fonts) are fast 2. SVG support is pretty terrible (not available on Android 3. I don't think you can use SVG in pure CSS, so you need markup, not so with fonts (theoretically you can use SVG as background, practically I'm sure it works half the time best) 4. You can't hint SVG,…
Isn't the argument more that SVG sucks, rather than that there is anything fundamentally wrong with vector graphics?
A big warning for anyone trying this out, don't use it in places where exact placement is required. Browsers (and operating systems) render fonts VERY differently. Just changing the cleartype-settings in windows can make the text placement completely off. Especially after a few letters as the error propagates the more characters you accumulate over one row. Might not be an issue if you only place one letter/icon, whi…
This is, I think, the biggest issue with abusing fonts in this way. As a workaround, icon fonts are excellent—but they are still undeniably a workaround. Unfortunately, SVG is the closest we have, and isn’t a viable solution either, for reasons other commenters have thoroughly addressed. I do have (what I think is) a better idea in mind, but I’m not sure how it would ever get adopted.
They are a "workaround" with long history: Windows 95 shipped Marlett for exactly this purpose of using fonts as well-supported vector graphics formats.