Coding Tables with the Scope Attribute

Most of my time is spent retrofitting existing websites, rather than creating accessible websites from scratch. It appears to be a common practice of developers to place the column headings of a data table in TD tags, instead of the TH tags. Section 508 (g) states: (g) Row and column headers shall be identified for data tables. WCAG Guideline 5.1 states "For data tables, identify row and column headers. [Priority 1] "

My usual technique for making a data table accessible is converting the existing TD in a table column or row heading to a TH. The TH tag has a different default style from the TD: the text becomes centered and bolded. If the organization has never done accessibility coding before, the chances are excellent that the TH style isn't defined in the stylesheet and this new appearance of the data table doesn't match their design at best, and at worst is glaringly ugly.

While adding a new tag definition to a stylesheet can be simple, depending on the size of the enterprise and the politics of changing a stylesheet, it can also be a nightmare that requires weeks of intense negotiation. Wouldn't it be nice to have a way to code the table so the screen readers appropriately read the headings while avoiding the stylesheet change?

I was browsing the Freedom Scientific site late last week doing some research on complex tables for some new developer tools and ran across an alternate way of coding the tables bypasses the stylesheet change. Freedom Scientific uses the attribute scope="row" in the TD tag in their source code for the HTML Challenge for tables. I set up some tests myself, and it works in JAWS. No stylesheet change.

For more details, see the article at Enterprise Accessibility

For more information: http://www.EnterpriseAccessibility.com/articles/TricksUsingScope.html