I’m not sure why I’m even writing this article. Seriously.
Study after study confirms that people simply don’t read on the web, at least not word for word. Most people, including you, will scan a webpage or post looking for catchy headings, meaningful keywords, short, bulleted lists or any other quick bit of information. You may be looking for some specific information, or just seeing if something jumps out at you as particularly relevant to an issue that interests you. Most of the words in between the bite size chunks of information — those words that writers like me carefully craft into the “connective tissue” of a post — are ignored.
It’s no big surprise that reading a computer screen (or tablet) is harder than reading paper. Computers emit light, which is tiring on the eyes. Unless you do all your web browsing on an e-reader, you’re probably getting imperceptibly more fatigued with every word you read.
If you have a website you want people to actually read, how do you optimize your text so visitors are less likely to pass over it? It turns out some very smart researchers have been asking the same question for years; here is some of what they’ve learned.
Font Size and Type
In 2008, researchers from IBM and Google conducted an eyetracking study to determine how designers could adjust the typography of a website for optimal reading. Specifically, they wanted to determine the best font size and font type (serif vs sans serif) for reading online, as measured by both reading speed and retention of information. I was surprised to read that on the serif vs. sans serif issue there was no significant difference in reading speed or comprehension. There was actually a small (although not statistically significant) speed increase with the serif font. So why do so many of us (including ClickZ) use sans serif?
The explanation, I think, is rooted in habit. When the web was young, screen resolutions were quite low, rendering serifs quite badly. The rule of thumb became “stick to sans serif.” However, today’s retina displays and HD graphics are shifting our perceptions of fonts.
In fact, look at a website in Verdana today and you’ll immediately get the impression that it is outdated. That’s because Verdana’s boxy, wide letters made it a great choice for the old 640×480 monitors. Fortunately, today’s screens can easily display more elegant fonts with plenty of clarity and contrast, and serif fonts are no longer the taboo that they once were. Still, stay clear of any font that is overly ornate or is more creative than it is legible.
On the issue of size, the results were a bit more definitive. Smaller type takes longer to read and in some cases can require visitors to lean in to the screen. Larger type is more readable and I’ve seen some UX designers suggest nothing less than 16 pixels for body copy. Why so huge? Because people are sitting about 20 inches from the screen. Imagine holding a book or magazine that far from your face and trying to read it! If you’ve ever driven past a billboard on the freeway and wondered what it said, you’ll immediately understand the inverse relationship between distance and font size.
Whatever size you land on for your body copy, be sure to have a clear hierarchy of larger sizes for subheadings and headings. This approach acknowledges the visitors’ inclination to scan, making it quick and easy to identify information of interest.
TMI vs. Progressive Disclosure
It seems TMI, or “too much information,” is more than just a social faux-pas. The human brain can only consciously process a minute amount of the information it takes in at any given time. According to psychologist Susan Weinschenk, the brain handles 40 billion pieces of information in a second, but only 40 of those pieces make it to conscious awareness. If your website is providing too much information at once, there’s a good chance that even if your visitors had a very high level of interest in your content, they simply wouldn’t be able to take it all in.
The cure for TMI on a website is progressive disclosure. Only give people as much information as they need at that moment to help move them to the next step. If you do this well, your site’s content will be succinct enough to minimize cognitive load (the process of thinking) and maintain attention, yet visitors who want more information will be able to find it with just a click.
Are You Paying Attention?
Chances are, no. Not many of you anyway. Why would I say something so rude? Because a great deal of research indicates that people (and web visitors in particular) have the attention span of a lit match.
The Associated Press reported that in 2012, the average attention span was 8 seconds (down from 12 seconds in 2000). Just this year, Chartbeat collected data that indicated people rarely make it to the end of an article online. In fact, only 50 percent will make it to the half-way point. (Fortunately for me that doesn’t seem to keep folks from sharing though).
There’s no denying the facts: whether you measure attention by how many seconds someone spends on a page before getting distracted, or in how far they’ll scroll before jumping off, an article this length is doomed.
But Wait, There’s More…
If you’re still with me at this point in the article, you’ll be glad to know that for every rule, there’s always an exception. After all, you’re proof that some people will read to the end of an article.
Sometimes (and I’d like to presume that’s the case now), people will find some information that they find particularly interesting and they will read it word for word… even if it’s in a small font. Additionally, people who are reading an article for pleasure (rather than for business or education) are also more likely to read an article thoroughly, which would explain why so many consumer magazines have online editions.
Alas! The goal of your website is to be usable for the majority of your visitors, not the outliers. Structure your page with a clear informational hierarchy, a clean, high-contrast font and small chunks of information organized into scannable, keyword-rich lists, and you’re most likely to get your message across.