Having Fun With Web Fonts

Submitted by Kieran on Aug 29, 2010

Since web year dot, anyone building a site has had the unenviable task to decide which of the 5 or so web fonts they wanted to use.  Should it be the dull boring font, the newer but desperately unfashionable font, or Arial?  This has stifled the look of the web.  Over the years people smarter than me have come up with numerous ways to get other fonts to show on your website.  Usually these were either images, or using SIFR which makes use of Flash, neither very good from an accessible standpoint.

But with the introduction of CSS 3 and the @font-face property, we can now have creative control over how we want out typography to show...  but there is a catch!  Although most computer users don't realise this, but the fonts which you have on your computer are licensed for use ON YOUR COMPUTER ONLY.  So you can't take for example Myriad Pro and upload it onto the web and use it on your website.  So just as it was starting to look good for web developers, the lawyers bring us back down to earth with a bang.  If you want your site to stand out you have to pay through the nose for licensed fonts.

Not now though.  While wandering through the internet today, I came across a site called typekit.  This site has agreements with type foundries that for a small cost - For most people needs, free even - you can link to their site and use the fonts they have available.  Just look at the headings of my posts and you'll see that its not a standard font.  As I said, the pricing is very good, the most most users would have to pay is $50 per year as shown in their pricing structure below.

Once you've signed up for an account, all you need to do is add a couple of lines of javascript into your site's <head> area and then choose the fonts you want to use.  It really is that simple.

For most people, a couple of fonts would do them for their blog, and the free plan is designed for that.  Bloggers to have a bit of fun with their site and make it stand out from the crowd.  I would definately recommend this site to people who want that bit extra.

Add new comment

Please enter your email address here. This will stay private and will not be sold.

Filtered HTML

  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.

Plain text

  • No HTML tags allowed.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.
Type the characters you see in this picture. (verify using audio)
Type the characters you see in the picture above; if you can't read them, submit the form and a new image will be generated. Not case sensitive.
glqxz9283 sfy39587stf02 mnesdcuix8
sfy39587stf03
sfy39587stf04