<table> where aria-describedby should be accessible description

← Return to main list

The purpose this test is to show the cascade order of how accessible descriptions are applied in the accessibility tree for the <table> element. The priority order from highest to lowest is:

1. If present, use aria-describedby value (as per the "Cat" example below).
2. Otherwise, if present, use title value.
3. If none of the above are provided, there is no accessible description.

This example should not be considered proper practice, and is for testing purposes only.

Example

Cat

Code

<table aria-describedby="a">
  <caption>Animals</caption>
  <thead>
    <tr>
      <th>Fishes</th>
      <th>Birds</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Snapper</td>
      <td>Starling</td>
    </tr>
    <tr>
      <td>Salmon</td>
      <td>Eagle</td>
    </tr>
  </tbody>
</table>
<p id="a">Cat</p>

Assistive technologies

← Return to main list