Eine Preisliste mit sauber untereinander stehenden Zahlen, feinen Linien dazwischen, alles ordentlich ausgerichtet: Am Bildschirm ist auf einen Blick klar, welcher Preis zu welchem Paket gehört. Beim Vorlesen bleibt von dieser Ordnung nichts übrig.
Eine Tabelle ist eines der stärksten Werkzeuge, um Daten begreifbar zu machen. Sie kann aber genauso gut zur Falle werden, wenn niemand mehr erkennt, welche Zahl in welche Zeile und Spalte gehört. Woran der Unterschied hängt und was Du dafür einforderst, schauen wir uns hier an.
Wann eine Tabelle das richtige Mittel ist
Eine Tabelle gehört überall dorthin, wo echte Daten in Zeilen und Spalten zusammenhängen. Preise je Paket, Öffnungszeiten je Wochentag, technische Werte je Produkt: Das sind Fälle, in denen jede Zahl erst durch ihre Position Bedeutung gewinnt. „19 Euro" allein sagt nichts, „19 Euro für das Basis-Paket pro Monat" sagt alles.
Schwierig wird es, wenn eine Tabelle nur das Layout zusammenhalten soll. Manche Seiten zwängen Bilder, Texte oder ganze Kacheln in ein unsichtbares Tabellengitter, bloß damit alles ordentlich nebeneinander sitzt. Für das Auge wirkt das ruhig, beim Vorlesen entsteht Chaos, weil die Software echte Daten erwartet und nur zusammenhanglose Bruchstücke vorfindet.
Die Faustregel ist einfach. Echte Daten, die sich sinnvoll in Zeilen und Spalten ordnen, gehören in eine Tabelle. Alles, was nur nebeneinander stehen soll, regelt man über das Layout, nicht über eine Tabelle. Diese Unterscheidung musst Du nicht selbst bauen, aber Du solltest sie benennen können.
Was eine zugängliche Tabelle ausmacht
Das wichtigste Merkmal ist eine klare Kopfzeile. Die oberste Reihe sagt, was in jeder Spalte steht, und bei Bedarf benennt die erste Spalte zusätzlich, worum es in jeder Zeile geht. Diese Köpfe sind der Anker, an dem später jede einzelne Zahl ihre Bedeutung zurückbekommt.
Dazu gehört eine kurze Überschrift oder Beschriftung über der Tabelle, die sagt, was hier eigentlich aufgelistet wird. „Preise und Leistungen im Vergleich" reicht schon. So weiß jeder Besucher sofort, worauf er blickt, statt sich den Zusammenhang aus den Zahlen selbst erschließen zu müssen.
Und schließlich zählt eine einfache Struktur. Eine gute Tabelle hat eine Kopfzeile und darunter saubere Datenzeilen, fertig. Verschachtelte Mega-Tabellen mit Zellen, die über mehrere Spalten verschmelzen, oder Tabellen in Tabellen sind selbst für sehende Leser anstrengend und beim Vorlesen kaum noch zu entwirren.
Wie ein Screenreader eine Tabelle vorliest
Ein Screenreader liest nicht, was Du siehst, sondern wie eine Seite aufgebaut ist. Bei einer sauber ausgezeichneten Tabelle nennt er zu jeder Zelle den passenden Kopf mit. Statt nacktem „59" hört der Nutzer „Profi-Paket, Preis pro Monat, 59 Euro". Die Position auf dem Bildschirm wird so durch gesprochenen Kontext ersetzt.
Fehlt die Kopfzeile, fällt genau dieser Kontext weg. Dann liest die Software nur noch eine endlose Reihe von Werten vor: „Basis, 19, ja, nein, Profi, 59, ja, ja". Ohne die Köpfe muss der Hörer im Kopf mitzählen, an welcher Stelle er gerade ist. Bei drei Spalten geht das vielleicht noch, bei acht wird es zu reinem Zahlensalat.
Dieselbe Struktur, die einem blinden Menschen Orientierung gibt, hilft übrigens auch der Suchmaschine, den Zusammenhang der Daten zu verstehen. Das ist dasselbe Prinzip, das hinter einer Seite steht, die sich überhaupt sauber vorlesen lässt wie ein gegliedertes Dokument: Ordnung nützt allen Lesern zugleich.
Tabellen am Handy
Auf dem kleinen Bildschirm zeigt sich schnell, ob eine Tabelle solide gebaut ist. Eine breite Preistabelle mit sechs Spalten passt schlicht nicht auf ein Handy. Die Frage ist nur, was die Seite in diesem Moment tut.
Der schlechte Weg ist, alles winzig zusammenzuquetschen, bis die Schrift unlesbar wird, oder die Tabelle einfach rechts abzuschneiden, sodass die hinteren Spalten unsichtbar verschwinden. In beiden Fällen geht Information verloren, ohne dass der Besucher es überhaupt merkt.
Der gute Weg lässt die Tabelle entweder kontrolliert seitlich scrollen, sodass man sie als Ganzes durchwischen kann, oder bricht sie in einzelne Blöcke um, bei denen jeder Wert seine Beschriftung behält. Dass Inhalte beim Vergrößern sauber umbrechen statt zu zerbrechen, ist genau die Logik, die auch hinter einer Seite steht, die beim Zoomen mitwächst.
Woran Du eine schlechte Tabelle erkennst
Du musst keinen Quelltext lesen, um die gröbsten Probleme zu sehen. Drei sichtbare Merkmale verraten Dir schon viel.
- Die Kopfzeile: Gibt es eine klar abgesetzte oberste Reihe, die jede Spalte benennt, oder stehen einfach Zahlen ohne Beschriftung im Raster?
- Das Verhalten am Handy: Bleibt die Tabelle lesbar, oder wird sie winzig gequetscht und rechts abgeschnitten?
- Die Verschachtelung: Liest sich die Tabelle als einfache Liste von Zeilen, oder ist sie ein Labyrinth aus verschmolzenen Zellen und Untertabellen?
Wenn Dir hier etwas auffällt, hast Du schon das Wichtigste in der Hand. Du brauchst die Lösung nicht selbst zu kennen, Du musst nur benennen können, was nicht stimmt.
Was Du von Deiner Agentur verlangst
Du musst die Technik nicht beherrschen, aber Du darfst sie einfordern. Ein klarer Satz genügt: Jede Datentabelle braucht eine ausgezeichnete Kopfzeile, eine kurze Beschriftung darüber und ein sauberes Verhalten auf dem Handy, ohne abgeschnittene Spalten.
Als Abnahme-Kriterium hilft ein einfacher Test. Lass Dir eine Tabelle einmal mit eingeschaltetem Screenreader vorführen, etwa als kurze Bildschirmaufnahme. Hörst Du zu jeder Zahl den passenden Kopf, sitzt die Struktur. Hörst Du nur eine Reihe nackter Werte, fehlt die Auszeichnung.
Sprich das Thema früh an, am besten vor dem Bau. Eine Tabelle von Anfang an sauber anzulegen kostet kaum Mehraufwand. Sie nachträglich auseinanderzunehmen und neu aufzubauen, wenn die Seite schon steht, wird deutlich teurer.
Fazit
Eine barrierefreie Tabelle verlangt von Dir kein Spezialwissen. Sie hängt an drei Dingen: einer klaren Kopfzeile, die jede Zahl benennt, einer einfachen Struktur ohne verschachtelte Zellen und einem sauberen Verhalten am Handy. Damit liest sich dieselbe Tabelle für das Auge, für den Screenreader und für die Suchmaschine gleichermaßen verständlich.
Schau Dir Deine eigenen Tabellen einmal mit diesem Blick an, dann erkennst Du schnell, wo eine Kopfzeile fehlt oder eine Tabelle am Handy abreißt. Wie sich dieser Baustein ins größere Bild fügt, zeigt der Überblick über die vier WCAG-Prinzipien.