Using multi-columns for text (CSS columns)

“Anything from 45 to 75 characters is widely regarded as a satisfactory length of line for a single-column page set in a serifed text face in a text size. The 66-character line (counting both letters and spaces) is widely regarded as ideal. For multiple column work, a better average is 40 to 50 characters.”

from The Elements of Typographic Style Applied to the Web

In MBSJ2012, we used the CSS columns feature to display presentation abstracts in multiple columns. When the browser window width was 768px as on an iPad, the average number of 16px Arial font characters per line fit the multiple column recommendation perfectly.

On smartphones, we used single columns. The size again matched the recommendation on the low-end for the iPhone, and on the middle end for larger Android smartphones.

Even on 7-inch tablets like the Nexus 7, the number of characters barely missed the high end of the recommendation and was pretty close to being satisfactory.

Leave a Reply

Your email address will not be published. Required fields are marked *