H63: Using the scope attribute to associate header cells and data cells in data
tables

Important Information about Techniques

See Understanding Techniques for WCAG Success Criteria for important information about the usage of these informative techniques and how they relate to the normative WCAG 2.0 success criteria. The Applicability section explains the scope of the technique, and the presence of techniques for a specific technology does not imply that the technology can be used in all situations to create content that meets WCAG 2.0.

User Agent and Assistive Technology Support Notes

Description

The objective of this technique is to associate header cells with data cells in complex tables using the
scope attribute. The scope attribute may be used to clarify
the scope of any cell used as a header. The scope identifies whether the cell is a
header for a row, column, or group of rows or columns. The values row,
col, rowgroup, and colgroup identify these
possible scopes respectively.

For simple data tables where the header is not in the first row or column, like the one
in Example 1, this technique can be used. Based on screen reader support today, its use
is suggested in two situations both relating to simple tables:

data cells marked up with td that also function as row header or column
header

header cells marked up with td instead of th. Sometimes, authors
use this to avoid the display characteristics associated with th and also
do not choose to use CSS to control the display for th.

Note 1:
For simple tables that have the headers in the first row or column then it is
sufficient to simply use the TH elements without scope.

Note 3:
Some users may find it easier to work with several simple tables than one more complex table. Authors may wish to consider whether they can convert complex tables to one or more simple tables.

Examples

Example 1: A simple schedule

In the following example, column #1 contains serial numbers for rows in the table
and the second column contains the key value for the row. The cells in the second
column may then use
scope="row". The cells in the first row too are
marked up with td and use
scope="col".

Tests

Procedure

Check that all td elements that act as headers for other elements
have a scope attribute.

Check that all scope attributes have the value row,
col, rowgroup, or colgroup.

Expected Results

All checks above are true.

If this is a sufficient technique for a success criterion, failing this test procedure does not necessarily mean that the success criterion has not been satisfied in some other way, only that this technique has not been successfully implemented and can not be used to claim conformance.