Example 5 - Rows Before Bros - screen readers can't handle tables with rowscope


Assistive technology support for complex tables is inconsistent; sometimes even broken. This problem is particularly pertinent when tables contain header cells that span multiple rows.


Your joint credit Card summary
Name of card holder Credit Card number Balance Due Date Actions
Daisy Domergue xxx0088 $1633 02/05/2016
xxxx9004 02/02/2016 $1558
Dufus Domergue xxx.9889 $5590 01/30/2016
xxx.7709 $6550 01/31/2016
xxx.9900 $0 02/28/2016


Support for headers that span multiple rows has been absent in most if not all screen readers, despite being part of the html specification for years. This makes it difficult for screen reader users to perceive the data relationship within tables where a header cell spans multiple rows. Workarounds are possible but non-trivial. The bullet proof solution is to split a complex table into 2 or more simple tables and avoid rowheader cells that span more than a single row, but that requires a visual re-design of the webpage, which is costly and can disrupt other users. It is also possible to explicitly associate header cells with individual table cells using headers/id method or aria-describedby, but that requires the developer to associate header cells with every cell in the table, because these methods do not compliment regular header cell markup.


A blind customer calls your bank in a frenzy because their credit card balance is overdue and they received penalties. The customer claimed that they were confused and accidentally paid their spouse's credit card instead of their own, because they misinterpreted the credit card statement table.


Whose Line Is It Anyway?