Documentation Center

Best practices for authors and editors for creating accessible tables

Tables are a powerful way of visually organizing structured content in a rich text field, but you must keep some accessibility guidelines in mind.

Use tables for tabular data only

Don't use tables to organize information visually. For example, do not put a very long list of strings in a two-column table to save space. Tables are meant for organizing tabular data (that is, data structured into rows, each of which contains information about some thing) in a grid.

A table must have column headers or row headers

Make either the first row or the first column of your table a header, and put text in each header cell.

To make the top row into a header, in the rich text field, right-click the top row and select Row > Row properties from the context menu that opens. Then, under Row type, select Header, then Save to apply your changes. This creates column headers for each column.

To make the leftmost column into a header, in the rich text field, right-click the each cell in that column and select Cell > Cell properties from the context menu that opens. Then, under Cell type, select Header cell, then Save to apply your changes. Repeat this for each cell in the first column. This creates row headers for each row.

A table must have a caption

You give a table a caption in one of the following ways:
  • In Content Manager Explorer or Experience Manager, set the Caption property in the Table Editor dialog.
  • In Experience Space, right-click the table and select Table Properties from the context menu. In the popup dialog, select Show caption. After this, you can type the table caption.

The Experience Space user interface has an Accessibility Checker option for rich text fields. If you are an author inserting, or an editor checking, a rich text field with tables in it, run the Checker to be warned about any table that has no caption (a title for your table).

Screen reader tests

The following keystrokes must be tested:
KeystrokeEffect
TJump to the next table
Shift+TJump to the previous table
Ctrl+Alt+UpMove one cell up
Ctrl+Alt+DownMove one cell down
Ctrl+Alt+LeftMove one cell left
Ctrl+Alt+RightMove one cell right

Further reading

For more information about the HTML structure of tables, refer to the W3C tutorial about tables.