Notes on the reading experience
Every website has a reading experience, whether the designer intended one or not. Most are accidental. Here's what I've learned from paying attention to mine.
I read a lot on screens. Probably too much. And over the years I've developed a set of quiet preferences — not opinions I'd evangelize, but patterns I notice when they're absent. A line length that's too wide. A font that's too small. A paragraph spacing that collapses the hierarchy. These aren't bugs. They're the texture of someone not having thought about reading.
The measure
The single most impactful decision in a reading layout is the measure — the width of a line of text. The classic rule is 45 to 75 characters per line, and it exists because the human eye needs a reliable return sweep. Too wide and you lose your place. Too narrow and the text feels choppy, fragmented.
I aim for about 65 characters. On a 1.0625rem body at 1.8 line-height, that lands around 680 pixels — narrow enough to feel intentional, wide enough to feel generous. I check it by pasting a typical paragraph into the layout and counting. It sounds tedious. It takes ten seconds. It changes everything.
The leading
Line height — leading, in print terms — is where most reading layouts go wrong. The web default of 1.5 is a floor, not a target. For body text at reading size, I use 1.75 to 1.85. The extra space gives each line room to exist as its own unit, which makes the return sweep easier and reduces the cognitive load of tracking.
Good leading is invisible. Bad leading is the only thing you notice.
The relationship between font size and leading matters more than either value alone. A smaller font needs more leading relative to its size. A larger font needs less. This is why the same 1.6 line-height can feel airy at 14px and cramped at 20px — the ratio hasn't changed, but the optical effect has.
The font
I won't belabor typeface selection — smarter people have written better guides. But I'll say this: the body font is the most important typographic decision on a reading site, and it's the one most often treated as an afterthought. Pick a typeface designed for extended reading. Test it at your actual body size, on your actual background, with your actual copy. A typeface that looks beautiful at 48px in a specimen can be exhausting at 17px in a paragraph.
And please: set text-rendering: optimizeLegibility. It enables kerning and ligatures. It's the difference between type that sits and type that settles.