Jan 05

Why line length matters (Typography 101)

During my daily reading I ran across this piece over on the Rails blog discussing how a large political blog is considering three web languages/frameworks for redoing their site.

The comments within are fairly interesting for what they are, but this thread in particular caught my attention.

The age-old debate

Every UI job I’ve taken always runs into this discussion. Regardless of the setting there’s always some programmer or marketing type who thinks that proficiency in their field leads them to be an expert in yours as well.

If you’re not familiar with it, it goes something like this…

“Why can’t we make the text just run the entire length of the page? I don’t like scrolling, and all that white space is just wasting room on my nice big monitor.”

Sometimes, just to rub salt in the wound they like to add this one as well…

“I think that would make the site much more usable.”

…Please just put me out of my misery now.

Why long lines of text suck

Line length, leading (rhymes with heading), and word spacing all contribute to the readability of text on the printed page or screen.

One of my favorite books sums it up the best…

The lines should be long enough to get complete thoughts into them and there ought to be enough space between them to allow readers to finish reading a line before their eye gets distracted by the next.

If you make lines the entire length of the browser window it’s extremely difficult to move your eye to the beginning of the next line after you finish with the previous one.

But print and screen design are different!

Of course they are. In the web world we have to deal with liquid layouts, multiple font sizes and screen resolutions.

I’m a fan of constraining text width to fixed pixel columns, or small percentages.

A lot has been written on the subject, but I find these resources helpful:

Now if only I never had to explain this concept again…

Written by Seth Banks

Seth spends most of his days leading the design team at Green Bits and improving Cashboard. Occasionally he finds time to write about music, design, startups, and technology.

Tagged: design, typography