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.

Example of Issue

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

Recommendations

Accessibility/Usability

Accessibility
Usability

Impacted Assistive Technology

Screen Reader

Impacted Type of Device

Computer
Mobile