Limit line lengths to increase readability

Categories

It’s a really good idea to limit your line-lengths to increase readability. Use the ch unit, which is equal to the width of a 0 character in the rendered font.

It’s recommended to keep flow content, like articles to between 60-75ch. This all very much depends on your typeface and size, though, so it’s something to visually tweak.

This site uses 65ch, which is nearer the lower-end of the scale. It all comes down to a combination of rules—like in this quick tip—and visual tweaks.

Here’s how you do it with CSS and for this demo, we’ll target the <article> element, globally:

Code language
CSS
article {
  max-width: 60ch;
}

This is the sort of tiny tweak that can really make a huge, positive impact on your user’s experience.

Hello, I’m Andy and I’ll help you build fast & visually stunning websites.

I am currently setting up a new creative agency called Set Creative Studio and we are taking on projects for 2022, so if you have a project in mind, get in touch.