Introduction

Purpose

The purpose of this test page is to test 1) how screen readers read tables with a blank first cell and 2) how screen readers support table heading markup for complex tables.

Conclusions

• JAWS reads all tables the best.
• NVDA is better than VoiceOver for complex tables, but by no means perfect.
• If the first cell in the table is blank, it must be a TH. TD throws off the header cells throughout the entire table in VoiceOver, both simple and complex.
• The first blank cell can be null or a non-breaking space - it doesn't seem to matter.
• For NVDA, of tables with compound row or column headers, compound column headers with scope and col and colgroup read best.
• Neither NVDA nor VoiceOver read headers / id well.
• VoiceOver doesn't read compound headers well regardless of method.

Testing basic data tables

The following tables test how basic data tables read.

Table 1a: A simple table with one header row only. Uses th but does not use scope.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: good

Table 1b: A simple table with one header column only. Uses th but does not use scope.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: good

Table 1c: A two-dimensional table with no blank header cells. Uses th but does not use scope.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: good

Table 1d: A two-dimensional table with no blank header cells. Uses th and scope with col and row.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: good

Testing tables with a blank first cell

The following tables test how using TD vs TH on the blank cell affects screen readers.

Table 2a: A two-dimensional data table where the first header cell is empty and marked with a TD. Uses th and scope with col and row on THs.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: shifts row and column headers

Table 2b: A two-dimensional data table where the first header cell contains a non-breaking space and marked with a TD. Uses th and scope with col and row.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: shifts row and column headers

Table 3a: A two-dimensional data table where the first header cell is empty and marked with a TH and no scope. Uses th and scope with col and row.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: good

Table 3b: A two-dimensional data table where the first header cell contains a non-breaking space and marked with a TH and no scope. Uses th and scope with col and row on THs.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: good

Table 4a: A two-dimensional data table where the first header cell is empty and marked with a TH and scope. Uses th and scope with col and row.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: good

Table 4b: A two-dimensional data table where the first header cell contains a non-breaking space and marked with a TH and scope. Uses th and scope with col and row.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: good

Testing tables where the row headings are in the second column

Table 5: Use of th, and scope with col and row for a two-dimensional table where the row headings are in the second column.

Results:

NVDA 2015.1 / Firefox 38: reads properly except that the cells in column 1 do not recognize the row headers in column 2

JAWS 15 / IE 11: reads properly exept that the cells in column 1 do not recognize the row headers in column 2

VoiceOver / Mac OSx 10.9.5: does not recognize the row headers for any cells

Testing complex tables with multiple levels of row headers using scope

Table 6: Use of th and scope with rowgroup for tables with multiple levels of row headers. First (empty) cell is a TD.

Results:

NVDA 2015.1 / Firefox 38: column headers read fine. column 1 row headers (Females and Males) do not read as headers for any of the rows. Females reads as a header for Males.

JAWS 15 / IE 11: good - but doesn't read "Female" on Betsy when arrowing up into the cell from the Male cells

VoiceOver / Mac OSx 10.9.5: totally messed up

Table 7: Use of th and scope with rowgroup for table with multiple rows of headers. First (empty) cell is a TH.

Results:

NVDA 2015.1 / Firefox 38: column headers read fine. column 1 row headers (Females and Males) do not read as headers for any of the rows. Females reads as a header for Males.

JAWS 15 / IE 11: good - but doesn't read "Female" on Betsy when arrowing up into the cell from the Male cells

VoiceOver / Mac OSx 10.9.5: column headers read fine. row headers are off: row 2 header= Females, row 3 header=Betsy, row 4 header=Males, row 5 header=Todd

Testing complex tables with multiple levels of column headers using scope

Table 8: Use of th and scope with colgroup for table with multiple levels of column headers. First (empty) cell is a TD.

Results:

NVDA 2015.1 / Firefox 38: Males reads as header for Matt and Todd, but Females does not read as a header for Mary or Betsy

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: totally messed up

Table 9: Use of th and scope with colgroup for table with multiple levels of column headers. First (empty) cell is a TH.

Results:

NVDA 2015.1 / Firefox 38: good

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: ignores the second header row (Mary, Betsy, Matt, Todd)

Testing complex tables with multiple levels of row headers using ID and headers

Table 10: Use of id and headers for a table with multiple levels of row headers. First (empty) cell is a TD.

Results:

NVDA 2015.1 / Firefox 38: very inconsistent, most headers are not spoken, those that are spoken are correct.

JAWS 15 / IE 11: good - but doesn't read "Female" on Betsy when arrowing up into the cell from the Male cells

VoiceOver / Mac OSx 10.9.5: totally messed up

Table 11a: Use of id and headers for a table with multiple levels of row headers. First (empty) cell is a TH.

Results:

NVDA 2015.1 / Firefox 38: very inconsistent, most headers are not spoken, those that are spoken are correct.

JAWS 15 / IE 11: good - but doesn't read "Female" on Betsy when arrowing up into the cell from the Male cells

VoiceOver / Mac OSx 10.9.5: column headers read fine. row headers are off: row 2 header= Females, row 3 header=Betsy, row 4 header=Males, row 5 header=Todd

Table 11b: Use of id and headers for a table with multiple levels of row headers. Non empty first cell.

Results:

NVDA 2015.1 / Firefox 38: very inconsistent, many headers are not spoken, those that are spoken are correct.

JAWS 15 / IE 11: good - but doesn't read "Female" on Betsy when arrowing up into the cell from the Male cells

VoiceOver / Mac OSx 10.9.5: column headers read fine. row headers are off: row 2 header= Females, row 3 header=Betsy, row 4 header=Males, row 5 header=Todd

Testing complex tables with multiple levels of column headers using ID and headers

Table 12: Use of id and headers for a table with multiple levels of column of headers. First (empty) cell is a TD.

Results:

NVDA 2015.1 / Firefox 38: very inconsistent, many headers are not spoken, those that are spoken are correct.

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: totally messed up

Table 13a: Use of id and headers for a table with multiple levels of column of headers. First (empty) cell is a TH.

Results:

NVDA 2015.1 / Firefox 38: very inconsistent, many headers are not spoken, those that are spoken are correct.

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: ignores the second header row (Mary, Betsy, Matt, Todd)

Table 13b: Use of id and headers for a table with multiple levels of column of headers. Non empty first cell.

Results:

NVDA 2015.1 / Firefox 38: very inconsistent, many headers are not spoken, those that are spoken are correct.

JAWS 15 / IE 11: good

VoiceOver / Mac OSx 10.9.5: ignores the second header row (Mary, Betsy, Matt, Todd)