Writing for the Web | How People Read on the Web

Sep 26, 2014

Eye-tracking studies tell us a lot about how people read on the web.

August 2012 | Links updated, July 2015
A legacy dissemination resource from NICHCY

Understanding how people read on the web and search for information can directly influence how we design our webpages and websites. One of the most influential researchers into web reading behavior has been Jakob Nielsen, who sums up his findings like this:

The truth is, people are going to skim and scan all the lovely content you’ve written, looking for something (a keyword, a header perhaps?) that catches their attention or matches the reason they’re visiting your website in the first place.

Eye-Tracking Studies of Reading

We’ve learned a lot about how people read on the web by tracking people’s eye movements and fixation points while they look at web content. Interestingly, eye-tracking studies have been conducted since the 1800’s as part of learning more about how we read. From those early studies, researchers learned that:

Reading is not a smooth process of moving our gaze from left to right as we follow the words across the page.

We sweep our eyes over the text and often stop briefly (called fixations), then move forward to new text or go back over the text we’ve already scanned. (2)

The chances that a reader will fixate on an individual word depends on how long the word is (we tend to skip over short words) and whether the word is a content word (85%) or a function word (35%). (3)

Eye-Tracking Studies of Reading on the Web

Eye-tracking studies have also greatly informed what we know about how people read on the Internet. Because the Internet has become such a rich source of information, web visitors can and do make lightning-fast decisions about whether a webpage is worth reading. They sweep their eyes across the page in a pattern that’s roughly shaped like an F, starting in the upper left corner. They take two horizontal swipes across the page, then swipe vertically down the left. These three heatmaps of web users’ eye movements capture this dominant reading pattern.

The F-shaped pattern for reading web content.

See the F? (It’s especially apparent in the center picture.) These pictures come from Jakob Nielsen’s research, as posted on his website. (4)

Nielsen’s been studying the reading behaviors of web users since 1995, and his findings are as fascinating as they are useful for web designers and web content writers. His website is also a testament to those findings, because its design is driven by them.

So, in addition to identifying the F-shaped pattern that readers on the web use, what else has Nielsen found? What conclusions does he draw about how we should then design and present our content so users can quickly find what they’re looking for? Read on, and see.

Users Look Most Above the Fold

Web users spend 80% of their time looking at information above the page fold (meaning, the part of the webpage that’s visible when users first land there). Although users do scroll, they allocate only 20% of their attention below the fold. (5)

Users spend 69% of their time looking at the left half of the webpage and 30% viewing the right half. (6)

Implications for Content Writers

Put the most important content first, in the opening sentences and paragraphs. Don’t start with that nice, smooth blah-blah intro.

Get to the point. Immediately.

Users are much more likely to scroll past the fold if the first content they see captures their attention or matches their need.

Don’t center text (since readers strongly prefer the left side of the page and won’t even see text that’s centered).

Keep headers (and links) flush to the left margin, so that visitors can readily see them, especially during their downward swipe of the page (the stem of the “F” pattern).

ExampleEach content page of Nielsen’s site starts with a summary of no more than 2 or 3 sentences placed on a light yellow background, so that visitors get the essential message of that page immediately.

Credibility Matters

Credibility of the website is important to visitors. They want to know that the information offered is accurate and objective. They ignore any page that sounds or looks like an ad. Exaggerations, boasts, and market-ese hype also turn visitors off—and cause them to leave. As Nielsen says, “Web users are busy; they want to get the straight facts.” (10)

Offer an “About Us” section that says who you are, what you do, and what services or products you offer to visitors to your site. Include a tagline on your home page that summarizes, in one sentence or phrase, what you do.

Example | Here’s a sampling of taglines from around the TA&D network…

Center

Tagline

CADRE

Encouraging the use of mediation and other collaborative strategies to resolve disagreements about special education and early intervention programs

PEPNet

Advancing educational opportunities for people who are deaf or hard of hearing

Reading Rockets

Teaching kids to read and helping those who struggle

NCIPP

Your source for induction and mentoring in special education

Wouldn’t you agree that these taglines make it instantly clear what the mission of the project is? Visitors get an instant “read” on who and what we are and what we’re up to, with taglines like these.

PDF Files Can Cause Problems

