|
|||||||||||||||||||||||||||
|
In order to make accessible tables, one must first understand the difference between layout tables and information tables. Layout tables do not need, and should not have extra markup. Layout tables are simply ways to organize information on a web page. The buttons to the right are an example of a layout table. The buttons were placed in a table so they could be located on right side of the screen. Information tables list information by columns and rows. Whereas a sighted person can see the relationship between the columns and rows, a screen reader (e.g. JAWS) user is sort of looking through a soda straw. Unless proper HTML markup is used, screen reader users probably won't be able to make sense out of the table. Below is an example of an information table. Note the relationship between columns and rows.
source code for more accessible table Below is an example of an inaccessible table-- do not do this. It is not marked up with table header or scope tags. Except for the bold column and row headings, a sighted person might not see the difference, but a JAWS (screen reader) user may have a very difficult time understanding the information.
Unfortunately most WYSIWYG HTMLcreator software (FrontPage, Dreamweaver, etc.) doesn't allow you to create accessible tables without marking up the HTML source code. But as you can see from the source code, at least with a simple table, adding the proper HTML markup for accessibility is rather straightforward. For more information about creating accessible tables:
It is a good idea to check your page for accessibility before uploading it
|
|
||||||||||||||||||||||||||
http://hightech.redwoods.edu/accessibility