Tables have a bad rep in HTML programming. For years they were misused for page layouts. Tables are meant for displaying tabular data. Let's look at how you can build some complex data tables that are also accessible.
While tables are easy to understand visually, we need to give screen reader users a bit more structure to give the data cells more context. A poorly written table will appear to the screen reader user as a series of data points and no reference to what they mean. We'll use the scope and headers attributes to add these contextual hooks.
Some of the code in this page was borrowed from the NVDA user guide.
Scope attribute connects data and title
is used in the top row of a data table or as the first cell of a row. Add the scope="row|col" attribute to define if the table header cell references data vertically or horizontally.
Dept. Code/ Class Number Read More »from Accessible Data Tables