Table Accessibility

Physics Classroom strives to make using tables easily usable for all users and devices. We have employed several features in our new tables to make this possible. Please note that we still have a lot of legacy content that needs to be rebuilt, the most impacting of which is our Tutorials section. These will be rebuilt as time goes on.

Role and Aria Tagging

Our tables are constructed of div elements with proper role and aria tagging. As follows:

• roles of table, rowgroup, row, columnheader, and cell are properly set.
• aria-rowindex and aria-colindex are properly assigned the right values to give the screen reader context of which row and column you are on.
• Column heading text is included so screen readers read out the column heading value as the user navigates through a row's columns.

Mobile Friendly

Our tables are also mobile friendly, and when the screen reaches the mobile width, the rows convert to columns. The column headings are shown in line with the cells themselves, and the rows are separated by alternating color visually. This makes the table data usable on desktop and mobile devices.

Screen Reader Quicksearch

Some of our reference tables that contain many lines (more than 20) often will have a screen-reader searchable hidden field that will allow users to use their screen reader's built in search to find content, and those that do will contain instructions on how to search them efficiently.

Please note that these hidden search values do not seem to work well with Chrome Vox. It is recommended that students that depend on screen reader tools to leverage a Windows machine with NVDA for this feature, or an IOS device using VoiceOver. JAWS may also work.