This thought was originally posted on my blog, The Apprentice Historian. Since it is all about design and no one commented on it, I thought I would "repurpose" the content to make sure the word got out — line length matters. Additional content was added for this project.

Since tonight’s class was to cover more about design (and will not, since a winter storm has closed the campus this evening), allow me to share a small bit of design wisdom I uncovered this week. This month’s T+D magazine, the official rag of ASTD (formerly known as the American Society of Training and Development, now mysteriously known only as ASTD) has an article about an IBM study that links the length of a line of text with the ease of retaining the knowledge contained therein.

“Narrow paragraphs are easier to read, subjects read them faster, and there were two unexpected findings.”

This article, “The Long and Short of Learning” 1 DESIGNING LEARNING, “The Long and Short of Learning” by Peter Orton, David Beymer, and Daniel Russell. T+D, Vol 61, No. 2, February 2007, p. 66-69. discusses a recent study in which IBM Learning partnered with scientists at Almaden Research Center to study the physiological effects of line lengths, paragraph depth, font size and line spacing on computer screens. This study builds on research conducted in 1989 that showed shorter line lengths are easier to read.2Keith Rayner and Alexander Pollatsek, The Psychology of Reading (Lawrence Erlbaum Associates), 1994.

The study put wide paragraphs head-to-head with narrow paragraphs to see which was easier to read. Wide paragraphs in this case are 80% of screen width, or nine inches on a computer screen. Narrow paragraphs were 40% of screen width (4.5 inches) and not coincidentally the standard line length used by book and print magazine publishers.

Study Results

Without giving away the whole article, here’s the conclusion: narrow paragraphs are easier to read, subjects read them faster, and there were two unexpected findings. 1) Subjects did not read all the way to the bottom of the short paragraph passages, and 2) in spite of this, the subjects reading the shorter lines were able to answer more multiple choice questions correctly.3On average, subjects reading the wide paragraphs answered 43% of the questions correctly; those reading the narrow paragraphs answered 58% correctly.

This has clear implications for our own web development work, especially given that we should be designing our web pages with the goal of transferring knowledge to our readers. IBM Learning has apparently redesigned more than 2,000 individual web pages as a result of the study — one can only hope they were utilizing CSS pages!

However, the 40% rule does seem to offer some challenges in the online environment. As an example, this paragrah is set at width = 40%. As you can see, the amount of space left over is considerable. So it isn't as simple as just setting your width to 40%. 

Even if you start using math to figure out the width (40% of the 550px width of the content div is 220px, as in this paragraph), in my experience, using math is a losing proposition. Even if all of the numbers work out correctly, the space to the right of this border still needs to be filled with something!

Happily, CSS standards do allow for the width to be set in inches. The content div for this page is set at width = 4.5in. The result is a column more narrow than the original base content text but wider than a 40% setting. As you can see, the left over space to the left is a little more managable.

_______________

1 DESIGNING LEARNING, “The Long and Short of Learning” by Peter Orton, David Beymer, and Daniel Russell. T+D, Vol 61, No. 2, February 2007, p. 66-69.

2 The 1989 research was by Keith Rayner and Alexander Pollatsek and resulted in a thoroughly overlooked book called the The Psychology of Reading.

3 On average, subjects reading the wide paragraphs answered 43% of the questions correctly; those reading the narrow paragraphs answered 58% correctly.