Are you skimming or scanning right now?

What the science of reading tells us about designing with words

Angela Gorden
May 22, 2017 · 7 min read
Image for post
Image for post

In many ways, paper offers an experience that is just better than reading digitally. A dusty book jacket, the scratchiness of paper between your fingers as you flip through a novel. The smell of a first edition found in an un-shelved stack at a used bookstore.

Books have a physicality that resonates with most of us. People remember what they’ve read from physical books longer, and find it easier to grasp the the arc of stories.

Image for post
Image for post

The thing is, much of what we read these days is on screens, not paper. Words saturate the apps on our phones, tablets, and computers. Websites are teeming with words.

Context and Content

The context is completely different, and so is how we think and feel about the content. When reading on a tablet, laptop, or phone, you’re having a different experience than digging into a dog-eared paperback borrowed from a friend.

Digital contexts inspire a specialized kind of reading with its own kind of magic.

Product designers, writers, and content strategists can design better digital reading experiences if we understand more about what happens when people read in these contexts.

Yes, people read.

Human brains are getting better at parsing information in digital contexts. We’re reading longer blocks of text on our phones than ever before.

Yet when we read online, most of us toggle instinctively between skimming and scanning. Sure, we can hack our minds to switch to a different pace and style of reading, but these are our “go-to” modes for reading words on screens:

When you skim, you are a gatherer.

You survey the landscape of the text. You roam the hills and valleys of words as you gather information in the most efficient way you know how.

When you scan, you are a hunter.

You’re on a mission, and you know precisely what you’re looking for. You focus on your mission, ignoring pretty much everything else.

Let’s take a closer look at these 2 reading modes and how we can design for them.

Skimming mode: “What’s in it for me?”

Online, we are generally goal-oriented readers, or “information foragers,” especially when it comes to nonfiction, instructional, and transactional content. Our eyes tend to lightly skate over the words in things like modals, confirmation dialogs, popovers, and menus.

It doesn’t take long to decide to leave an app, dismiss a dialog, or close a window. In mere seconds, we evaluate relevance to our needs and interests.

Skimming is most people’s default method of absorbing content online. Through eye-tracking studies, the Nielsen Norman Group has documented that people tend to skim in a few stacked lines across the screen up top, and then our eyes drop down the left side of the screen in what looks like an F pattern.

Image for post
Image for post
Source: F-Shaped Pattern for Reading Web Content

On phones, we tend to fix our gaze on the image or words in the top third of mobile screens, then, drop the gaze to the bottom of the screen or up to the very top to take action.

Even when you read a complete sentence, your reflex is to skim. Your eyes leap back and forth across a line of text every second in movements called saccades. How far your eyes leap varies depending on your reading level and how well you know the content, but the intent is the same.

Jason Santa Maria explains how, saccades help our eyes register a lot of information in a short span in his article, “How we Read” in A List Apart.

During these leaps, or saccades, our brains are searching for places to pause. Brief pauses between jumps are called fixations. This is when we process how individual words or letters relate to the other items on the screen.

Whenever we read, our instinct is to conserve mental energy. This is especially true when we read on screens where short attention spans, multi-tasking, and frequent interruptions are par for the course.

Design for skimming

This is a problem if you want users to understand new features, upgrade options, terms of service, and the like.

Designers and writers can try a few things to support people’s instinct to skim.

  • Front-load content. In this example, Slack puts the main message in the boldest and largest type and offers more details for people who want them.
Image for post
Image for post
Screenshot from Slack application for macOS
  • Display progress bars and status indicators.
  • Sync images with the tone and message of your copy. The illustration in this email from Simple Bank enhances the feeling of security and ease conveyed by the copy. The message is clear in a single glance.
Image for post
Image for post
Email content from Simple Bank
  • Offer choices and menu options that are clearly distinct from one another. Spotify’s web app list numerous options with unique and specific labels. You could skim this and get the gist of what you can do here without thinking too much.
Image for post
Image for post
Image from Spotify’s web player
  • Use descriptive links and Call to Action labels. The text on the button in this Squarespace email is both informative and concise.
Image for post
Image for post
Image and copy from an email from Squarespace
  • Display like elements and copy together. Structure makes skimming more effective.

Scanning mode: “My mind is made up.”

You are on the hunt, and a screen with a block of text is like a maze that you want to escape as fast as you can. For example, it probably wouldn’t take you long to scan the next paragraph and locate the word “encounter.” Try it now. See? Told ya.

Do you remember learning to read?

You were actually training your brain to connect the shape and sequence of specific letters with meaning. Now, when you encounter written text, a big part of what your brain is doing is scanning for familiar shapes. Everything else recedes into the background.

Not all psychologists agree, but according to the oldest theory on how we recognize words, our brains process words as shapes. Since the most distinctive part of letters is their top half, we can usually still make out words even when the lower halves of the letters are covered.

Image for post
Image for post
It’s pretty tough to read when we cover the top half.
Image for post
Image for post
But when we cover the bottom half we can make out the words fairly easily.

Depending on our goals when we scan, our vision narrows to words that represent what we want to accomplish. For example, “Move” or “Sign up.” Scanning is probably part of the reason we are less open to learning while reading screens than we are when reading paper.

Design for scanning

  • Avoid all capital letters since most of us are used to reading a mixture of upper and lowercase letters.
  • Use a limited vocabulary so people become familiar with what you call things.
  • Use conversational language. Avoid jargon readers aren’t familiar with. Readability scoring tools can help. For example, the return flow on Amazon’s website features language that is common, conversational, and direct, which helps decrease the potential for confusion.
Image for post
Image for post
Screenshot from

Why any of this matters

Word choice, sequencing, and strategic placement of the text we use in apps and websites are powerful design tools, like photography, illustrations, graphics, and layout. Designing for skimming and scanning modes can help create better reading experiences, establish brands, convert users to subscribers, and decrease customer support tickets.

Hey there! Are you one of the small percentage of readers who made it to the end of this post? Nice! You deserve a reward. Oh, and here are a few resources that may be helpful:

Angela Gorden is a UX writer and content strategist who loves lists, G2 Pilot pens, and dot-grid paper.

Evernote Design

Tales of adventure from the Evernote Design team

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store