Usable Tables4.2.2008 - Pavel Růžička [MCPD]Product Development Department
Define headers of rows andcolumns The T H element defines a cell that contains header  information Correct using ofT H e...
Scope of header cell• use attributte s c o p e with row or col value• it specifies the set of data cells for which the cur...
Summary of table Use attribute summary This attribute provides a summary of the tables purpose  and structure for user a...
a b b r attribute should be used to provide an abbreviated form of the cells content<tr>  <th scope="row" abbr="Množství ...
Don’t use tables for layout! Tables should be used only for structured data – not  for layout! Don’t use headers if you ...
Complicated nested tables• http://www.w3.org/WAI/wcag-curric/sam45-0.htm                                                  ...
Table in audio applications                                  84.2.2008 - Pavel Růžička [MCPD]Product Development Department
Upcoming SlideShare
Loading in …5
×

Usable tables in HTML, VXML

1,012 views
889 views

Published on

How to make tables in your HTML and/or VXML application usable, readable for blind users

Published in: Technology, Health & Medicine
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,012
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Usable tables in HTML, VXML

  1. 1. Usable Tables4.2.2008 - Pavel Růžička [MCPD]Product Development Department
  2. 2. Define headers of rows andcolumns The T H element defines a cell that contains header information Correct using ofT H elements causes, that table can be easily readed by the rows and by the columns<thead> <tr> <td>&nbsp;</td> <th>Leden</th> <th>Únor</th> <th>Březen</th> </tr></thead><tbody> <tr> <th>Jablka</th> <td>100</td> <td>125</td> <td>80</td> </tr></tbody> 24.2.2008 - Pavel Růžička [MCPD]Product Development Department
  3. 3. Scope of header cell• use attributte s c o p e with row or col value• it specifies the set of data cells for which the current header cell provides header information<thead> <tr> <td>&nbsp;</td> <th scope="col">Leden</th> <th scope="col">Únor</th> <th scope="col">Březen</th> </tr></thead><tbody> <tr> <th scope="row">Jablka</th> <td>100</td> <td>125</td> <td>80</td> </tr></tbody> 34.2.2008 - Pavel Růžička [MCPD]Product Development Department
  4. 4. Summary of table Use attribute summary This attribute provides a summary of the tables purpose and structure for user agents rendering to non-visual media such as speech and Braille.<table summary="Přehled cen jablek, hrušek a švestek za 1.Q roku"> 44.2.2008 - Pavel Růžička [MCPD]Product Development Department
  5. 5. a b b r attribute should be used to provide an abbreviated form of the cells content<tr> <th scope="row" abbr="Množství jablek">Jablka</th> <td>100</td> <td>125</td> <td>80</td></tr> may be rendered by user agents when appropriate in place of the cells content names should be short since user agents may render them repeatedly speech synthesizers may render the abbreviated headers relating to a particular cell before rendering that cells content. 54.2.2008 - Pavel Růžička [MCPD]Product Development Department
  6. 6. Don’t use tables for layout! Tables should be used only for structured data – not for layout! Don’t use headers if you do it! Use <div> elements and CSS for layout rather using tables 64.2.2008 - Pavel Růžička [MCPD]Product Development Department
  7. 7. Complicated nested tables• http://www.w3.org/WAI/wcag-curric/sam45-0.htm 74.2.2008 - Pavel Růžička [MCPD]Product Development Department
  8. 8. Table in audio applications 84.2.2008 - Pavel Růžička [MCPD]Product Development Department

×