As a technical writer I’m biased – I believe that no matter what graphics you use, it’s the words that sell. But the best words in the world are no use if they aren’t easy to read! A great layout gives visual cues that make it easy the reader to keep reading, and to remember the key points.
For a designer, setting type effectively is a common and important task. In the “old days”, fonts choices were often limited by letters you had left on the rub-off Letraset sheets (which were horrendously expensive!)
Print designers have almost unlimited choices. Web designers have a more limited options but with Google fonts, CSS and HTML 5, web designers have more choices than ever.
Designing with words
Good Typesetting takes instinct and practice, but this quick checklist covers the basics. These are my general guiding principles:
1. No more than three typefaces per page
Applying and setting text with a variety of typefaces (even if they are similar) creates a sense of disunity; body paragraphs appear unrelated, even if the reader is unable to pinpoint what causes it, the effect can remain.
When selecting stylesheet fonts for a client, make sure the font you choose offers a variety of options like Bold, Condensed, Italic and Expanded. You will be glad of this flexibility when it comes to designing different types of documents for different audiences.
2. Set headlines large at the top of the page
On many projects, headings are often only a slightly larger body font size, or even just in bold. Headings are some of the very first strings of text read by the eye when navigating to a new page, and vital to mark sections in passages. As such, grace headings with the size and styling they deserve to invite the reader and provide ample, but unobtrusive sign-postings for lower tier headings to guide the reader.
3. Body copy must be at least 12px
This is a related and perhaps the most important rule of thumb: give body copy the size it needs to be comfortably read on a screen. Of course a large range of other factors influence and legibility and readability of text and particularly more closely set body copy, but size remains critical.
Remember that many of us do not have 20–20 vision; a good default is 12 pixels. If you are writing for an older audience, consider 14pt. However beyond 14pt, body text can be difficult to read because the lines are difficult to scan.
4. Text to background contrast
Increasing the font size will improve legibility of text but even larger font sizes struggle against poor contrast between the text and the background on which it rests. The well-established standard is to place dark text on a light background. Absolutely avoid clashing colors or a barely visible grey on a white background.
Special care needs to be applied to light text on a dark background because it doesn’t have the same contrast: increase the tracking, measures, and leading accordingly.
5. Apply emphasis discreetly
This is partly an editorial principle, partly a typographic one: don’t litter text with superfluous underlines, bold, and italics; apply emphasis and stresses sparingly exactly for added and intentional emphasis.
On a side note, avoid overly long underlines, particularly on serifed typefaces and even more so at smaller sizes as it will cut through descenders (chiefly g, j, p, q, and y) and make them more difficult to discern. A handy solution is to set use a border-bottom of 1px to give a gap between the underline and the word.
6. Do not set continuous text in full capitals
Ascenders and descenders exist for good reason: they allow us to easily identify words. A word that is set in upper– and lowercase is more recognizable than same word set entirely in uppercase due to the uniformity of the height and baseline of the word. For example, contrast:
‘THE RESULTS OF LEGIBILITY ANALYSES CAN BE CONTRADICTORY, BUT ONE THING IS CLEAR: TEXT SET IN CAPITALS IS HARDER TO READ’
— Hochuli, J. 2008, Detail in Typography, 3rd edition
If you find yourself needing to set longer strings of text wholly in uppercase alongside regular body copy, consider setting them with a more ample leading in small capitals (font-variant: small-caps;).
7. Give the words space to breathe
Adobe InDesign default line spacing is often too much. Single line spacing is almost always too little. Leading straight on (no pun intended) from the close of the last rule, ensure your text has enough room to breathe; give it the space it needs, both vertically and horizontally to ensure a good, crisp contrast for legibility and readability.
Check that lines are not too short requiring jerky, quick dashes of the eye to trace to each following line, but also not too long to get lost when reaching the end of a line and then proceeding to the next. Going hand-in-hand with the line length is leading: provide enough space between lines, but not too much to rip the text apart.
8. Don’t use Arial, Times Roman or Comic Sans
More of a personal note and frustration. But seriously, why would you use these overused and unattractive typefaces when there are so many others to choose from.
