And Google Smote the Font Limitations, and There was Much Rejoicing

Font usage on the web has always been something of a sore topic for web designers. If you haven’t noticed, there are only really a handful of fonts on the Web. This isn’t because web designers just don’t like other fonts. In fact, quite the opposite is true—web designers want different fonts on the web more than anyone. There’s another reason for the scarcity of fonts on the Web.
It goes without saying that all fonts are different, but people don’t often think about how different. Different leading, em-size, x-height, and even different styles of punctuation can have a pretty huge impact on the feel of a site and on how we read it. All of these things can differ from font to font, so planning a design in one font and then switching at the last moment could have a dramatic effect on the final product.

That right there is our problem. Web designers can specify any font that they want to for normal text on a website. But if I tell my website to display text in Futura (one of my favorite fonts), I run into the problem that not everybody has Futura—in fact, most people don’t. CSS allows for designers to specify back-up fonts, but as discussed above, this can have a negative impact on the site if the two fonts don’t match, and they usually don’t.

To make matters worse, we can’t even rely on fonts that come pre-packaged with operating systems. Yes, we can use Century Gothic, and all Windows users will see it; but Mac users will be left with the back-up, and users on other operating systems (Linux, Android phones, Playstation 3) will probably be left with a font not even close to the original.

For this reason, there are really only a few fonts that we can rely on everybody having: Helvetica/Arial, Times/Times New Roman, Verdana, Georgia, and a mono-spaced font like Courier. There are a few others you can rely on most people having, like Tahoma and Lucida Sans, but to ensure consistency for all users, font choices become very slim.

A few years back, a new technology gave designers the ability to embed fonts so visitors to the website could download it if they don’t have it. But—you guessed it—there’s a problem with that too: copyrights. All fonts are essentially designs, and just like photographs and web designs, the good ones usually have a copyright attached to them. Embedding copyrighted fonts is actually a form of piracy.

Google, being the revolutionaries that they are, decided to change all of this. No, they didn’t just give the world a copy of Futura. What they did is create an online library of high-quality, royalty-free fonts for designers to use. That in itself would be enough of a public service, but they went a step further: they wrote all the code to correctly embed these fonts. Designers just have to pick out a font, paste one line of code into their websites, and then use the font just like any other.

If you’re interested in what new fonts are available to web designers, you can check out the Google Font Library here:http://code.google.com/webfonts

Even better news is that they’re adding new fonts to the library. It looks like four new ones went up just this week. So as time goes on, the availability of fonts to web designers is going to grow.

The Google Fonts Directory is going to help bring typography on the Web to a new level. It’s also going to bring usability to a new level, as we’ll be able to use actual text rather than an image if we want to use a font other than the old standards. This is an exciting change for the Web, and I’m excited to see what the next few years are going to look like with tools like this in use.