The Evolution of online typography

Go onto pretty much any modern website and you’ll be greeted with text rendered in beautiful, crisp and exciting font. You probably see online typography like this every day and take it for granted, whether you’re reading it on a computer screen or on your phone.

But it wasn’t always this way. Spare a thought for your internet ancestors, who had to endure webpages written in badly rendered and downright ugly fonts.

To be honest, it’s safe to say that typography wasn’t a huge deal to web users and developers in the early 90s – the fact that they were reading words that were coming to them from someone else’s computer was excitement enough. However, those words would stand alone, with no multimedia content on the page. Images, audio clips and video files could only be accessed by clicking a link, which would open the media in a new window.

That all changed in 1993, when the National Centre for Supercomputing Applications released their Mosaic browser. This was the first internet browser to display images and text inline (i.e. on the same page together). This seemingly simple change transformed the web into a much more visual experience, and developers were inspired to pay more attention to the presentation of their sites.

1995 saw the arrival of the tag, courtesy of Netscape. This offered web designers the freedom to choose what typeface would be used to display the text on their webpages – previously the font was dictated by the user’s browser. Unfortunately, it was a pain to create style variations on fonts across your site. If you wanted to make all your page titles show up in blue at 18pts size, for example, you had to write this into the HTML markup of each and every page.

Fortunately, CSS came along in 1996, allowing developers to write a single set of style rules which would direct the presentation of their websites. Now you could just tell all the pages on your site you wanted blue 18pts titles, and if you decided to change them to green later, you could just go into the CSS and edit the rules, rather than editing the HTML of EVERY page on your site.

1996 was also the year that Microsoft released the internet’s core fonts, chosen for their legibility and their diversity as a complete ‘toolkit’ of typography styles for a variety of different purposes.

For a long time, these core fonts were the main staple fonts of the internet. As a developer you were free to specify whatever font you wished in your site design, but users would only see it if they had the font installed on their computer. If not, the text would show up in a default typeface instead. Designers were limited to so-called ‘web-safe’ fonts which were likely to be already installed on most users’ devices.

Paradoxically, this problem was pretty much solved back in the 90s. Both CSS and Internet Explorer allowed automatic font file downloads so web text would display as they were intended to – but font foundries were wary that their beloved creations would be pirated, and thus the vast majority of internet browsers would not enable this download function.

Even the aforementioned Internet Explorer would only allow fonts in Microsoft’s own Embedded Open Type (.eot) format, which rival browsers weren’t licensed to use, so it was more or less a waste of time for developers to implement .eot fonts on their own sites.

At least the fonts we did have were looking nicer. The late 90s saw improvements in anti-aliasing (removing the jagged edges of letters by converting them into semi-transparent pixels) and the arrival of higher-definition computer monitors.

2005 offered a glimmer of hope with the arrival of sIFR, which could be used to embed lines or small portions of text in Flash format – and because it wasn’t ‘copyable’, you could use any pretty much any font you wanted.

It seems web browsers eventually grew tired of the typography restrictions they were forced to impart, because in 2008 Apple gave Safari the power to download OpenType and TrueType fonts. Rival browsers quickly followed suit to avoid being left behind, and a year later the Web Open Font Format appeared, offering basic copy protection for font families.

Meanwhile, several webfont services such as TypeKit, Font Squirrel emerged, working closely with font foundries to bring the internet a huge choice of licenced web-only custom fonts.

The number of legally available webfonts quickly surged, and nowadays developers have thousands upon thousands of fonts to choose from for their web projects. There’s even free font services such as Google Fonts, offering hundreds of open source fonts without the licensing headaches.

Tweet about this on TwitterShare on Facebook0Share on Google+0Share on LinkedIn0

Leave a reply