Browsing habits of screen reader users

A while ago I read the article “Observing Users Who Listen to Web Sites“. In that article the authors report that visually impaired users scan web pages with their ears instead of reading them top to bottom. This may not come as a surprise to you if you read Jakob Nielsen’s “How Users Read on the Web” back in 1997. Recently I have had the opportunity to study a number of screen reader users and my observations are similar.

This article is also available in Polish.

Pages are scanned, not read word by word

Why do we scan instead of read? Steven Krug, author of the usability book Don’t Make Me Think talks about users being in a hurry and how users satisfice when browsing for information. This means that we quickly look for and choose the first reasonable option and not necessarily the best one.

If you have employed a decent graphics designer chances are that he/she has used typography, background colors and images to make it easy for sighted users to find the information they want quickly. Sighted users use the graphical layout of a page to get an idea of areas of importance and can thereby make unconscious decisions to focus their attention to specific items.

How do you scan with your ears?

Early screen readers pretty much created a long linear version of a web page. Imagine of you quickly had to get an overview of a movie on a VHS tape but your VCR had no forward or rewind buttons. You would have no option but to watch the movie from the beginning to the end. Fortunately, modern screen readers have features that can break apart the long linear version into different views based on the semantic markup of the information in the web page. The users I observed were mainly using the following features of their screen reader (Jaws) when scanning web pages:

  • The list of headings. When Jaws loads a page it parses all heading elements and displays them in a list. Jaws list of headings dialog Headings are initially presented in tab order and each heading is followed by the heading level. By listening to this list the user can get an overview of what the page is about. The user can also sort headings alphabetically and filter all headings on a specific level. This was one of the first things the users I observed had a look at.
  • The list of links. Similar to the list of headings this list presents all links in the document. Jaws list of links dialog By listening to the links the user may get a different view of what the page is about and more specifically to where he/she can navigate. Shortcut keys specified for links are also presented in the list.

These features where used together with the linear representation of the page. A typical user scenario would be:

  1. Opened web page. Listened to page title from linear representation.
  2. Opened list of headings. Listened to level one headings.
  3. Closed list of headings. Jumped to first heading. Listened to some text.
  4. Opened list of links and listened to some of the items.
  5. Returned to the linear representation.
  6. Opened list of headings and listened to some more headings.
  7. …and so on.

Advanced users crank up the speed of the voice to make this type of page scanning faster.

Implications for html coders

You can probably see where this is heading. Imagine if the web page has no heading markup. In that case the list of headings will be empty and the user is left to the linear representation of the page. The same goes for page links. If the link text is poorly written it is difficult to get any information from the list of links dialog. “But”, you say, “I am using the title attribute to provide a proper link text”. Unfortunately Jaws does not make use of the title attribute with the default settings. Just like with ordinary browsers, many users do not know how to change this setting.

So, here are some suggestions you can use to improve the browsing experience for visually impaired users:

  • Use headings god dammit!
  • Use heading levels to communicate a hierarchy if there is one. Do not go directly from h1 to h3. Otherwise browsing the list of headings may be confusing.
  • Provide meaningful link texts. Sometimes it is enough to extend the scope of the link to a few more words in the surrounding text. Instead of linking “book” in the phrase “the new book by Douglas Adams” you could link “book by Douglas Adams” to provide context. Just don’t overdo it.
  • Use the alt attribute of the image rather than the title attribute of the anchor element when using image links. This makes sure link text is accessible for Jaws users that have not changed their settings to make use of the title attribute. If you don’t provide an alt- or title text Jaws will read part of the image filename which will be ugly. Think “slash www slash img slash p underscore small”.
  • Write for the web.

How to check your website with Fangs

The best way to test your website is of course to get a copy of Jaws and listen to how it sounds. This takes a lot of time. If you haven’t installed Fangs, the screen reader emulator, yet I suggest you do so now. Version 0.80 now has basic functionality for the list of links and the list of headings. Does your website work? I know I have some things to fix.

References

  1. Don’t Make Me Think by Steven Krug.
  2. Observing Users Who Listen to Web Sites by Janice (Ginny) Redish and Mary Frances Theofanos.
  3. Jakob Nielsen’s How Users Read on the Web.