Users don’t want to download and install yet another software, just so they can read the PDF

PDFs often make the BACK button inoperable—and the BACK button is like a lifeline to web users

PDFs are hard to read online, especially when the content is presented in columns (making up-and-down scrolling necessary to flow along with the text).

PDFs are best used when visitors download them for later reference or print them out and read them like traditional print materials. (11)

Implications for Content Writers | Don’t offer your content in PDF only. Don’t surprise visitors by content that suddenly opens up in PDF. Offer content via webpages in HTML, which are quicker to load, keep the BACK button functioning, and don’t interrupt the visitor midstream with requests to download a file or messages about missing software (in this case, visitors who don’t have Adobe Reader).

Examples| Reading Rockets has an excellent website that doesn’t appear to use PDFs (at least we haven’t stumbled upon any). The pages load quickly and the content is easy to read online.

We have long provided PDFs online, so we’re a bit chagrined to read this finding about PDFs. Fortunately, most of our webpages are also available as straight HTML text online, with the option in the file of opening or downloading a PDF version of the content. We continue to offer PDF as an option to our visitors, because the contents are laid out, look nice (we think), and are suitable for easy sharing with others at conferences and meetings.

Implications for Content Writers | While pleasing pictures can definitely spruce up our websites, they also take up valuable real-estate on the page. Use images to carry content or illustrate the points you’re making. Make sure you include <alt> tags describing the image well, so that visitors with screen readers can also benefit from the graphic.

Examples| The photo above of the F-shaped scanning pattern that web readers use is an example of a content-carrying image. Note that it has a caption. And we’ve certainly included an <alt> tag description for our visitors with screen readers.

Visitors Like Standard Web Features

Web users rely on consistent and predictable placement of standard website features, such as the search box in the upper right hand corner. They also look for such features as “About Us” or “Contact Us,” which let them know who you are. When they visit a link on your site, they want to see that the link then changes color (letting them know they’ve visited it). Other conventions that most visitors are used to, understand, and want to see:

your company’s logo in the upper left corner

no splash pages

a breadcrumb trail that shows them where they are in the site (and which allows them to get “home” with a click)

a site map

If these conventions are violated, hard to find, or hard to use, visitors are likely to leave the website and go elsewhere. (13) As Jakob Nielsen says, these conventions ” increase users’ sense of mastery over the website, increase their ability to get things done, and increase their overall satisfaction with the experience.” (14)

Implications for Web Developers | Do follow the standard conventions of the current web. This helps visitors know where they are, how to move forward or back, and how to find certain kinds of information.

Examples | Look at your own website. Is there a search box where people can enter a term and run a search of your content? Is it located in the upper right-hand corner? How about the other elements mentioned above —- is there an About Us page? A page that tells folks how to contact you? Do your links change color for users once they visit that link?

For More Detailed Info about How We Read on the Web

These findings only scratch the surface of Nielsen’s research. We highly recommend a lengthy visit to his website—with multiple returns for more information.

Of course, Jakob Nielsen isn’t the only one vigorously investigating web design and user behavior. There’s a fabulous amount of information on the web (naturally) and in print about this subject. Other sources of information include:

Accessibility

The people who work on the CPIR are not just advocates by profession—everyone on our team has a personal stake in the disability community as a parent, sibling, spouse, or otherwise.

The CPIR strives to be ever conscious of accessibility in technology. In compliance with Section 508 of the Rehabilitation Act, we have endeavored to make our website as accessible as possible, less any undue burden that would be imposed on us.

Compliance is an ongoing process on an active site such as the Hub. If anyone has difficulty accessing our website information and resources, we encourage you to reach out to us directly so that we can improve our efforts to accommodate our audience.

Ideas That Work

This website was produced under U.S. Department of Education, Office of Special Education Programs No. H328R180005. The views expressed herein do not necessarily represent the positions or policies of the Department of Education. No official endorsement by the U.S. Department of Education of any product, commodity, service or enterprise mentioned on this website is intended or should be inferred. This product is public domain. Authorization to reproduce it in whole or in part is granted. While permission to reprint material from this website is not necessary, the citation should be: Center for Parent Information and Resources (retrieval date). Title of the document, Newark, NJ, Author.