Limit line lengths to increase readability
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 50ch
because the font, Georgia, is really readable—especially when it is very large, like it is here.
It 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.