M. Douglas Wray

A free presentation of Butterick’s Practical Typography

M. Douglas Wray

Matthew Butterick

Bio

Butterick’s Practical Typography

A few hundred years of type and typography have established rules that only a fool would ignore. For all those who need to communicate clearly and even add a modicum of aesthetic value to their messages, this publication provides everything you always wanted to ask but didn’t know how to. — Erik Spiekermann from the foreword

Butterick's Practical Typography

Typography

The visual component of the written word.

The Measure of Typography

“Good typography is measured by how well it reinforces the meaning of the text, not by some abstract scale of merit.” — Matthew Butterick

First Axiom of Communication

“One cannot not communicate” — Paul Watzlawick

Consquence of Poor Typography

If you fail to consider the effect of your message on the recipient,
you may inadvertently communicate
that you do not care
how your message may be received.

Ten Minutes

This is a bold claim, But I stand behind it: if you learn and follow these five typography rules, you will be a better typographer than 95% of professional writers and 70% of professional designers. (The rest of this book will raise you to the 99th percentile in both categories.)

All it takes is ten minutes—five minutes to read these rules once,
then five minutes to read them again. — Matthew Butterick

How to pay for this book.

Typography in ten minutes - 1 of 5

Make the body text look good first

The typographic quality of your document is determined largely by how the body text looks. Why? Because there’s more body text than anything else. So start every project by making the body text look good,
then worry about the rest.

In turn, the appearance of the body text is determined primarily
by these four typographic choices:

Typography in ten minutes - 2 of 5

Point Size

Point Size is the size of the letters. In print, the most comfortable range for body text is 10–12 point. On the web, the range is 15–25 pixels.
Not every font appears equally large at a given point size,
so be prepared to adjust as necessary.

Typography in ten minutes - 3 of 5

Line Spacing

Line Spacing is the vertical distance between lines. It should be 120–145% of the point size. In word processors, use the “Exact” line-spacing option to achieve this. The default single-line option is too tight; the 1½-line option is too loose. In CSS, use line-height.

Typography in ten minutes - 4 of 5

Line Length is the horizontal width of the text block. Line length should be an average of 45–90 characters per line (use your word-count function) or 2–3 lowercase alphabets, like so:

abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyzabcd

In a printed document, this usually means Page Margins larger than the traditional one inch. On a web page, it usually means not allowing the text to flow to the edges of the browser window.

Typography in ten minutes - 5 of 5

Font Choice

The fastest, easiest, and most visible improvement you can make to your typography is to ignore the 'System' fonts that came free with your computer and buy a professional font like Equity and Concourse,
see: Font Recommendations. A professional font gives you the benefit of a professional designer’s skills without having to hire one.

If that’s impossible, you can still make good typography with system fonts. But choose wisely. And never choose Times New Roman or Arial.

Summary of Key Rules - 1/26

The four most important typographic choices you make in any document are Point Size, Line Spacing, Line Length, and font (passim), because those choices determine how the Body Text looks.

Summary of Key Rules - 2/26

Point Size should be 10–12 points in printed documents, 15-25 pixels on the web.

Summary of Key Rules - 3/26

Line Spacing should be 120–145% of the point size.

Summary of Key Rules - 4/26

The average Line Length should be 45–90 characters (including spaces).

Summary of Key Rules - 5/26

The easiest and most visible improvement you can make to your typography is to use a professional font, like those found in Font Recommendations.

Summary of Key Rules - 6/26

Avoid Goofy Fonts, Monospaced Fonts, and System Fonts, especially Times New Roman and Arial.

Summary of Key Rules - 7/26

Use curly quotation marks, not straight ones
(see Straight and Curly Quotes).

Summary of Key Rules - 8/26

Put only One Space Between Sentences.

Summary of Key Rules - 9/26

Don’t use multiple Word Spaces or
other White-Space Characters in a row.

Summary of Key Rules - 10/26

Never use Underlining, unless it’s a hyperlink.

Summary of Key Rules - 11/26

Use Centered Text sparingly.

It's boring.

Summary of Key Rules - 12/26

Use Bold or Italic as little as possible.

One or the other, as little as possible.

Summary of Key Rules - 13/26

All Caps are fine for less than one line of text.

Summary of Key Rules - 14/26

If you don’t have real Small Caps, don’t use them at all.

Summary of Key Rules - 15/26

Use 5–12% extra Letterspacing with all caps and small caps.

Summary of Key Rules - 16/26

Kerning should always be turned on.

Summary of Key Rules - 17/26

Use First-Line Indents that are one to four times the point size of the text, or use 4–10 points of space between paragraphs. But don’t use both.

Summary of Key Rules - 18/26

If you use Justified Text, also turn on Hyphenation.

Summary of Key Rules - 19/26

Don’t confuse Hyphens and Dashes,
and don’t use multiple hyphens as a dash.

Summary of Key Rules - 20/26

Use Ampersands sparingly, unless included in a proper name.

Summary of Key Rules - 21/26

In a document longer than three pages, one exclamation point is plenty (see Question Marks and exclamation points.)

Summary of Key Rules - 22/26

Use proper Trademark and Copyright Symbols
—not alphabetic approximations.

Summary of Key Rules - 23/26

Put a Nonbreaking Space after Paragraph and Section Marks.

Summary of Key Rules - 24/26

Make Ellipses using the proper character, not periods and spaces.

Summary of Key Rules - 25/26

Make sure Apostrophes point downward. It’s important.

Summary of Key Rules - 26/26

Make sure Foot and Inch Marks are straight ('), not curly (’).

From the Appendix

Font Resources

Typography Resources

Questions?

M. Douglas Wray
macwebguru.com
macguiguru@spamcop.net