Remember the days when the trusted web-safe fonts, Arial, Verdana, Georgia and Times Roman were a designer’s best options for setting HTML text? Headings or intro paragraphs with a specific typographic flair had to be exported as JPEGs or GIFs, resulting in a data-heavy site and affecting download speed. As a result, maintaining a site became very time consuming.

Well, web typography has come a long way, and now web designers have unlimited browser–friendly fonts to choose from.

It all started a few years ago with font replacement tools such as sIFR and then Cufón, which, with some nifty JavaScript or Flash, replaced text on the page with any font you desired. These tools helped SEO and indexing, and lead to the development of real web fonts.

Currently, real web fonts are hosted on servers across the globe. Companies such as Typekit, Fontdeck, Google Web Fonts, and Webtype are service-orientated: they provide licenced access to their typefaces, allowing designers to use type more effectively.

But don’t get me wrong, I’m not knocking those web-safe fonts we’ve been using for years. In fact www.alistapart.com, as an example, uses Georgia and Verdana so well you almost wouldn’t recognise them. What I’m simply saying is: real fonts are great as something different to try, when designing for the web.  

Not Just A Pretty Face

What is the commotion all about, then, and why are real fonts such a big deal for the modern web designer? The great advantage of using services like these is all your text on the page is searchable, indexable and selectable. Real web fonts enable you to re-enforce the visual identity of a brand or company without creating cumbersome graphics to do so.

Take the Design Indaba website for example. Last year the website used Arial for the majority of the content. Now, however, the site uses ‘proxima-nova’ – a beautiful web font with multiple weights to compliment the brand, a great choice. Note here that all content is selectable and searchable without having to use default system fonts such as Arial or Verdana.

The Fuss Around Real Fonts

Well, just like a graphic designer chooses a specific typeface for a brochure, business card or logo and decides whether to use a light or bold weight or a combination of both, so too can today’s web designer.

When designing your next website, take careful consideration of which typefaces you use. Choosing fonts for body copy or headings shouldn’t be the last thing on your list superseded by images, colours and layout. The fonts you use are equally as important. Remember, typography can enhance your visual message.

I would start with Google Web Fonts, an Open Source service that is easy to use. Not all the fonts are 'top draw', but the top trending typefaces are well worth a look.

What The Fount?

Here's a great web feature for you font-lovers. Should you stumble across a particular bit of lettering that takes your breath away, there’s no need to scroll through endless type libraries to identify the elusive font. As with most aspects of digital, there are tools available to help you broaden your font knowledge. Fount is a very cool example of one of these. By clicking on a font in your browser, the tool identifies not only that font, but the size and weight, too.

I leave you with some words of font wisdom from Matthew Carter, designer of Verdana and Georgia. He says: ‘Type is a beautiful group of letters, not a group of beautiful letters.’ Type geeks take note: Carter will be speaking at Design Indaba 2013.

For more on real fonts and typefaces, here’s a great talk by the founder of Typekit, Jason Santa Maria, on Web Typography.