Comments

  1. Markus Thyssen says at 2005-01-13 10:01:

    Great post! This made me understand the real reason for using header tags. Is Jaws the only application that actually makes use of the semantic information?

  2. Pete says at 2005-02-01 09:02:

    Markus, most screen readers use the semantic information of header tags. Other elements are often ignored. There is a discussion on this topic in the comments to my previous post titled “Standards-wielding maniacs”.

  3. Juan Carlos says at 2005-04-08 15:04:

    Ironically you break some accessibility guidelines on your site even though you write about how say a screen reader can help an end user:

    On your pages you have a lot of “Read more” links. But, if you read this out of context, it is not very helpful.

    A screen reader user scanning via links will not like what you have!

    Perhaps what you can do is use the aural CSS class and add some hidden text for each link. Hence, you might have something like this:

    <a href=”whatever”>Read more<span class=”aural”> on article xyz</span></a>

    (notice the space inside the span, not outside, else you’ll get an extra space in your link for users using your styled version.)

    Might add to page weight, but may be useful for screen reader users.

  4. Pete says at 2005-04-11 12:04:

    Juan, your observation is correct. However, I am using the title attribute in the link to to convey the name of the article. Although this isn’t on by default in e.g. Jaws many users enable reading of the title attribute in their screen reader software.

  5. Rich says at 2005-07-11 20:07:

    Jaws stupidly only lets you either use title or alt for images in anchor tags, and there is no way to say : prefer title over alt; if not title use alt, or equivalent. Very silly, but that’s what we got to live with.

  6. Zephyr says at 2006-11-28 02:11:

    Is it just me, or is Jaws a bit lame? The annoying way in which it reads out every dash, even if it’s part of an everyday word. I also thought speech synthesis technology had progressed beyond what Jaws 8.0 offers, but I could be wrong.

  7. John says at 2007-04-05 18:04:

    I have to agree with Zephyr’s comment but i am sure the next versions will be much much better

  8. Jeannie says at 2007-07-17 04:07:

    Hey there, great article. I’d love to see a piece that deals specifically with how screen readers view/make sense of search result pages and what can be done to improve the scannability of SERPs.

  9. Szabolcs (eye-tracking.hu says at 2010-11-10 13:11:

    You can find heatmaps and others on my site, more about this post (eyetracking).

  10. Lucy Dodd says at 2011-02-11 12:02:

    Hi
    I would advice anyone interested in screen reader user behaviour and preference to read through Webaim’s survey. I did a similar survey while I was at the BBC and got the same results.

  11. Debbie Gillespie says at 2011-02-11 23:02:

    As to Jaws reading all the punctuation. You are able to selectively turn this on and off which is indeed, a good thing.

    rather than the headings list I tend to use the quick navigation keys while reading. saves keystrokes and doesn’t interrupt the flow of information to the ears.

  12. Jason Bratcher says at 2012-06-25 09:06:

    Freedom Scientific’s Jaws for Windows (JFW) IS NOT the only screen reader in town that understands true html markup.
    Have a look at NVDA (NonVisual Desktop Access), from NVAccess:
    http://www.nvda-project.org
    or Window Eyes, from GWMicro:
    http://www.gwmicro.com
    .
    Incidentally, i write this comment via FireFox 13 and NVDA; Purs like a kitten;
    Especially in the About:Config screen with that massive table of some near 3000 preferences!

  13. mulberry 銀座 says at 2013-09-09 02:09:

    プラダ チャーム

  14. virtual assistant reviews says at 2013-12-19 14:12:

    Wow, wonderful blog format! How long have you been running
    a blog for? you made blogging glance easy. The total look of your
    web site is wonderful, as neatly as the content material!

  15. Lonnie Aykroid says at 2013-12-19 17:12:

    I absolutely love your blog and find many of your post’s to be exactly what I’m looking for.

    Does one offer guest writers to write content for yourself?
    I wouldn’t mind writing a post or elaborating on some of the subjects you
    write with regards to here. Again, awesome web
    log!

  16. virtual assistant services reviews says at 2013-12-19 21:12:

    I’m not sure exactly why but this weblog is loading extremely slow
    for me. Is anyone else having this problem or is it a
    problem on my end? I’ll check back later on and see if the problem still exists.

  17. You need to be a part of a contest for one of the finest blogs online.
    I will recommend this blog!

  18. Lorraine says at 2013-12-30 19:12:

    Google Adsense is an adverting revenue sharing program by Google that any website owners can put Google ads in their
    websites and can earn revenue from Google for successful
    promotion. This tactic is ‘borrowing’ others articles – syndication.
    If panoramic views are available, a red circle with
    “360″ will appear on the map.

  19. cooking with beer says at 2014-01-04 12:01:

    Beans with coconut recipe is perfect for satisfying that craving for
    vegetarian foods without being an overly rich cream-based
    soup or a bland concoction of random ingredients.
    Cook the peas and carrots according to package directions.
    Add in the finely chopped walnuts and let it sit while you prepare the other ingredients.

  20. full hd videos says at 2014-01-04 13:01:

    Its like you read my mind! You appear to know a lot about this, like you wrote the book in it or something.
    I think that you could do with some pics to drive the message home a bit,
    but other than that, this is excellent blog.
    A fantastic read. I’ll certainly be back.

  21. exploits says at 2014-01-22 14:01:

    Hello! I could have sworn I’ve visited this web site before but
    after browsing through many of the articles I realized it’s new to me.
    Anyways, I’m definitely pleased I came across
    it and I’ll be book-marking it and checking back frequently!

  22. selling my home privately uk says at 2014-01-25 04:01:

    Great post. I used to be checking continuously this blog and I am inspired!
    Very useful information specifically the final section :) I handle
    such information much. I used to be seeking this certain information for a
    very lengthy time. Thanks and best of luck.

  23. youtube music downloader says at 2014-02-23 14:02:

    So – Mud is also a fast web video downloader which can search and download web videos from
    You – Tube, Yahoo Videos, Daily – Motion, Live – Leak and
    more other popular video sites. There are many sites today that
    on can use to Telechargement gratuit( download) trailers and even
    full movies. Neon Hitch is no stranger to lending her magical touch
    to unsuspecting songs; her original series of hip-hop covers (Waka Flocka Flame,
    Mac Miller, Wiz Khalifa and Kreayshawn) have racked up millions of views on You – Tube.

  24. download youtube videos free says at 2014-03-03 14:03:

    Very shortly this website will be famous among all blogging and site-building people, due to it’s fastidious articles or reviews

  25. Renate says at 2014-04-14 17:04:

    hey there and thank you for your information – I’ve certainly picked
    up anything new from right here. I did however expertise some technical issues using this site,
    as I experienced to reload the web site lots of times previous to I could get it to load correctly.
    I had been wondering if your web hosting is OK? Not that I’m complaining,
    but slow loading instances times will sometimes affect your placement in google and can
    damage your quality score if advertising and marketing with Adwords.
    Well I am adding this RSS to my email and could look out for a lot more of your respective fascinating content.
    Ensure that you update this again very soon.

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).