Skip to Main Content Art of ALT: Accessible Design for the Humanities

Section 4.1: Defining Accessible Data Tables, Part 3

Other Useful Features in Accessible Data Tables

There are 2 HTML elements that can help orient users to using a data table:

Table caption

All the table examples we have seen so far in this lesson have included some kind of title or label that identifies the tables. Typically, this title is intended to give an idea about the purpose of the table. It is visible on the screen and useful to all users.

Sometimes the title of the table needs to be very clearly associated in the HTML code with its table. Tables can be "difficult to identify... when text immediately preceding the table does not refer directly to the table, or when there are multiple tables" on the page [ 4 Opens a new window ]. The way to associate a title with a table is to use an HTML element called caption.

A caption is part of the table and comes immediately after the table element in the HTML code and before anything else. The default visual presentation of a caption is centered immediately above the table, but this can be changed if needed [ 2 Opens a new window ].

Table summary

In HTML, the summary is an attribute of the table element. The summary is not visible on the screen and is intended for those who are unable to see the table and are using assistive technology.

The summary attribute should be "used to describe the primary purpose of the table and give an indication of its overall structure. Most assistive output technologies will read the summary first to provide the user with information to help them interpret and use the table. With more complex tables, the summary becomes increasingly important" [ 2 Opens a new window ].

Note: Such tables are sometimes used solely for visual presentation and placement on a Web page and not to present data with associated headers. These kinds of tables are called layout tables and do not typically need a summary attribute.

Relationship of caption and summary

"The caption element may be used whether or not the table includes a summary attribute. The caption element identifies the table, whereas the summary attribute gives an overview of the purpose or explains how to navigate the table. If both are used, the caption should not duplicate information in the summary" [ 4 Opens a new window ].

Example of Table Summaries

The Proto-Indo-European Lexical Roots table Opens a new window could have a summary such as

"This table presents Proto-Indo-European (PIE) sounds presented by type, articulation class and sub-class. Some data cells have no entry."

The goal of this summary is to give enough information to help the users determine whether they need information from the table and to highlight any features of the table that may impact how they want to navigate it.

This completes Section 4.1.

Go on to Section 4.2.       Go back to Section 4.1, part 2