This one is for the typographer inside every Web designer. Since the inception of the Web, designers have toiled with the lack of font options for their online creations. Typically, if you wanted to make sure your non-graphical text rendered smoothly and consistently across all browsers across all platforms, you stuck to the handful of system fonts made available on both the Mac and PC (e.g. Arial, Verdana, New Times Roman).

Sometime in 2005, Mike Davidson and Mark Wubben invented sIFR (Scalable Inman Flash Replacement), a clever little “applet” that used JavaScript and Adobe Flash to dynamically replace text elements on HTML pages with Flash equivalents (based on text-to-flash replacement technique by Shaun Inman, hence, the name).  sIFR was not suitable for body text and required a call to the Flash player for each rendering which could slow page-load times. Other non-Flash variations emerged such as FLIR (Facelift Image Replacement) which replaces text with dynamically generated images (using server-side scripting language PHP) and Cufón which uses JavaScript and vector graphics to write fonts from an XML font file (e.g. TTF, OTF, PFB). But these too had their shortcomings.

Then in 2010, the Google Font Directory emerged from Google Labs, leveraging the “power of the cloud” to provide high-quality Web fonts anywhere regardless of the browser or device (you can read the announcement on the official Google Code blog). Google has made adding these fonts to your Web pages incredibly easy for even the non-technical, using CSS3 and the Google Font API. Just select a font and follow the steps for copying and pasting the code into your Web pages. All the fonts are open-source so there are no copyright worries.