Reading On a Screen Is Harder, So Let’s Work to Make It Easier

A pair of academic studies has concluded that we comprehend and retain information better when we read printed works than when we read online.

That’s a problem, because I have a website and you have a website and there are a lot of websites.

I have a few ideas about the solution, so buckle up and power through this text, even though it’s on your screen rather than a sheet of paper.

Studies Show That Print Beats Online for Comprehension and Retention

Researchers at San Diego State University found that readers of the New York Times print edition remembered significantly more stories, facts, and ideas than online news readers did.¹  They conclude that this is true because print editors use placement, prominence, and type size to signal what’s most important. Conversely, when you read online you’re frequently interrupted by intrusive ads and the need to click through to second and third pages.

A second study compared student’s scores on multiple choice tests after reading material on a tablet or in print.²  This study came to a similar conclusion: Recall was higher for the print readers.

What Does This Mean for Website Owners?

Now, most of us aren’t publishing newspapers or proctoring tests for students, but the core lesson is valuable for anyone who publishes content online. We need to do everything within our power to improve readability—which directly influences comprehension and recall—and that starts with following the best practices of newspaper designers.

Content Design Best Practices

Here are some of the time-tested tactics from print design (and a few from online readability studies) that you can immediately apply to your website:

• Use Type to Communicate Importance — We read larger and bolder headings as more important. On a website, this is referred to as “semantic” coding: “semantic” is a term that means “carrying meaning,” so semantic coding implies using page and type design (through code) in a meaningful way, rather than a decorative way.
• Use the Visual Space to Communicate Importance — In English-speaking countries, we read from top to bottom and left to right. That means our focus is on the top left. Put your most important stuff there. To make your text most readable, put it in a wide column on the left side of your page.
• Use Visuals to Add Information, Not to Decorate — This is another tenet of good design, and it sounds very much like semantic coding. Everything you do with design should mean something, should add information. Videos and infographics are good examples of visuals that typically add information to your text; stock photos of smiling people are examples of visuals that only decorate and thus distract from your text.
• Choose the Right Typeface — In print, serif type is easier to read, because the little curls at the top and feet at the bottom of letters make it easier for the eye to recognize the shapes. On a screen, however, sans-serif type is easier to read. I’m not sure why this is—it probably has something to do with screen resolution—but eye-tracking studies bear this out. So use sans-serif (or modern type, which is a hybrid of serif and sans serif) for your body text. Larger type in headings or pull quotes can still be serif for contrast and emphasis.
• Break It Up — I don’t mean that you should interrupt your text with decorative images or ads or other distracting elements. However, it is easier to read long text if it is strategically broken up by using subheads (which add meaning) or bulleted or numbered lists (which organize information).

 

Because we know that it’s harder to retain information that is read online, we all need to work harder to make it easier. For more tips, see my earlier blog post on writing for the web.

References

¹https://www.researchgate.net/publication/290447035_Print_Readers_Recall_More_than_Do_Online_Readers
²https://er.educause.edu/articles/2015/9/paper-or-tablet-reading-recall-and-comprehension