s Guías Prácticas de Código Accesible
Escudo de la República de Colombia

Tablas Irregulares

Tabla con dos encabezados de nivel
Ejemplo:
Juan Pepito
Peso (Kilos) Estatura (Metros) Peso Estatura (Metros)
10 años 50 1,55 1,40 1,35
20 años 70 1,68 65 1,75
Fragmento de Código:
<table>
  <col>
  <colgroup span="2"></colgroup>
  <colgroup span="2"></colgroup>
  <tr>
    <td rowspan="2"></td>
    <th colspan="2" scope="colgroup">Juan</th>
    <th colspan="2" scope="colgroup">Pepito</th>
  </tr>
  <tr>
    <th scope="col">Peso (Kilos)</th>
    <th scope="col">Estatura (Metros)</th>
    <th scope="col">Peso (Kilos)</th>
    <th scope="col">Estatura (Metros)</th>
  </tr>
  <tr>
    <th scope="row">10 años</th>
    <td>50</td>
    <td>1,55</td>
    <td>1,40</td>
    <td>1,35</td>
  </tr>
  <tr>
    <th scope="row">20 años</th>
    <td>70</td>
    <td>1,68</td>
    <td>65</td>
    <td>1,75</td>
  </tr>
</table>

Tabla con encabezados que abarcan varias filas o columnas.
Ejemplo:
Servicios de impresión
Producto Tipo Tamaño Disponible
Fotos Fondo Blanco A2 A3 A4
Blanco y negro A1 A2 A3
A color A3 A4 A5
Impresiones Blanco y negro A1 A3 A4
A color A2 A3 A5
Fragmento de Código:
<table>
  <caption>
    Servicios de impresión
  </caption>
  <col>
  <col>
  <colgroup span="3"></colgroup>
  <thead>
    <tr>
      <th scope="col">Producto</th>
      <th scope="col">Tipo</th>
      <th colspan="3" scope="colgroup">Tamaño Disponible</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th rowspan="3" scope="rowgroup">Fotos</th>
      <th scope="row">Fondo Blanco</th>
      <td>A2</td>
      <td>A3</td>
      <td>A4</td>
    </tr>
    <tr>
      <th scope="row">Blanco y negro</th>
      <td>A1</td>
      <td>A2</td>
      <td>A3</td>
    </tr>
    <tr>
      <th scope="row">A color</th>
      <td>A3</td>
      <td>A4</td>
      <td>A5</td>
    </tr>
  </tbody>
  <tbody>
    <tr>
      <th rowspan="2" scope="rowgroup">Impresiones</th>
      <th scope="row">Blanco y negro</th>
      <td>A1</td>
      <td>A3</td>
      <td>A4</td>
    </tr>
    <tr>
      <th scope="row">A color</th>
      <td>A2</td>
      <td>A3</td>
      <td>A5</td>
    </tr>
  </tbody>
</table>