Table plus ARIA grid

Simple Tables with ARIA Grid Markup

Example 1 (coming soon)

Example 2 (coming soon)

Grid/Table Row Groupings

The tables use headers designated by aria-describedby, role="grid", role="rowgroup", role="row", and role="columnheader" instead of headers+id.

Test results for tables 3 and 4 are on a separate results page.

Grid/table with row groups

Example 3 (row group headers in an ARIA grid)
empty 1 mile 5 km 10 km
Females Mary 8:32 28:04 1:01:16
Betsy 7:43 26:47 55:38
Males Matt 7:55 27:29 57:04
Todd 7:01 24:21 50:35

Grid/table with column groups

Example 4 (column group headers in an ARIA grid):
empty Females Males
Mary Betsy Matt Todd
1 mile 8:32 7:43 7:55 7:01
5 km 28:04 26:47 27:29 24:21
10 km 1:01:16 55:38 57:04 50:35