The ideal measure on the web
This article was written in 2014. It might or it might not be outdated. And it could be that the layout breaks. If that’s the case please let me know.
A while ago I created a tool to help you define the ideal length of line for text on the web. You can adjust a few variables, like
font-family and language. When you slide the slider it shows you how many words there are on a line, or how many characters. You can now choose an ideal measure depending on the theory you like most (10 words or something between 45 and 75 characters). It turns out there’s a much easier way to define an ideal measure, according to Bringhurst.
In his book The Elements Of Typographic Style he writes that
the measure, or length of line, is usually around 30 times the size of the type, but lines as little as 20 or as much as 40 times the type size fall within the expectable range. I’m so happy I work on the web. The size of the type on any element is always
1em. So this rule by Bringhurst translates to a measure of
30em (or anything between
40em, even though I do believe
40em is too much for many fonts).
If you’re forced to use weird units like the
pt or the
px you’ll have to calculate the measure. If your
14px, for instance, you’d have to calculate 14×30. Which is not too hard, but it’s definitely harder than
30em no matter the size of the font. If we decided our font-size should be
17px instead of
14px we would have to recalculate. But since we use the
em we don’t have to.
I love the web