2.9 Ensure that information laid out using tables make sense when linearised, or provide an alternative equivalent

Rationale

Tables were originally developed as an HTML feature, specifically for presenting tabular data and were never intended for controlling presentation. However, the data cells in a table can hold many different types of information, including text, numbers or images. Designers often use tables to control page layout. For example, to present text in a newspaper-like column layout, to display navigation elements on the left of the page with content in the middle or to position images inside blocks of text.

This creates a problem for users of screen readers or older technology. Older screen readers and text only browsers can't cope with information laid out in columns. If two columns of text are laid out side-by-side, a sighted person will read the left hand column from top to bottom before moving on to the next column. An older screen reader or text only browser will read from left to right, starting with the first sentence on the left hand column, then running over into the first sentence on the right column. This continues all the way down the page. The end result is that sentence fragments are combined into meaningless gibberish.

To avoid this problem, some users linearise tables on a web page - either through controls in their screen reader or web browser or by using a text only browser which can linearise tables.

The order in which the content is displayed in the linearised version is determined by the order in which the table cells are defined in the underlying HTML of the web page. This could be different to the order in which the tables are visually presented.

Consider reading a newspaper, where the headlines for all of the articles on a page are displayed at the top left of the page. The articles are then displayed one after the other in a long column and there is nothing to associate the headlines with their corresponding articles. There is also no easy way to tell when one article ends and another begins. This is what it is like to read a table which does not make sense when linearised.

Directions and Techniques

Separate structure and presentation

Design the structure of documents or web pages before thinking about how they will be presented to the user. Consider how the page will be read by a screen reader or with linearised tables. See WAI recommended techniques for separating structure and presentation

Use style sheets for layout wherever possible

Style sheets are not widely supported by web browsers at present but they should be used as support is increasing and style sheet positioning can be linearised in a way that makes sense. See WAI recommended techniques for using style sheets for layout

Provide an alternative page with a linearised version which makes sense

If you provide an alternative page with a linearised version of information which would otherwise be held in a table, ensure that the link is easily available, that the link title is meaningful and that the information contained in the linearised version is the same as in the non-linearised version.

How you could check for this:

Read tables in a linear browser

A text only browser, such as Lynx will show you how the page renders when the table is linearised. Opera is a web browser which allows you to linearise tables and this can also be used. Read the content of the table to see if it makes sense when linearised.

Test the table with a screen reader

Some screen readers don't cope well with tables and it is best to read the content of the table with one of these to see how the content reads when the table is linearised.

- View WAI checkpoint 5.3