@font-face vs Google Web Fonts
-
18-04-2021 - |
Question
I've designed a site using numerous Google Web Fonts. Unfortunately, on WinXP (IE6-8), some fonts seem overzealously anti-aliased, and lose visual definition & clarity. No issues on any other browsers (Safari, Chrome, FF) on IE8 nor on any browsers on MacOSX.
IE8 on WinXP (Over-zealous AntiAliasing)
Chrome WinXP (Looks Good)
So I'm considering using the equivalent fonts from fontsquirrel.com. What are the advantages/disadvantages of using @font-face as opposed to Google Web Fonts? So far, from my experimentation, they look much better...
PS. does document.ready() get fired after @font-face fonts are loaded?
Solution
There is no difference.
If you take a look at the back-end of Google Web Fonts, it uses @font-face
in exactly the same way that everyone else uses it, including FontSquirrel and its @font-face
generator. Nothing magic, nothing extra-special. It's the font itself that matters, and the browser's rendering engine.
You could try a different font, or you could use browser-specific stylesheets to solve that particular problem.
P.S. No, the DOMContentLoaded
(jQuery ready
) event fires after the DOM is loaded, as the name suggests. load
may fire afterward, I'm not sure. Best not to rely on it.
OTHER TIPS
If you want it to be exactly the same on all browsers use something like Cufon.
http://cufon.shoqolate.com/generate/
https://github.com/sorccu/cufon/wiki/Demos
There is a comparison of them all in this article
http://www.nineteenfortyone.com/2010/06/cufon-vs-css3-vs-google-font-api/
Someone asking a similar question here >>