Click, scroll, swipe: How do I read thee? Let me count the ways

Posted by Henry Breimhurst on May 03, 2013

I’ve written before about certain tactics and guidelines you can use when writing content for the web. But I weaseled some caveats in there, one of which was that any content guidelines are liable to change as technology changes.

Sometimes the medium is the message, but the medium ALWAYS shapes the message. This is the place where content and the design of content meet. Depending on what medium you’re working with, you need to think about how your story is structured, written and presented.

Who’s up for a little navel gazing? Let’s back waaaaay up and see what we can learn about the way technological evolution changes the way we consume and interact with content.


From Stone to Tome: The Written Word Through the Ages

The idea of changing content to fit the medium is as old as the written word.

  • Single medium: Early carving or writing was on a single medium (e.g., stone, clay tablet, leaf). Writers edited the story to fit the medium, and readers interacted by, well, looking at it. If there was more to the story, they walked to the next obelisk or picked up the next tablet.
  • Scrolls: Eventually paper, cloth, parchment and wood were stitched or extended into scrolls. It allowed long-form content in a portable medium; stories got longer, and readers interacted by unrolling it.
  • Books: Books broke content into smaller chunks, but let readers jump around as they saw fit by flipping pages. Long stories fit well, but so did non-linear content like short story collections or reference material.
  • Newspapers: The newspaper added the intellectual innovation of presenting multiple stories together, and having readers follow non-linear jumps to read more.

Tablets… scrolling… jumps. Sound familiar? Digital media take many interaction cues from their analog ancestors, but the actions readers take change as hardware changes.


Screen Time: Evolution of the Digital “Page”

We consume digital content on screens of a certain size, but we control it through a layer of technology. Even touch screens have invisible sensors that detect a tap or swipe and software that translates that into a display change. Depending what technology a reader uses, writers may need to change how their content is presented.

  • Keystrokes: The content on the first personal computers was controlled by keystrokes. Arrow keys, numbered options and BASIC, DOS or similar commands called up content, scrolled through text and moved the reader from page to page. It was cumbersome and non-intuitive. Format options were minimal.
  • Mouse clicks: Once graphical interfaces appeared, clicking on a mouse became the primary way to navigate content. Clicking links and buttons with a mouse was much easier than using keys. And since one click could bring up a full new page of content (as opposed to multiple clicks to scroll), keeping all content “above the fold” (visible in a single screen view) became popular.
  • Scroll wheels: With the addition of scroll wheels on mice, users could now zip up and down web pages with speed and precision. It made the fold less of a barrier to readers, and opened the battle lines of the ongoing scroll vs. click debate in web design. Because of the orientation of the scroll wheel, almost all scrolling content is arranged vertically.

Unlike analog innovations, these technologies have been additive. Books displaced paper scrolls, but readers navigate content using keyboards, mouse clicks and scroll wheels in combination or interchangeably.


Touchy Subject: Content and Touch Screens

And now, with the advent of the touch screen, we’re seeing the arrangement of content and the ways users consume it change once again.

  • What’s old is new (in navigation): Touch screens replace the action of moving a mouse and then clicking with a single tap; the scroll motion of a wheel is replaced with a swiping motion; transitions can move up, down, left or right with ease. The addition of multi-touch (like pinch-to-zoom, or swipe with multiple fingers to call up a new function) adds to the nuance.
  • What’s old is new (in layout): Interestingly, many content publishers are formatting their touch-centric content into print-like pages again. When you swipe or tap, it shows a full screen of content as a unit, allowing editors to again use multi-column layouts and artfully wrap text.
  • Smaller screens, less room 4 wrds: Many touch screens are smaller than the screens on devices they replace, so font size and content arrangement need to adjust. Indented bullets (like this one), the mainstay of writing for a computer monitor, waste a lot of space on a vertical smart-phone screen.
  • Thumbs get in on the action: Users frequently hold tablets in both hands, so a new navigation experience is using the thumbs to tap what are essentially “next/back” links at the edges of screens. Horizontal, screen-by-screen views on a tablet seem to be as natural as continuous vertical scrolls on a computer screen.
  • Biology screws up swiping… up: Unless you’re a FREAK, your fingernail is on top of your finger. This messes with bottom-to-top swiping motions for anyone with nails of more than a quarter inch, especially on vertical screens. (Laaaaaaadies. And ungroomed duuuuuuudes.) Now you know why tablet developers love horizontal motion.

Standards are still fuzzy. Some content-heavy sources use horizontal navigation between chapters, sections and articles, and vertical navigation within a chapter, section or article. Others keep all swiping motions horizontal. All combine swiping with links that keep the old “click to jump” navigation method alive and well.


So What Does All This Mean?

Well, it means the medium matters. The good news is you already knew that instinctively. The bad news is nobody agrees that there is one magic formula that spans all the ways people have been trained to read on screen.

A few bits of advice:

  • Google “responsive design” if you haven’t already. The old way of spanning devices was to create a web site for computers, a mobile site for phone browsers and an app version for app-enabled devices. Responsive design builds in the ability to “sniff” what device is displaying the content and modify the experience without separate versions.
  • Play with a Windows 8 desktop connected to a touch screen. Some people love Windows 8 and some hate it. This isn’t an endorsement. To me, it’s a fascinating test bed for user input, since it is the only common platform out there today that lets readers use keyboards, mouse buttons, scroll wheels and touch gestures all at once. Try it yourself. See how your content fares.
  • Try converting content for a tablet slideshow. If you knew users would see your content on a series of sequential screens, how would you edit and format it? CNN’s Bleacher Report sports site delivers a lot of its content in lists, one item (with visual) per page, and its responsive design changes “next” buttons on a computer browser into horizontal swipe navigation on tablets. How would your content translate?

OK, so it’s ambiguous. That’s all right. Doubt self-proclaimed “experts.” In the grand history of storytelling, we’re all like stone-carvers looking at a papyrus scroll for the first time. If we embrace the potential of new technology, we can help invent new ways to share our content.

Or at least we’ll have a few amusing failures to look back on — like Moses coming down from the mountain with a single stone tablet that says “Thou shalt not BACK/NEXT.”


Leave a Reply


Subscribe by email

Connect with us

Content Marketing TrendsLearn what more than 700 B2B marketing pros are thinking and doing with content marketing. Get your free copy of the 2013 B2B Content Marketing report.

Introducing our team of content explorers and blog contributors.
 Digital Strategy Chris Mikko
Director of Content, Digital
Website implementation specialist Vince Giorgi
Vice President, Solutions Development