I have a fluid layout, but if the browser window is stretched too much, the text can get so wide that it's strange to read such long sentences on 1 line. What's a good maximum width for text? I suppose it depends on font size. Is there some kind of formula or heuristic?
The font in my particular case at the moment is serif 16px, but I'm curious to know what best practices are for different fonts and sizes.
Smashing Magazine did a design study of popular blogs that contains just this kind of information. The information you're looking for is located in section 2.2 quoted below.
2.2. How many characters per line?
To ensure best readability one needs to ensure comfortable reading. While some research results claim that an optimal line length is 52 – 68 characters per line (including punctuation marks and empty spaces), other studies show that even if the lines are getting longer it does not significantly affect usability. Since no rules of thumbs are provided, designers experiment with a variety of different line lengths.
To compute the max. number of characters per line we have used default setting of the browser as well as default typographic settings provided by the style sheets.
- 10% used 65-74 characters per line (PostSecret, Beppegrillo, Perez Hilton, Scobleizer, Blogoscoped)
- 18% used 75-84 characters per line (Dooce, Blogs.nytimes.com, Joystiq, CopyBlogger, TUAW, Slashfilm)
- 34% used 85-94 characters per line (Lifehacker, Huffington Post, Kottke, Ars Technica, Huffington Post, BoingBoing, Seth Godin, Treehugger, Problogger)
- 18% used 95-104 characters per line (Mashable, ReadWriteWeb, Smashing Magazine, Google Blog, A List Apart, Search Engine Land)
- 16% used over 105 characters per line (Engadget, TechCrunch, GigaOM, Wired, TMZ)
Based upon our findings we feel confident to suggest that the most usual (not necessarily most user-friendly) line length lies between 80 and 100 characters.
It is interesting to remark that not a single blog used justified text-alignment — 100% of the blogs used left text-alignment.
So the width is not really important, it's the number of characters that influence the readability.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With