Skapa tillgängliga tabeller

Det är viktigt att vi tar fram tabeller på korrekt sätt för att de ska bli tillgängliga. Om du gör på rätt sätt kommer skärmläsare att läsa upp tabellrubriken om användaren väljer att byta kolumn eller rad och på så vis får hen alltid en kontext till värdet som läses upp.

Mer komplexa tabeller ska märkas upp på andra sätt men det finns inte stöd för det i editorn utan får göras manuellt i HTML-läge - vilket inte känns som ett rimligt alternativ.

Alla övriga inställningar, förutom möjligtvis att justera de olika cellernas storlek är ju främst utseendemässiga och här vill vi ju styra detta centralt. Alla tabeller som man skapar i editorn blir automatiskt scrollbara på mobil så man behöver inte som redaktör tänka på det.

Vi ska inte använda färg i tabellerna eftersom färgernas betydelse inte kommer att framgå för personer som använder skärmläsare.

Generellt för tabeller, om man bortser från teknisk tillgänglighet, så är det viktigt att man faktiskt använder dem vid rätt tillfällen och för rätt ändamål.


Vilken sort tabeller kan vi göra tillgängliga på goteborg.se?
I WCM:s texteditor kan vi göra följande enkla tabeller tillgängliga:

Exempel 1


Exempel 2


Textjustering för att öka läsbarheten i tabeller

Fyra enkla riktlinjer att följa:

1. Numerisk data ska vara högerställd
2. Textdata ska vara vänsterställd
3. Rubriker ska ha samma justering som datan i kolumnen nedan
4. Använd aldrig centrerad

Skapar du tabellen från början väljer du talbellverktyget under +-teckenet i verktygsmenyn.
Markera om du vill ha rubriker horisontellt eller vertikalt. Då skapas rubrikformatet automatiskt.
Välj antalet rader och kolumner som tabellen ska ha medräknat kolumn-/radrubrikerna.

Du kan också skapa rubrikerna i efterhand genom att högerklicka och välja Ställ in som rubriker i Cellfältet.

En bra grundinställning när man skapar tabeller är att man väljer Bredd: 100%. Välj OK.
Har du bara lite information som inte tar mycket utrymme i bredd kan du istället välja Bildpunkter som enhet och prova dig fram till lämplig bredd. Då skriver du in px i stället för %.

Fyll i tabellbeskrivning för att tydliggöra tabellens syfte. Högerklicka på tabellen och välj Tabell/Egenskaper. Fyll i önskad beskrivning, den syns som den översta blå raden i bilden nedan.
I tillgänglighetskollen anges tabellbeskrivning som bildtext.