Readable web content combines sufficient color contrast with typography that supports comfortable scanning. WCAG replaces subjective visual judgment with a contrast ratio, while CSS typography uses mathematical relationships among font size, line height, and line length. section 7.4 section 8.0
Use these practical checks when shaping page text:
- Set body text to at least 1.25rem, or 20px when the root default remains 16px. section 8.1.1
- Prefer a line-height around 1.4 or 1.5 instead of browser defaults near 1.15–1.2, which pack lines tightly. section 8.1.1
- Balance line length: short lines create choppy reading, while long lines increase scanning effort and eye fatigue. section 8.1.1
- Evaluate foreground and background colors with a contrast-ratio calculation rather than personal visual judgment. section 7.4
.element {
max-width: 65ch;
}
Constrain text measure with a CSS max-width expressed in ch units, making line length an explicit readability control. section 8.1.1
