Fonts, fonts and more fonts

One of the big limitations in web design has been the number of fonts available for use.

2010 saw this all change.

Using some very simple CSS, (@font-face) IE4+, Firefox 3.5+, Safari 3.1+, Opera 10+ and Chrome 4.0+ have allowed designers to add any font to be used by a website. In the past this was achieved by a variety of methods: using images, Flash, Javascript or a combination of these. They weren’t particularly easy to set up and had their own unique problems. With the advent of @font-face becoming available for use in browsers, this complexity was removed.

However, aside from the technology aspect, the legal aspect was a problem for designers – no matter which method was used to automatically generate the text.

In November 2009, TypeKit was launched – a place where designers could legally purchase fonts for use with @font-face and suddenly hundreds of fonts became available for use.  After just one year, Typekit was serving fonts to over 100 million unique users per month and is used by huge sites such as Twitter and The New York Times. Blogging platforms such as WordPress.com and Typepad have Typekit ready to be used.

TypeKit is not the only webfont provider: others include Fontdeck, Typotheque, Font Spring and Kernest. The League of Moveable Type offers a small selection of nice open source fonts available for free.

More and more sites will use webfonts/@font-face in the future and it’s changing the way we design sites for our clients.