Hallo zusammen,
im Grunde genommen habe ich nur eine einfältige Frage und eine "optionale" Bitte.
Momentan verfasse ich zwei Artikel, welche sich mit Tabellen befassen. Der eine befasst sich mit zugänglichen Tabellen (Stichwort table linearization); ein kleines, verständliches und praxisnahes Kompendium, welches die Möglichkeiten von HTML (u.a. http://www.w3.org/TR/html401/struct/tables.html#h-11.4) und die durch die WCAG empfohlenen Praktiken aufzeigt (u.a. http://www.w3.org/Consortium/Offices/Germany/Trans/WAI/webinhalt.html#gl-table-markup).
Des weiteren befasst sich der zweite Artikel mit Tabellenformatierungen, welche mittels CSS zentralisiert werden können und somit die Wartung und spätere Änderungen und Erweiterungen vereinfacht werden und der Code flexibel an neue Formatvorlagen angepasst werden kann.
Meine Frage lautet demnach: Wie würdet ihr einfarbige, unschattierte Gitternetzlinien bzw. Zellen- & Tabellenrahmen interoperabel lösen? Und zwar einmal nur mit HTML-Elementen und -Attributen und einmal nur mit CSS-Eigenschaften oder besser CSS-Regelsätzen. Ein Beispiel sähe wie folgt aus (etwas großmaßig, aber nur 7KB schwer):
<img src="http://dj5nu.bei.t-online.de/fanhost/tabelle.png" border=0 alt="">
Während die CSS-Lösungsvarianten wohl eher alle eine Abwandlung der Regeln table {border-collapse:collapse; ...} und tr, td {border:Xpx solid #xxxxxx; ...} sind, sind mir eigentlich nur zwei HTML-Varianten bekannt, da ich diese selten bis nie benutze. Außerdem ist mir nicht bekannt, wie interoperabel diese sind, da sie wohl eher als Workarounds zu bezeichnen sind. Das sind zum einen die klassischen verschachtelte Tabellen (eine Tabelle in einer Tabelle) und zum anderen dasselbe mit *einer* Tabelle mit unterschiedlichen Tabellen- und Zellenhintergrundfarben. Möglicherweise sind euch noch weitere Lösungsvarianten bekannt.
Im Endeffekt möchte ich in meinem Artikel natürlich von *allen* HTML-Tabellenformatierungen abraten (border, cellspacing, cellpadding, bgcolor, background, font, width, height, ...) und aus oben genannten Gründen CSS empfehlen. Allein als Kompatibilitätsgründen sollte man nach Belieben einige Formatanweisungen doppelt angeben (border, cellpadding und mglw. cellspacing). Ich persönlich halte jedoch die Zeit für gekommen, "nahezu kompromisslos" für eine vollständige Trennung von Inhalt/Struktur und Präsentation einzustehen, zumindest bei der Planung umfangreicher Projekte, welche automatisch generierte Tabellen enthalten.
Dass Tabellen auch wirklich nur für aufeinander Bezug nehmende Daten genutzt werden, setze ich voraus. Trotzdem können selbst Layouttabellen durch konsequente CSS-Nutzung und Berücksichtigung der WCAG manche Tücken verlieren. Wenn es um CSS-Layout geht, hat die Kompatibilität sicherlich aufgrund der Verwendung mangelhafter Browser einen höheren Stellenwert als bei Tabellenformatierungen, deren Nichtunterstützung die Benutzbarkeit vergleichsweise wenig einschränkt. Nur standardkonforme Netzseiten können bspw. Microsoft dazu bringen, endlich border-spacing im IE zu implementieren.
Wer "Lust dazu hat" oder sich schon einmal mit Linearisierung von Tabellen beschäftigt hat, könnte obige Tabelle gemäß WCAG 5.1, 5.2, 5.5 und 5.6 auszeichnen, sodass sie sich einfach linearisieren lässt. (Es reicht, die Kopfzellen und beispielhaft eine Datenzeile auszuzeichnen.) Denn mir fallen immer mehrere Alternativmöglichkeiten ein; auch wenn diese Tabelle vergleichsweise relativ simpel ist, ist mir nicht immer klar, welche Lösung die optimalste ist, deshalb würde ich mich über Meinungen dazu freuen. Obige Tabelle habe ich schon angepasst, denn das Original von destatis.de war alles andere als linearisierungsfähig (wenn man mal zuviel Geld hat, sollte man die Autoren verklagen), obwohl mir die trennenden Leerzeichen bei Tausenderstellen immer noch Sorgen bereiten, genauso die römischen Zahlen. Hier einmal die reine Markup der Kopfzellen und der ersten Datenzeile:
<table>
<tr>
<th>Jahr</th>
<th>Quartal</th>
<th>Einwohner</th>
<th>Erwerbspersonen</th>
<th>Erwerbslose</th>
<th>Erwerbstätige</th>
<th>Arbeitnehmer</th>
<th>Selbständige</th>
</tr>
<tr>
<th>1998</th>
<th>I</th>
<td>82 038</td>
<td>41 009</td>
<td>4 145</td>
<td>36 864</td>
<td>32 895</td>
<td>3 969</td>
</tr>
</table>
Das komplette caption-Element und rowspan="4" bei <th>1998</th> habe ich gekürzt.
Vielen Dank für eure Hilfe.
Grüße,
Mathias