You can now forget all about sIFR, Googles new Google Font Directory takes care of your font problems!

As many of us web designers know, we are all very restricted as to what fonts we can and cannot use. This is because the font must already be installed on the user’s machine. Since asking the user to download and install a new font just so they can view our web pages the way we intend them to is perhaps just a bit too much, there are many work-arounds. One of them is using images, which creates mainly two problems:

1. Google spiders can’t access the information.
2. CMS systems can’t change them.

One other solution is to use sIFR, a Flash/Javascript based script that dynamically replaces your text with a font of your choices, imbedded in a SWF file. This solution works, but it’s a mess and a bit hard to control and make it look exactly the way you want it to.

But now, we can forget all that!

Released back in 19th May, Google’s new API allows us to include web fonts from their servers and then use them on our web pages. No downloads or pre-installed fonts necessary. The only downside is that you’re restricted to the fonts avaliable on Google’s servers, but I’m sure it will expand in time.

So how do you actually use it? Well, all you need is one line of code and a change to your CSS. This is what you put in your header:

<link href='http://fonts.googleapis.com/css?family=Cantarell' rel='stylesheet' type='text/css'>

And you just replace the word “Cantarell” with the font of your choice. And then you just call upon that font in your CSS like this:

h1 { font-family: 'Cantarell', arial, serif; }

Nothing more to it than that. Just surf over to Google Font Directory and see their list of avaliable fonts and see if they have something you want to use.