HTML & CSS: The Good Parts

Type Styles, Readability, and Legibility

In publication design there are two complementary concepts that drive many typesetting choices: readability and legibility. Readability is the quality of copy that makes it easy to read in volume, for extended periods of time; legibility refers to the ease with which data, words, and short phrases can picked out while a passage is being scanned.

Styling for Readability

Our expectations of book design illuminate the definition of readability:

• Serif typefaces

• 12–15 words per line

• Fully justified lines

• Moderate and consistent letterspacing

Upmarket press runs also often employ increased leading (20% or more of the body copy size) and more detailed fonts, to ease the task of making out margins, lines, and letters. This is due to the fact that profit margins on downmarket editions range from poor to outright lousy, which creates a strong incentive to minimize manufacturing and distribution costs—in other words, to reduce net paper costs.

In their turn, paper costs are reduced by using lower grades of paper in smaller quantities. That being the case, there are more lines on each page, smaller page margins, and—on account of paper quality—less-detailed fonts, which suffer less from the ink bleeds that occur when lower grades of paper are used.

Paper costs aren’t a concern on the Web, so we can use the full arsenal of available tools to enhance readability. For screen display, the result might be something like the following:

#bodycopy p { width: 50em; font-family: ...