Mental Workload for Paged and Scrolled Documents

In a recent doctoral thesis from the department of psychology at Gothenburg University, Sweden, Erik Wästlund provides some interesting findings on mental workload for consumption of information. Two of the principal findings are:

  1. Consumption of information is more efficient when information is presented on paper compared to presenting the information on a computer screen.
  2. Consumption of information generates less mental workload when the page layout is adapted to fit the screen.

The first point may not come as a surprise. Steve Krug has argued that users tend to scan web pages rather than read them and Erik’s study cites previous research that says users tend to have difficulties reading longer passages of text on a screen.

A fundamental characteristic of reading information on a computer screen is that it “involves both the process of reading the presented text and handling the computer. The reader’s processing capacity is being utilized not only for decoding but also for page navigation.”. When we read e.g. a book the mental workload is low because we know from experience where to focus after turning a page.

Adapting content to the screen

The second point has some interesting implications for people working with the web. Currently, web pages with a lot of text tend to come in two flavors:

  1. All text on a single web page and the standard browser scrollbar to move forward in the page. (Example: A review of the Web Content Accessibility Guidelines 2.0, May 2007 Working Draft).
  2. Paged text and one or more navigation buttons to move to the next page. (Example: Mark Pilgrim’s Dive Into Accessibility, Day 6: Choosing a DOCTYPE).

Paged text on the web today is rarely adapted to the browser window size.

In Erik’s study the test subjects were given reading assignments. One group read the document in a scrolled format (number 1 above) and the other group read the document in a paged format where the page format was adapted to the computer screen.

The result showed that mental workload was lower when you read information in a paged way adapted to the screen. This is interesting as the current technology for constructung web pages (HTML and CSS) do not provide an easy way to page text adapted to the user’s screen. I am guessing that it may be possible by using javascript to measure the window size and create keys to move forward by a viewport page at the click of a button.

On the other hand, most browsers provide this functionality for scrolled pages in the Page-up and Page-down keys. In the usability tests I have participted in during the past years I can not recall a single user using the Page-up/down keys.

So, does this mean that scrolled text is better if user’s learn to navigate with the Page-up/down keys? Or should content authors paginate long documents? Will these methods have other accessibility implications?

