For a long time I've noticed that adjusting line-height
and adding some extra space between paragraphs both relative to the chosen font-size
can make a huge impact on the readability of Web site content, but so far I have always selected ad-hoc values for these attributes.
Are there any recommendations in typography, publishing, or psychology literature for how to adjust values for these properties relative to each other?
Line spacing should be at least a space-and-a-half within paragraphs. So around 150 percent or 1.5 times the font size. Spacing following paragraphs should be at least two times the font size. Spacing between letters should be at least 0.12 times the font size.
Ruder concluded that the optimal line length for body text is 50–60 characters per line, including spaces (“Typographie”, E. Ruder). Other sources suggest that up to 75 characters is acceptable.
The leading, or space between each line of text, can also affect readability. In general, leading that is 2-3 points larger than the typeface enhances readability. Leading that is too much larger or smaller than that, however, can make the type more difficult to read.
Line height is the vertical distance between two lines of type, measured from the baseline of one line of type to the baseline of the next. Traditionally, in metal type, this was the combined measurement of the font size and the strips of lead that were inserted between each row (called “leading”) of type.
I can't post a detailed answer, I'm afraid, but I'd suggest that you read Tim Brown's article 'More Meaningful Typography', at A List Apart, for guidance.
In essence, it seems that the width ('measure') of a block of text should be around 50-60 characters, the line-height
set at 1.5
(without a unit, which will be 1.5 times the font-size
, regardless of the units used to set the font-size
).
Characters themselves seem to be set around the 16px mark, but Tim suggests using a scale, such as that represented by the Golden Ratio to define the relative font-sizing of headings, body text, captions and so forth.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With