Better support for screen readers. This increases the accessibility of tables to visually impaired users.
Checklist when submitting a final (!draft) PR
[x] Commits are tidied up, squashed if needed and follow guidelines in CONTRIBUTING.md
[ ] Code builds
[ ] All existing tests pass
[x] All new critical code is covered by tests
[ ] PR is linked to the relevant issue(s)
[x] Rebased with the target branch
Reasoning
Associating <table> headers, i.e. <th> elements, with their <td> cells enables screen readers to announce the header prior to the data. This considerably increases the accessibility of tables to visually impaired users.
There are two ways of doing it:
Adding a scope attribute to <th> headers.
Adding an id attribute to <th> headers and a headers attribute to every <td> element.
It is recommended to add scope attributes to <th> headers whenever possible. Use <th id="..."> and <td headers="..."> only when <th scope="..."> is not capable of associating cells to their headers. This happens for very complex tables which have headers splitting the data in multiple subtables. See W3C WAI Web Accessibility Tutorials for more information.
The following changes are implemented
Add a 'scope' attribute to
Changes in the user interface:
Better support for screen readers. This increases the accessibility of tables to visually impaired users.
Checklist when submitting a final (!draft) PR
Reasoning
Associating
<table>
headers, i.e.<th>
elements, with their<td>
cells enables screen readers to announce the header prior to the data. This considerably increases the accessibility of tables to visually impaired users.There are two ways of doing it:
scope
attribute to<th>
headers.id
attribute to<th>
headers and a headers attribute to every<td>
element.It is recommended to add
scope
attributes to<th>
headers whenever possible. Use<th id="...">
and<td headers="...">
only when<th scope="...">
is not capable of associating cells to their headers. This happens for very complex tables which have headers splitting the data in multiple subtables. See W3C WAI Web Accessibility Tutorials for more information.Sounds reasonable, will check/merge