Comments

  1. soxiam says at 2007-06-25 04:06:

    “Paged text on the web today is rarely adapted to the browser window size.” That is a great observation. So utterly obvious but easily escaped. There are so many design and interaction hurdles to overcome when designing effective pagination, but what’s quickly forgotten in the equation is the issue of viewport and how we cannot exercise control over it in screen media.

  2. Ephram Zerb says at 2007-06-25 07:06:

    This is pretty interesting. I would be curious to find out more details on how the experiment was conducted. Particularly interesting would be to see the way in which the text on the screen was set and laid out. I also wonder if and how pared down the interface was during testing. This might be relevant when trying to extend the findings to the web.

    Instinctively, I tend to favor placing long content (think long magazine articles) all on one page without burdening a visitor with navigation. This tends to support the way people interact with web content — a lot will will scan to find value (as you mention). Adding pagination cripples such behavior. Not to mention, the pagination competes with dozens of other choices on a typical web page. As a result, how many visitors will have abandoned reading the pages in sequence?

    On another note, there is a pretty significant contingent that is experimenting and has faith in an infinite-scroll interface (think search results that aren’t paginated and just keep going down forever).

    Lots of interesting implications and questions here. Great find.

  3. Anup Shah says at 2007-06-25 15:06:

    Interesting. Would be interesting to see the impacts that mice with scroll wheels and other such devices have on this study, as those (i am guessing) are mental tasks with low mental workload…?

    BTW, HTML does support page navigation, but most browsers don’t. That is, you can use the link element to create relationships such as chapters, next, previous pages, indexes, and so on. Opera supports it (but in current versions I think it is hidden away in some tool bar), and with Firefox you need an extension for it. I can’t recall is screen readers support these very well or not.

    But even with them there, we developers will of course need to provide such navigation options on the page too.

  4. Peter Krantz says at 2007-06-25 15:06:

    Anup: Interesting idea. I guess that a mouse with a scroll wheel would allow the user to focus on the text while scrolling thereby reducing the time it takes to locate the next readingpoint.

    I had forgotten about page navigation in HTML. Maybe someone could cook up an unobtrusive javascript or Firefox extension to make it possible to use the keyboard even if the browser doesn’t support it.

  5. Emil Stenström says at 2007-06-25 19:06:

    Very interesting. My mind goes to the javascript libraries focused on mimicking Powerpoint, such as S5 and the likes. Comes with keyboard navigation among other nifty navigation aids.

  6. Ty says at 2007-06-30 19:06:

    1.) I can’t help but think part of the reason for people being better adapted to absorbing content from books is thousands of years of experience. Depending on a persons age though, the younger generations may be better adapting to learning from the screen. If this is only due to practice and experience.

    2.) As far as paging goes rather than scrolling, here’s one solution:
    http://rikrikrik.com/jquery/pager/#examples

  7. Karl G says at 2007-07-02 18:07:

    My reading of adapted to the computer screen is to re-layout the text according to screen size. In an effort to make the web more ‘newspaper-like’ I did a javascript-driven columned layout for nique.net which does this.

    e.g.: http://www.nique.net/issues/2007-06-29/news/1

    (only shows up for firefox/IE6 I’ve learned a lot more javascript in the last three years but couldn’t get it cross platform at the time)

    In testing it for usability, it breaks expectations but people adapt fairly quickly. I’ve never seen anybody use the space/shift+space keyboard shortcuts without me pointing them out.

  8. Luke Stevens says at 2007-07-04 06:07:

    IHT.com did this years ago (3 col paged view) as their default view, which was developed by John Weir. Very innovative at the time. You can see a demo of it here: http://www.smokinggun.com/code/sg_layout.php (last updated in 2003), with the source code still available. The IHT eventually dropped the layout for the usual 1 straight col of text, with give-me-more-page-views pagination, and the 3 col view is available as a pop up option.

    Also, in what sense is consumption of information more “efficient” on paper vs screen? Higher comprehension, or higher recall ability or something like that?

    There was also some discussion about the Poynter Institute eye tracking study that suggested readers read more, or at least the same amount of a story online as they do in print, so perhaps it depends on the kind of content & the situation (user motivation, method of reading etc).

  9. Dragnet Jonas says at 2007-07-11 12:07:

    It´s fairly easy to split a long text and dynamically create pages if you use asp for example. But I wonder if not a surfer loses his focus if you got a couple of pages instead of gathering all info on one page. Isn´t that a part of the success behind blogs?

  10. Peter Krantz says at 2007-07-11 13:07:

    Jonas: Splitting text into reasonably similar chunks may be simple. But how would you accomodate for different text size setting in the user’s browser? Your calculated chunk may fit nicely with the default text size but may incur scrolling for larger sizes.

    I guess the issue of focus may depend on what type of content you are providing. Is it a text that you want the reader to read carefully or just scan? On second thought it may not matter what you as a publisher want. It is all up to the reader I guess.

  11. shraddha rusia starletexports says at 2007-08-16 15:08:

    it’s a excellent readability test

  12. Vienna says at 2007-10-16 07:10:

    putting the text into separate pages would mean more time needed to load the whole thing, and takes time to find/understand how to use the navigation buttons. with good internet speed and great webpage design it would be better, but that just doesn’t come often enough to me.

  13. شات says at 2008-06-13 05:06:

    Nice Info

    Thanks

  14. شات صوتي says at 2010-01-29 00:01:

    Nice

    Thanks

  15. Anonymus says at 2011-11-27 06:11:

    putting the text into separate pages would mean more time needed to load the whole thing, and takes time to find/understand how to use the navigation buttons. with good internet speed and great webpage design it would be better, but that just doesn’t come often enough to me.

  16. maslow motivation and personality says at 2014-09-29 11:09:

    For instance, losing confidence that the novel will be read makes me
    stop writing, and when I can. This can help uncover any issues that may be demotivating to team members.
    You now have the chance to use your one particular on one time with the your teacher to cover the fun stuff as
    a substitute of going around chord composition and scale diagrams.

Trackbacks

Leave a comment

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Peter Krantz, peter.krantz@giraffe.gmail.com (remove giraffe).