Line Height and Reading Speed Correlation

The Biomechanics of Eye Movement and Saccadic Sweeps

Human reading does not proceed in a continuous linear glide. Instead, human eyes perform rapid jumps called saccades, pausing briefly at fixation points to decode clusters of characters. When the vertical gap between lines of type is compressed below 130%, the descending elements of upper lines collide perceptually with the ascending stems of lower lines, resulting in visual crowding and micro-stalls during saccadic progression.

Conversely, excessive leading creates disconnected horizontal bands that disrupt vertical momentum. When the eye reaches the end of a line and attempts a return sweep back to the left margin, a gap wider than 170% can cause the reader to land on the wrong baseline or re-read the same line twice, severely degrading overall reading speed and cognitive retention.

Key Variables Governing Optimal Vertical Spacing

Determining the correct leading value cannot rely on a universal static number. Practitioners must calculate proportional line height by assessing three interconnected layout factors:

• Line Length (Measure): Longer horizontal lines (70–85 characters) require looser leading (150%–165%) to guide the return sweep accurately across wide spans.
• Typeface X-Height & Proportions: Fonts with tall x-heights leave less inherent white space between lines, requiring an upward adjustment of baseline intervals.
• Screen Resolution & Device Distance: Mobile viewport reading held at arm's length demands tighter leading (135%–145%) compared to desktop displays viewed from greater distances.

Empirical Findings and Practical Implementation

Laboratory eye-tracking assessments indicate that adjusting body text line height from a cramped 1.15 to a calibrated 1.48 yields an average 18% increase in sustained words-per-minute throughput among participants reading long-form analytical articles. Furthermore, subjective reader fatigue scores decreased by over 30% during extended screen sessions.

Applying responsive unitless line heights in CSS (such as line-height: 1.55 on desktop and line-height: 1.42 on mobile) guarantees fluid scaling across variable viewport dimensions. When paired with disciplined max-width constraints on paragraph containers, typography transforms from an arbitrary decoration into an invisible, frictionless vehicle for information transfer.