The Wonderful World of Web Fonts
If there is one universal truth about graphic designers it is that we are obsessed with typefaces (aka fonts). Seriously. We dream about serifs (those little frilly bits at the ends of letters). We write odes to our favorite fonts (Neutraface) and create global coalitions condemning the fonts we hate (Comic Sans Criminal).
Sure, this obsession might seem strange to the outsider, but trust me, it affects you more than you think.
Fonts are everywhere, on every package, magazine cover, billboard and website. Fonts have personalities. Some convey joy, others stark professionalism. Some are highly legible and can be read at very small sizes while others are decorative works of art. Fonts are important.
Which leads us to the sad truth of the web.
Until only a handful of years ago, you could only use about 9 fonts on websites. Yep, that’s it—9 fonts that were preloaded on just about everyone’s computer. These fonts were Arial, Comic Sans, Courier New, Georgia, Impact, Times New Roman, Trebuchet, Verdana and Webdings. Can you say boooring!
There were a few ways to bypass this problem, most notably by using Flash or images to contain unique fonts, but any good SEO will tell you that these did not play nice with the big G (Google) and any good designer will tell you that they often weren’t user friendly.
So, what changed?
In 2011 the rules that govern the web exploded. CSS and HTML (the markup languages that tell websites what to do and how to look) got a major upgrade. Suddenly websites could easily be made responsive and fonts could be integrated with only a couple lines of code. The stone age of web design was over. Angels began singing, designers did a happy dance, and for one day not a single person on earth was sad—ok, I’m exaggerating, but it was a big deal.
Font choices on the web began to flow like manna from heaven.
Chances are you have probably noticed that a lot of websites are using different fonts. If you haven’t—visit a few of your favorite websites, many of them are using unique fonts that reflect their individual brands.
Here are a few examples:
- Twitter uses Gotham Narrow
- Mashable uses Museo Slab
- LA Times is using Belizio and their own headline font LAHeadline
- Oneupweb (yes even us) uses Bebas Neue and Roboto
There are 1000s of web font choices available.
There are many places you can find and select web fonts for your website. The most notable of these web font services are Adobe Typekit and Google Fonts. Yes, even the big G is in on the web font love fest.
Adobe Typekit
Typekit was the first major player in the web font space. Beginning way back in 2009 the founders were able to take advantage of emerging technologies and develop a solution that made web fonts feasible. Not long ago Adobe acquired Typekit and brought with it the entire and most coveted Adobe font library with it.
In my opinion Adobe Typekit has the best library of high quality typefaces on the web. These are the fonts that designers have coveted and used for years. Well known and high quality fonts (A.K.A. the ones designers drool over) such as Futura, Minion, and Proxima Nova are available through Typekit. However, being high quality also means paying for it.
Google Fonts
Google Fonts has 645 different font families—all are FREE. It is for this reason that many of the fonts available on Google Fonts have become immensely popular not just on the web but also in print. Popular fonts on Google Fonts include Open Sans, Roboto, Droid Serif and (the infamous) Lobster. Google fonts are easy to implement and tend to render well in most browsers.
So…is your website still stuck in the stone ages?
With all of the options now available is there any reason to restrict your brand identity? I say NO. Your website should reflect the personality, style and level of professionalism that your business evokes in your audience.
Fonts are the visual voice of your brand. Make your website express it.
