All Posts By

James Random

The Mysterious Ways of Web Typography

It has recently come to my attention that there are more honest politicians than there are web designers who understand typography.

As few as that!? You cry.

When I say ‘typography’ here, I am not talking about the creation of fonts or typefaces, I am talking about the way information, type, is laid out on a particular web design. How web designers consider leading and kerning in text, choices of fonts, positioning and sizing.

To put it simply, typography at this level can be a lot like playing Tetris. And it can be quite fun too. The way type fits together at various sizes can make for some very artistic design that delivers information in a fun way. You don’t really need to know all the rules of typography, but you should know the very basics, after that it’s all
about gut feeling.

But there is also the issue to consider of laying things out properly. The best way to discover how to lay things out properly is to read about Le Corbusier. He was an architect who decided that he wanted to publish his own architecture magazine. As he was considering the layout, he began to liken the columns and blocks of text to rooms in a building, and the spaces between the columns and blocks of text as corridors. This led to the birth of the Modular System and had been used as an editorial design standard ever since. The Modular System is not an absolute when it comes to web design, but the principle of it is always worth bearing in mind.

Choice of font is probably one of the most important design decisions you’ll ever make. You’d be surprised at just what sort of font choices you can make when designing a website. For example, say you’re designing a website that is for something to do with the Victorian period. Your natural instinct is to find a classy serif font, but there were a few sans serif fonts available during the Victorian age that would still work on such a website, and would come across as a little intriguing for it not being an obvious choice.

Monospaced fonts can also be quite neat, especially when you have a lot of columns of text. When you think monospaced you automatically think ‘Courier’ and roll your eyes. But there are quite a few ‘helvitca-esque’ fonts out there that are monospaced and look absolutely brilliant when applied properly.

As you get more and more used to considering type, you’ll begin to see which fonts go together very well. There are some unusual combinations that work
very well and as you discover the norm and the extraordinary, you’ll build up a database of font pairings you can use time again. A personal favourite of mine is Snell Roundhand and Futura Extrabold Condensed.

So. That is what I wanted to do here, make you think more about typography in your layouts and encourage you to research websites where type has been
used brilliantly and in a fun way.

Here are a few examples: