WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: How do screen readers render html (can layout of page be implied from screen reader presentation)

for

From: Bevi Chagnon | PubCom
Date: Aug 28, 2010 2:00PM

Hi Birkir,
It depends upon how the webpage was designed.

Scenario #1:
If the webpage was designed according to today's standards for "good
coding," then it uses CSS (cascading stylesheets) to render the page's
elements wherever the designer wants them on the page.

The underlying content that you read with a screen reader follows the
sequence of code in the actual file, maybe something like this:
1 Skip nav
2 Navigation
3 Main story content
4 Footer

But through CSS, a web designer can have those elements appear anywhere on
the page and they will be read by sighted people in any order they want. For
example:
1 they probably won't see Skip Nav at all. It will be invisible to them, or
not visually distinctive on the page.
2 Navigation might be on the left or right side of the content.
3 Content could be in the middle of the page or to the left, right, or
whether the designer wants to put it.
4 It's safe to assume that footers appear at the bottom of the page, but
there's no law about that!

Conclusion:
Your screen reader reads the content in the order in which it appears in the
code file.
But sighted visitors will have those elements all over the page, left,
right, top, bottom, middle.

So there's no correlation between the sequence you hear from your reader and
what I see on the page, and we'll have a tough time talking together about
this webpage!

And to answer one of your questions, no, you cannot imply the layout of a
page designed with CSS from a screen reader's presentation.


Scenario #2:
If the webpage was designed according old techniques, namely using tables
for layout, it will read the content to you from the upper left cell of the
table to the lower right cell, reading horizontally across the cells unless
you tab down and read from top to bottom in a column.

Conclusion:
Yes, you can somewhat imply the layout of a page designed with tables from a
screen reader's presentation. For example, you'll at least know that cells
at the end of a row are on the right side of the page.

Scenario #3:
If the webpage was designed in the early days of the Internet, there wasn't
much we designers could do, so the sequence you hear is the sequence we see
in the page layout.

There aren't very many webpages like this around anymore, but every once in
a while I still find one on some obscure website.

--Bevi Chagnon