Tables Used for Visual Layout of Non-Tabular Information

Short Description

Tables are used for reasons other than organization, most often visual layout

Long Description

  • Sometimes tables are used for the visual layout of information that does not actually belong in a table. Information belongs in a table if it is information that has some sort of relationship. For example, information about who has reserved various rooms at different times belongs in a table, because there is a relationship between the times and rooms where they intersect with the name of a person. It is not appropriate to place form elements such as edit boxes where someone is signing up for an account into a table, because there is no natural grid for that information; that information is linear—first name, last name, email address, etc.
  • A screen reader user has a couple ways to navigate a table, they can read the content in a linear manner, each row from left to right, or they can navigate up and down columns and left and right along rows. In a table, where information appears with respect to other information is important and meaningful. Putting information into tables for the purposes of visual layout can be confusing to a screen reader user, because it suggests that there is a meaningful sequence of content when one does not exist.
  • Using a table inappropriately makes the content less adaptable to alternative forms of presentation, and assistive technologies often take the information from a page and present it in a way that winds up being more meaningful to the user; when information is marked up appropriately it is easier for assistive technology such as screen readers to determine exactly how to interact with it.
  • The screen reader communicates information about location in a table, for example “Entering table, 7 rows and 3 columns… row 4, column 2…” If there is no meaning to the table, then this extra information winds up being an additional and unnecessary cognitive burden.
  • Sometimes tables are embedded within other tables, making it more difficult to read through content and make sense of it. li>

Example of Issue

Nested tables used for an email layout make it harder to find the information that is the point of the email.

Accessibility/Usability

Accessibility
Usability

Impacted Assistive Technology

Screen Reader

Impacted Type of Device

Computer
Mobile

Recommendations