Section 508 checkpoint applies to data tables, and not layout tables commonly used in HTML design. WCAG 5.3 discourages the use of layout tables. Tables used strictly for layout purposes do not have header rows or columns. Screen readers read information across tables in a linear way thereby making it difficult to understand information contained in tables. Without proper coding, large data tables would be unreadable.
Method:
Use <th> tags around cells for table headings.
<table>
<tr>
<th>Type of Meat</th>
<th>First Name</th>
<th>Second Name</th>
</tr>
<tr>
<td>Bologna</td>
<td>Oscar</td>
<td>Meyer</td>
</tr>
</table>
Another way to provide accessibility is to add in the “scope” attribute in the table heading.
<table>
<tr>
<th scope=“col”>Type of Meat</th>
<th scope=“col”>First Name</th>
<th scope=“col”>Second Name</th>
</tr>
<tr>
<td scope=“row”>Bologna</td>
<td>Oscar</td>
<td>Meyer</td>
</tr>
</table>
