aktualisiert: 18.7. 2007

Layouttabellen

1. Professionelle WebdesignerInnen kommen mittlerweile ohne Tabellen fürs Layout aus.
2. Sie schwören auf reine CSS Layouts und halten Tabellenlayouts für veraltet und unprofessionell.
3. Die Vorteile sind größere semantische Korrektheit, weniger und übersichtlicherer Quellcode und flexiblere Ausgabemöglichkeiten.
4. Tabellenlayouts sind zugegebenermaßen, wenn mans gewöhnt ist, schneller und einfacher als komplexe CSS Layouts, innerhalb von float Layouts sind Layouttabellen manchmal auch sicherer und einfacher als weitere float Konstruktionen.
5. Tabellen werden auch bei HTML Newslettern noch angeraten, weil die gängigen E-Mail Programme sehr unterschiedliche CSS Unterstützung haben.
6. Layouttabellen sind zugänglich mit Screen-Readern und anderen assistiven Technologien, wenn sie linear, d.h Zeile für Zeile, Zelle für Zelle lesbar sind.
7. Das kann man z.b. überprüfen mit dem Webformator, mit der Webdeveloper Toolbar im Firefox oder im Opera unter Seitendarstellung / Tabellen deaktivieren.
8. Layouttabellen sind in den WCAG 1.0 und auch in WCAG 2.0 nicht verboten, werden aber für neue Webseiten nicht empfohlen.
9. Probleme bereiten Layouttabellen Screen-Reader Usern, wenn sie sehr verschachtelt sind,
10. …wenn es innerhalb der Tabellen keinen ansteuerbaren Markup gibt (wie Absätze, Überschriften, Listen),
11. …wenn es zusätzlich komplexe Datentabellen gibt.
12. Laut einem Kommentar in der WCAG 2.0 Entwurfsversion (Kommentar LC-674) dürften Layouttabellen nicht mehr als 4 Ebenen verschachtelt sein (finde ich kurios) und nicht mehr als 4 Zeilen oder 4 Spalten haben. Eine offizielle Empfehlung gibt es dazu nicht, weil die Verwendung von Layouttabellen nicht mehr gefördert werden soll.
13. Layouttabellen dürfen keine Strukturelemente für Datentabellen enthalten (wie th, caption, headers, scope, summary)
14. Die Barrierefreiheit von Content Management Systemen misst sich u.a. auch am standardkonformen Output ohne Tabellen.
15. Blog Systeme wie Wordpress sind hier Vorreiter.
16. Bei Typo3 ermöglicht die Extension “CSS styled Content” die tabellenlose Einbindung von Bildern, teilweise sind auch Anpassungen in Extension Templates (z.B. für News oder Suche) oder durch Überschreiben vom Standardcode in Typoscript nötig.
17. Die Einbindung einzelner Module mittels Tabellen in Joomla kann durch Änderungen im Core-Code oder mithilfe des “tJ Accessibility Patches” korrigiert werden.

Datentabellen

1. Datentabellen benötigen zumindestens table headers (th).
2. Wenn Datentabellen umfangreich und komplexer sind, brauchen sie auch thead, tfoot, tbody, col, colgroup und die Attribute für Tabellenzellen scope oder headers.
3. Wenn nicht aus dem Kontext bereits ganz klar ist, was sie beinhalten, auch caption und summary.
4. Screen-Reader haben einen Tabellenlesemodus, der diese Strukturinformationen ausliest.
5. Durch scope oder headers mit id wird eine exakte Zuordnung von Spalten- und Zeilenüberschriften zu einzelnen Inhaltszellen gegeben (das ist wichtig, um den Überblick zu bewahren, weil eine Braille-Zeile nur eine geringe Anzahl von Zeichen auf einmal darstellt).
6. Beispiele für Datentabellen gibt es auf der W3C Seite.

Allgemeines

1. Tabellen sollen keine fixen Größenwerte im HTML Code beinhalten.
2. Fixe Größenangaben - besonders im HTML Code - sind schlecht für User mit Sehbehinderung, die sich ihre Bildschirmanzeige umstellen, z.b. auf Kontrastmodus mit schwarzem Hintergrund und größerer Schrift.
3. Ausprobieren kann man das unter Windows u.a. unter Systemsteuerung / Eingabehilfen / Anzeige.