Does this page look plain and unstyled?

Tools, wizards, articles and tutorials on Web Accessibility for the conscientious web developer

Subscribe to Accessify's RSS Feed   

Accessible Table Builder

 

Simple table explanation

  • A simple table can have the first row as a set of headers and/or the first column as a set of headers.
  • The simple table uses the scope attribute with values of either col or row.
 

Complex table explanation

  • A complex table can have any number of rows as a set of headers and/or the first column as a set of headers.
  • The header rows must all be at the top with no data rows in-between.
  • The complex table uses the id and headers attributes with values appropriate to the data.
 

Common to both table types

  • Use , but not .
  • Can use the abbr to abbreviate the header name.
  • Styled with CSS to provide flexibility.
 

Blue table example

Oceana Airlines Dinner Service
Class of Service Salad Entree Dessert
Economy None Ham and Cheese Sandwich Packaged Cookies
Business Mixed Greens Chicken Satay or Beef Tips New York Style Cheesecake
First Caesar, Salad Nicoise, or Antipasto Salmon Basil Cr?me, Raspberry Balsamic Chicken, Boeuf En Daube Assorted Belgian Truffles
 

Grey table example

Oceana Airlines Dinner Service
Class of Service Salad Entree Dessert
Economy None Ham and Cheese Sandwich Packaged Cookies
Business Mixed Greens Chicken Satay or Beef Tips New York Style Cheesecake
First Caesar, Salad Nicoise, or Antipasto Salmon Basil Cr?me, Raspberry Balsamic Chicken, Boeuf En Daube Assorted Belgian Truffles

Acknowledgements to Jim Thatcher and aciello, Michael G. Web Accessibility for People with Disabilities. Lawrence, Kansas: CMP Books, 2000) for the data in the tables.



This page is styled using Cascading Style Sheets (CSS). If you can read this message, the chances are that your browser does not properly support CSS or you have disabled this yourself. The content on this site is perfectly readable without style sheets, though; it just doesn't look quite so fancy.

site statistics

This site is partnered with MIS Web Design and Top4Office for Copiers and Digipro for Photocopiers. Web design by Swindon Internet & PR Services.

How you can help support this site: Learn web design from the creator of this site, or help him by requesting some PR Photography