W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > October to December 2003

Tables & Anchors Question

From: Scott Rippon <Scott.Rippon@arts.monash.edu.au>
Date: Wed, 22 Oct 2003 11:42:40 +1000
To: w3c-wai-ig@w3.org
Message-id: <3F95E090.EE02B6B0@arts.monash.edu.au>
Dear Friends

Does the location of an anchor within a table affect how it is read by a
screen reader?  When I code tables using Dreamweaver MX 6.1 (WYSIWYG
workspace) the anchor is placed within the tables caption like this:

<table border="1" cellspacing="0"
 summary="This table (table 1) contains 4 columns and 3 rows.">
  <caption><a name="table1"></a>Table 1</caption>
  ...

My concern is that when a user reads the page via a screen reader when
they click a link to jump to a table the table summary will be skipped. 
How do screen readers handle this?  When adding an anchor should I place
it before the table like this?

<a name="table1"></a>
<table border="1" cellspacing="0"
 summary="This table (table 1) contains 4 columns and 3 rows.">
  <caption>Table 1</caption>
  ...

I marked up and validated the below example and found it was valid HTML
4.01 Transitional code and also valid XHTML 1.1 code (replaced "name"
attribute with "id").

<ul>
  <li><a href="#table1">Table 1</a></li>
  <li><a href="#table2">Table 2</a></li>
  <li><a href="#table3">Table 3</a></li>
</ul>
<table border="1" cellspacing="0"
 summary="This table (table 1) contains 4 columns and 3 rows.">
  <caption><a name="table1"></a>Table 1</caption>
  <thead>
    <tr>
      <th scope="col"><p>C1R1</p></th>
      <th scope="col"><p>C2R1</p></th>
      <th scope="col"><p>C3R1</p></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><p>C1R2</p></td>
      <td><p>C2R2</p></td>
      <td><p>C3R2</p></td>
    </tr>
    <tr class="tblslat">
      <td><p>C1R3</p></td>
      <td><p>C2R3</p></td>
      <td><p>C3R3</p></td>
    </tr>
    <tr>
      <td><p>C1R4</p></td>
      <td><p>C2R4</p></td>
      <td><p>C3R4</p></td>
    </tr>
  </tbody>
</table>
<table border="1" cellspacing="0"
 summary="This table (table 2) contains 4 columns and 3 rows.">
  <caption><a name="table2"></a>Table 2</caption>
  <thead>
    <tr>
      <th scope="col"><p>C1R1</p></th>
      <th scope="col"><p>C2R1</p></th>
      <th scope="col"><p>C3R1</p></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><p>C1R2</p></td>
      <td><p>C2R2</p></td>
      <td><p>C3R2</p></td>
    </tr>
    <tr class="Tblslat">
      <td><p>C1R3</p></td>
      <td><p>C2R3</p></td>
      <td><p>C3R3</p></td>
    </tr>
    <tr>
      <td><p>C1R4</p></td>
      <td><p>C2R4</p></td>
      <td><p>C3R4</p></td>
    </tr>
  </tbody>
</table>
<table border="1" cellspacing="0"
 summary="This table (table 3) contains 4 columns and 3 rows.">
  <caption><a name="table3"></a>Table 3</caption>
  <thead>
    <tr>
      <th scope="col"><p>C1R1</p></th>
      <th scope="col"><p>C2R1</p></th>
      <th scope="col"><p>C3R1</p></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><p>C1R2</p></td>
      <td><p>C2R2</p></td>
      <td><p>C3R2</p></td>
    </tr>
    <tr class="Tblslat">
      <td><p>C1R3</p></td>
      <td><p>C2R3</p></td>
      <td><p>C3R3</p></td>
    </tr>
    <tr>
      <td><p>C1R4</p></td>
      <td><p>C2R4</p></td>
      <td><p>C3R4</p></td>
    </tr>
  </tbody>
</table>

Kind regards,
Scott Rippon.

Received on Tuesday, 21 October 2003 21:42:50 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 19 July 2011 18:14:12 GMT