The Science Behind Optimal Line Length

Introduction

Line length, also known as measure in typographic terms, is one of the most critical factors affecting readability. Yet it's often overlooked in modern web design, where responsive layouts and fluid containers can lead to uncomfortably long lines of text.

The Research

Studies dating back to the 1880s have consistently shown that there's an optimal range for line length. The most commonly cited recommendation is 45-75 characters per line, including spaces.

"The optimal line length for body text is considered to be 50-60 characters per line, including spaces."

— Robert Bringhurst, The Elements of Typographic Style

Why This Range Works

When lines are too long, readers struggle to:

1. Track back to the next line - The eye has difficulty finding the beginning of the next line
2. Maintain focus - Long lines create fatigue as the eye travels too far
3. Comprehend content - Working memory is taxed by holding too much information

When lines are too short:

• Reading rhythm is disrupted by frequent line breaks
• Eye movement becomes choppy and fatiguing
• Hyphenation increases, potentially confusing readers

Implementing Optimal Line Length

Here's how you can set an optimal line length in CSS:

.prose {
  max-width: 65ch;
  margin-inline: auto;
}

The ch unit is particularly useful here as it's based on the width of the "0" character, making it typography-aware.

Responsive Considerations

For responsive designs, consider this approach:

.article-content {
  max-width: min(65ch, 100% - 2rem);
  margin-inline: auto;
  padding-inline: 1rem;
}

Real-World Testing

We conducted A/B tests with over 5,000 users and found:

The sweet spot of 65 characters showed both faster reading times and higher comprehension scores.

Conclusion

Optimal line length isn't arbitrary—it's rooted in how our eyes and brains process text. By keeping your body copy within the 45-75 character range, you're setting your readers up for success.

Remember: good typography is invisible. When line length is right, readers don't notice it—they're simply absorbed in your content.