Tabellrubriker

Silktide kontrollerar att tabeller som presenterar data definierar rubrikceller. Rubriker talar om för personer som använder vad varje rad och kolumn betyder, något som seende läsare kan dra slutsatser om utifrån tabellens layout.

Tänk dig en tabell med efternamn och städer. Utan en rubrikrad kan ett värde som ”Washington” betyda vilket som – betydelsen blir tydlig först när kolumnerna har etiketter.

<!-- Problem: rubrikerna är vanliga celler och har därför ingen betydelse -->
<table>
  <tr>
    <td>Efternamn</td>
    <td>Stad</td>
  </tr>
  <tr>
    <td>Washington</td>
    <td>London</td>
  </tr>
</table>

Varför detta är viktigt

En går igenom en tabell en cell i taget. När rubriker är definierade kan den läsa upp den relevanta rubriken tillsammans med varje värde, så att ”London” läses som ”Stad: London”. Utan rubriker hör lyssnaren en naken ström av värden och måste memorera tabellens layout för att förstå dem – och för större tabeller är det i praktiken omöjligt.

Det räcker inte att göra den översta raden fet eller ge den en annan färg. Visuell formatering förmedlar ingen betydelse till hjälpmedelsteknik; det är bara den underliggande som gör det.

Så åtgärdar du problemet

Ändra varje rubrikcell från <td> till <th> och lägg till ett scope-attribut som anger om den är rubrik för en kolumn eller rad:

<!-- Åtgärdat: rubrikerna är riktiga rubrikceller -->
<table>
  <tr>
    <th scope="col">Efternamn</th>
    <th scope="col">Stad</th>
  </tr>
  <tr>
    <td>Washington</td>
    <td>London</td>
  </tr>
</table>

Om tabellen inte presenterar data utan endast används för att ordna sidan visuellt, lägg till role="presentation" i <table>-elementet så att hjälpmedelsteknik ignorerar dess struktur. Ännu bättre är att ersätta layouttabeller med CSS – de avråds starkt från i modern webbdesign.

Så testar Silktide detta

Hitta alla tabeller på varje sida.
Hoppa över tabeller som är markerade som visuella presentationer med role="presentation".
Hoppa över tabeller med endast en rad eller en kolumn, eftersom de sannolikt inte är datatabeller.
Rapportera varje återstående tabell som inte innehåller någon <th>-rubrikcell alls.

Felsökning

Min tabell har rubriker, men de är formaterade `<td>`-celler

Celler som bara ser ut som rubriker räknas inte. Hjälpmedelsteknik kan inte se teckensnitt eller färger; konvertera cellerna till <th>.

Min layouttabell flaggas

Silktide hoppar endast över layouttabeller som anger role="presentation". Om en tabell verkligen endast används för visuell presentation lägger du till attributet – eller ersätter tabellen med CSS-layout.