Give paragraphs breathing room with line spacing
Single-spaced paragraphs make the next line hard to find, because the eye has to come back across the column and land on one of several lines that all look the same distance away. W3C recommends spacing between 1.5 and 2, and names people with cognitive disabilities as the readers it serves. It attaches the sufficient status for C21 to 1.4.8 Visual Presentation, which is Level AAA, and lists it as advisory for text spacing at Level AA. Write the value unitless so it multiplies the element's own font size and inherits sensibly, rather than in pixels, which locks the gap while the text grows around it. Setting it on body and letting it inherit is W3C's own example and is usually all you need.
How we find it in an audit
Line-height values are an automated inventory, and the two patterns worth flagging are a pixel value and anything below 1.5. Then we look at the rendered page, because a value set globally can be overridden three components deep, and dense marketing copy is where the tight setting usually survives.
How affected users experience it
Tight line spacing costs readers with dyslexia, low vision and cognitive fatigue, and the failure is specific. You finish a line, come back across the column, and land on the line you just read. Do that twice in a paragraph and the paragraph stops making sense, so the reader starts again. Extra space between lines is the whole fix.
Passes vs. fails
Passes
body { line-height: 1.5; }Fails
p { line-height: 14px; }How this gets tested
The W3C publishes test rules that define what a checker looks for here.
- Important letter spacing in style attributes is wide enoughA tool can check this
- Important line height in style attributes is wide enoughA tool can check this
- Important word spacing in style attributes is wide enoughA tool can check this
Other ways to satisfy this rule
21 guides on this site are filed under 1.4.8 Visual Presentation. W3C lists this one as sufficient for that rule on its own. Implement it correctly, in a way your readers' software actually supports, and the rule is met.
- C12sufficientSize text in percent so it scales
- C13sufficientUse named font sizes that respect user defaults
- C14sufficientSize text in em units, not pixels
- C19sufficientAlign text left or right, never justified
- C20sufficientCap line length with relative column widths
- C23sufficientLet main content follow user color settings
This guide is our interpretation of W3C technique C21: Specifying line spacing in CSS. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.