We have come a long way on web typography. I remember the first time I made a site and I wanted to have my navigation in a specific font, but sadly the only way I could do that was to use images. People have come up with some solutions over the years using Flash or Javascript like SIFR, Cufon, and Typeface.js but now things are changing for the better. We have @fontface and almost all major browsers support it. This is a really exciting development because now designers and engineers don’t have to rely on any external software or plugin to load fonts, it's implemented into the browser and it’s the simplest approach of all.

Even though @fontface has been around since CSS2, it only recently became popular. This is mostly because not all browsers supported it at first and it started with only supporting OTF (Open Type Fonts), but has recently began supporting TTF (TrueType Font) which gives the user a much wider range to work with.

So what's all the fuss about? Well now designers can freely create websites without the limitations they had before, they can choose from thousands of fonts without having to worry about creating images for every single navigation point on the site. The ease of use is just one perk. We no longer have to have a million images for a navigation that doesn't use web safe fonts. We can simply use @fontface, upload the file to the server and boom! You have custom fonts on your site. Getting rid of all those individual images on the navigation helps to drastically cut down on bandwidth and load times.

It's not all sunshine and rainbows though, there are still some limitations. For example, Safari on iOS doesn’t support @fontface because you can’t actually download anything to the device through Safari. Fortunately, Safari does support SVG and we can simply convert a font into a SVG font and our custom fonts now work on all iOS devices (free font converter http://www.fontsquirrel.com/fontface/generator).

There are great services out there such as typekit.com with hundreds of fonts and Google always has a tons of free goodies that we can use. http://www.google.com/fonts. You can choose from either of their large font galleries and quickly embed it to your site, all you need is a simple line of code.

CSS3 and HTML5 are making our jobs easier, the web richer, and I am personally very excited to see what other kick-ass abilities they bring us in the future.