Design is in the details: Text & typography

If you have any comments on our articles, send us your thoughts on Twitter.

In my opinion the most overlooked aspect of web design is the text content. It's easy as a designer to leave it until last and attempt to reduce its impact on the graphical elements on the page. Needless to say, this isn't the best approach.

Here are a few of the considerations and techniques I employ.

Typeface Choice

Firstly the typeface you choose should be relevant to the content your are presenting, bearing in mind it is so easy to switch site typefaces in your stylesheet, there is no excuse not to experiment. Along with the truly awful, there are some beautiful (and free to use) fonts on Google webfonts. A few of my favourites are :

The true skill lies in combining fonts to make the best package. Try choosing different fonts for headers and body text.

Font Size

Variable is the answer to this section. Consider the different screen sizes and ways to interact with devices means we need to be responsive on font size too. If you would like an introduction you can always have a read of my Introduction to Responsive Web Design.

Experiment, you'll be amazed how much difference a percent here and there can make.

Font Weight

Finding the balance of font weight with your design is the key and also testing how that weight displays on different devices is vital. I recall wanting to use a 300 weight on one project, it looked beautiful using Chrome on a Mac but illegible when viewed on Chrome on a PC. Test, test and then test some more.

After setting my preferred default weight I then spend an equal amount of time testing different weights to use for strong text and headers.

Line Height

Often the most obvious way to spot an ill planned site is by the lack of attention to line height. Give your text room to breath and in turn it will be more legible.

In Summary

There really is an amazing range and combinations with web typography, the aim is to deliver the combination that best conveys the website's message. There are many great design that put typography front and centre of a design, my approach tends to be one of subtlety, if everything on the page is shouting nothing stands out.

With the plethora of choices the designer really has the power to lift their design and make it engaging to the visitor, a word of warning though...