Our creative partners have always cringed when we tell them we have to scrap their gorgeous custom font and replace it with something like plain-old Verdana. For the past 3 years, we have convinced some of clients to enable websites using Cufon or SiFR. These solutions worked around the web browser’s limitation of using fonts the viewer does not own by mixing Javascript and Flash or SVG to re-draw text in the custom font.

Both technologies produced an unpleasant user experience as they sized and displayed fonts in real-time to the user. Especially on slower machines, users would see the font drawn and redrawn at several decreasing sizes until the process was “just right.”

Google, in coordination with TypeKit, has released an elegant solution to this problem. The WebFont loader allows us to leverage custom fonts to be rendered natively by the web browser. That’s right your CSS file could say font-face:”Your font name” just as easily as “Arial.” In other words, there is no learning curve to being able to apply this technology.

This is done without Javascript and without Flash or SVG technology. All modern web browsers and their mobile counterparts support @font-face technology within the CSS specification. Since we are describing fonts in CSS we do not have to worry about upsetting search engines.

So while all fonts are not yet web-safe, this technology makes some 550 (and growing) fonts available for use.

Some free fonts: http://code.google.com/webfonts
500+ affordable fonts: http://typekit.com/libraries/full