Every designer needs to understand typography. We explain the fundamental concepts and terminology in words that you can understand.
In this article we introduce the fundamental concepts of typography, followed by a detailed glossary of its main terms.
Typography is, quite simply, the art and technique of arranging type. It's central to the work and skills of a designer and is about much more than making the words legible.
Your choice of typeface and how you make it work with your layout, grid, colour scheme, design theme and so on will make the difference between a good, bad and great design.
Good typography is partly down to creative intuition, but it's impossible to become skilled in typography without understanding the basic rules of the craft – even if you mean to break them.
Once you're comfortable with the basics, why not try out some typography tutorials, visit some typography resources to investigate font families – and even follow some typography Twitter accounts to keep up-to-date with the latest trends.
Choosing a font
There are an astonishing array of professional fonts to choose from. But with great power comes great responsibility. Just because you can choose from a vast library doesn't mean you have to; there's something to be said for painting with a limited palette, and tried and tested fonts like Helvetica continue to serve us well.
Despite sites such as ours providing links to the best free fonts available, but that doesn't mean it's not worth investing in paid ones. A typeface, like any form of design, is created by craftsmen over a substantial period of time, using the talent and experience they've been honing for many years. And the benefits of a professionally designed font – various weights and styles to form a complete family, carefully considered kerning pairs, multi-language support with international characters, expressive alternate glyphs to add character and variety to type-setting – are not always found in a font available for free.
Here are some of the most important typographic considerations the professional designers needs to take into account.
All typefaces are not created equally. Some are fat and wide; some are thin and narrow. So words set in different typefaces can take up a very different amount of space on the page.
The height of each character is known as its 'x-height' (quite simply because it's based on the letter 'x'). When pairing typefaces - such as when using a different face to denote an area of attention - it's generally wise to use those that share a similar x-height. The width of each character is known as the 'set width' - which spans the body of the letter plus a space that acts as a buffer with other letter.
The most common method used to measure type is the point system, which dates back to the eighteenth century. One point is 1/72 inch. 12 points make one pica, a unit used to measure column widths. Type sizes can also be measured in inches, millimeters, or pixels.
Leading describes the vertical space between each line of type. It's called this because strips of lead were originally used to separate lines of type in the days of metal typesetting.
For legible body text that's comfortable to read, a general rule is that your leading value should be greater than the font size; anywhere from 1.25 to 1.5 times.
03. Tracking and kerning
Kerning describes the act of adjusting the space between characters to create a harmonious pairing. For example, where an uppercase 'A' meets an uppercase 'V', their diagonal strokes are usually kerned so that the top left of the 'V' sits above the bottom right of the 'A'.
Kerning similar to, but not the same as, 'tracking'; this relates to the spacing of all characters and is applied evenly.
The term 'measure' describes the width of a text block. If you're seeking to achieve the optimum reading experience, it's clearly an important consideration.
05. Hierarchy and scale
If all type was the same size, then it would be difficult to know which was the most important information on the page. In order to guide the reader, then, headings are usually large, sub-headings are smaller, and body type is smaller still.
Size is not the only way to define hierarchy – it can also be achieved with colour, spacing and weight.
Next page: Glossary of typography A-L