Websiteentwicklung: XHTML: Tabellen

Websiteentwicklung XHTML Tabellen

Tabellen dienen der Strukturierung von Daten in einer tabellarischen Form. Werden in XHTML also Elemente verwendet, die zur Auszeichnung von Tabellen gedacht sind, sind die darin enthaltenen Informationen automatisch miteinander korreliert.

Trotzdem wurden früher zur Zeit von HTML von vielen Autoren die Tabellenelemente fehlerhaft eingesetzt. Sie wurden zur Ausrichtung und Anordnung von nicht miteinander korrelierten Informationen verwendet, um Dokumente zu dekorieren. Vor der Einführung von CSS war dies die einzige Methode, um dies zu erreichen, daher ist der Mißbrauch nachvollziehbar, zeigt aber trotzdem, dass von diesen Autoren (X)HTML nicht verstanden wurde.

Zudem sind Tabellen in (X)HTML immer so darzustellen, dass die Korrelation der Daten darin gut verständlich ist. Ein Darstellungsprogramm soll gegebenenfalls also andere Angaben des Autors ignorieren, um eine gute Verstehbarkeit für den Leser zu gewährleisten. Damit ergibt sich bereits, dass eine definierte Anordnung von Inhalt (Layout) mit Tabellen nicht möglich ist, zudem kann die Darstellung zwischen Darstellungsprogrammen variieren, da diese für ihre jeweiligen Nutzer andere Möglichkeiten der optimierten Lesbarkeit von korrelierten Daten gefunden haben mögen.

Werden unkorrelierte Daten in Tabellen als korrelierte Daten notiert, fällt es bei Programmen mit nicht visueller Darstellung natürlich besonders schwer, die Darstellung zu verstehen, weil auch diese Programme versuchen werden, die (nicht vorhandene) Korrelation von Daten gut verständlich zu machen.

Somit sollten Tabellen also nur dafür verwendet werden, um korrelierte Daten korrekt und verständlich darzustellen. Typische Anwendungen aus dem Alltag wären zum Beispiel Stundenpläne, Fahrpläne, Statistiken mit mehreren Variablen. Zur besseren Verständlichkeit gibt es zudem spezielle Strukturen wie Tabellenbeschriftungen und -Zusammenfassungen, Kopfzellen. Bei einer korrekten Anwendung einer Tabelle wird man automatisch das Bedürfnis haben, diese Strukturen häufig zu verwenden. Anders herum, kann man mit diesen Strukturen nichts anfangen, ist dies ein deutliches Indiz, dass es sich wohl um keine Anwendung für Tabellenelemente handelt.

Hinsichtlich eines sinnvollen Layouts wie auch der optischen Gestaltung von Tabellen sei auf CSS verwiesen. Um die Lesbarkeit von Tabelleninhalten zu optimieren, verfügt XHTML über diesbezügliche Grundfunktionen, allerdings nicht im Umfange einer freien, dekorativen Gestaltung einer Tabelle. Bitte lesen Sie für Dekorations- und Layoutfragen die entsprechenden Kapitel im Wikibook: CSS.

Grundgerüst einer Tabelle

Zur Umsetzung von Tabellen sind mindestens vier Elemente notwendig. table (deutsch: Tabelle) dient zur Einleitung der Tabelle. tr definiert eine neue Tabellenzeile für mehrere Tabellenzellen. Mit th (englisch: table header, deutsch: Tabellenkopf) kann man Zellen mit Kopfinformationen füllen und mit td (englisch: table data, deutsch: Tabellendaten) wird eine neue Tabellenzelle erzeugt, die Daten enthält. In dieser Reihenfolge müssen die Elemente auch ineinander verschachtelt werden.

Ein sehr einfaches Beispiel ist folgendes:

<table>
    <tr>
        <th>Überschrift, 1. Spalte</th>
        <th>Überschrift, 2. Spalte</th>
        <th>Überschrift, 3. Spalte</th>
    </tr>
    <tr>
        <td>1. Zeile, 1. Spalte</td>
        <td>1. Zeile, 2. Spalte</td>
        <td>1. Zeile, 3. Spalte</td>
    </tr>
    <tr>
        <td>2. Zeile, 1. Spalte</td>
        <td>2. Zeile, 2. Spalte</td>
        <td>2. Zeile, 3. Spalte</td>
    </tr>
    <tr>
        <td>3. Zeile, 1. Spalte</td>
        <td>3. Zeile, 2. Spalte</td>
        <td>3. Zeile, 3. Spalte</td>
    </tr>
</table>

Überschrift, 1. Spalte	Überschrift, 2. Spalte	Überschrift, 3. Spalte
1. Zeile, 1. Spalte	1. Zeile, 2. Spalte	1. Zeile, 3. Spalte
2. Zeile, 1. Spalte	2. Zeile, 2. Spalte	2. Zeile, 3. Spalte
3. Zeile, 1. Spalte	3. Zeile, 2. Spalte	3. Zeile, 3. Spalte

Element table

Das Element table ist ein Blockelement. Der Inhalt ist für dieses Element spezifisch.

Das Element kann optional an erster Stelle ein Element caption für eine Tabellenüberschrift enthalten. Im einfachen Modell können dann ein oder mehr Elemente tr notiert werden.

Alternativ kann ein strukturiertes Modell verwendet werden. Dann wird direkt in table kein tr notiert. Optional kann stattdessen genau ein thead für Kopfzeilen notiert werden und danach optional genau ein tfoot für Fußzeilen. Diesen folgt dann mindestens ein Element tbody für den eigentlichen Tabellenkörper.

Ferner gibt es die optionalen Elemente col und colgroup. Diese können zu Beginn, nach dem optionalen caption notiert werden, entweder ein oder mehrere Elemente col oder colgroup. Diese dienen dazu, die Struktur der Tabellen vor dem eigentlichen Datenbereich festzulegen. In dem Modell folgen danach dann entweder thead, tfoot, tbody oder nur tr.

table hat neben den allgemein verwendbaren einige Attribute, die spezifisch für dieses Element sind. Alle Attribute sind optional.

Attribut summary

Der Inhalt von summary ist einfacher interpretierter Text. Der Text gibt eine Zusammenfassung der Tabelleninformation an, also Zweck und Struktur, insbesondere um bei einer nicht visuellen Präsentation die Tabelleninformation besser verständlich zu machen.

Attribut width

Mit dem Attribut width kann die gewünschte Breite der Tabelle bei einer visuellen Darstellung festgelegt werden. Der Wert ist entweder eine Zahl, welche die Breite in Pixeln angibt oder ein Prozentwert wie 75%. Letzteres gibt dann an, dass der entsprechende Anteil der verfügbaren Breite des Elternelementes für die Tabelle verwendet werden soll, hier also 75%.

Im Sinne einer besser lesbaren Darstellung von Tabellen kann ein Darstellungsprogramm die Angabe auch ignorieren, falls der Inhalt in den Tabellenzellen nicht sinnvoll so angeordnet werden kann, dass die gewünschte Breite dafür ausreichend ist.

Ist das Attribut nicht angegeben, bestimmt das Darstellungsprogramm selbständig eine Breite, bei der der Inhalt gut darstellbar ist.

Attribut frame

Mit dem Attribut kann angegeben werden, zwischen welchen Teilen einer Tabelle bei visueller Darstellung Linien sichtbar sein sollen. Sichtbare Linien verbessern oft die Lesbarkeit von Tabellen.

Mögliche Werte sind:

void: Es wird kein Rahmen dargestellt, die Voreinstellung
border: Alle vier Seiten werden dargestellt
box: Alle vier Seiten werden dargestellt
above: Nur die obere Seite wird dargestellt
below: Nur die untere Seite wird dargestellt
hsides: Nur die obere und die untere Seite werden dargestellt
vsides: Nur die linke und die rechte Seite werden dargestellt
lhs: Nur die linke Seite wird dargestellt
rhs: Nur die rechte Seite wird dargestellt

Attribut rules

Mit dem Attribut kann angegeben werden, welche Linien zwischen den Zellen einer Tabelle bei visueller Darstellung sichtbar sein sollen. Sichtbare Linien verbessern oft die Lesbarkeit von Tabellen.

Mögliche Werte sind:

none: Es werden keine Linien dargestellt, die Voreinstellung
all: Es werden alle Linien dargestellt
groups: Linien werden zwischen Gruppen dargestellt. Dies gilt für Zeilengruppen mit thead, tfoot, tbody und Spaltengruppen mit col und colgroup
cols: Linien werden zwischen Spalten dargestellt
rows: Linien werden zwischen Zeilen dargestellt

Attribut border

Mit dem Attribut border kann angegeben werden, ob die Tabelle bei einer visuellen Darstellung einen sichtbaren Rahmen haben soll. Der Wert ist eine Zahl, welche die Rahmenbreite in Pixeln angibt. Ist das Attribut nicht angegeben, entspricht das effektiv einer Darstellung ohne Rahmen, also den Wert 0. Oft verbessert ein sichtbarer Rahmen die Lesbarkeit der Tabelleninformation bei visueller Darstellung.

Sofern frame oder rules nicht angegeben wurden, impliziert der Wert 0 frame='void', beziehungsweise rules='none', andere Werte implizieren dann frame='border', beziehungsweise rules='all'

Attribut cellspacing

Mit dem Attribut kann angegeben werden, wieviel Freiraum bei einer visuellen Darstellung zwischen Rahmen und Zellen und zwischen den Zellen stehenbleiben soll. Bei den Zellen bezieht sich das gegebenenfalls auf die darum gezogenen Linien. Ein solcher Abstand verbessert meist die Lesbarkeit der Tabellenzellen, weil diese dann besser voneinander unterscheidbar sind.

Der Wert ist entweder eine Zahl für den Abstand in Pixeln oder ein Prozentwert, als relative Angabe zum horizontal verfügbaren Platz. Der vertikale Abstand soll gleich dem horizontalen sein.

Attribut cellpadding

Mit dem Attribut kann angegeben werden, wieviel Freiraum zwischen dem Rand einer Zelle und dem Inhalt freibleiben soll, bei gezogenen Linien also der Raum zwischen Linie und Inhalt der Zelle.

Der Wert ist entweder eine Zahl für den Abstand in Pixeln oder ein Prozentwert, als relative Angabe zum horizontal verfügbaren Platz. Der vertikale Abstand soll gleich dem horizontalen sein.

Tabellenüberschrift, Element caption

Mit dem Element caption, welches als erstes Kindelement von table notiert werden kann, wird eine Tabellenüberschrift angegeben.

Der Inhalt von caption ist interpretierter Text einschließlich inzeiligen Elementen.

Hinsichtlich der Verstehbarkeit von Tabellen ist eine solche Überschrift ein sehr wichtiger Bestandteil einer Tabelle. Im klassischen Sinne sind Überschriften Kurzzusammenfassungen, in diesem Falle also eine Kurzdarstellung des Themas der Tabelle. Der konkrete Inhalt kann hingegen mit dem Attribut summary im Element table zusammengefaßt werden.

Außer den allgemein anwendbaren Attributen hat caption keine spezifischen Attribute.

Beispiel:

<table frame="border" rules="all" cellpadding="10" cellspacing="5"
 summary="Und-Verknüpfung von Wahrheitswerten. 
 0 steht für falsch, 1 für wahr.
 Nur wahr und wahr ergibt wahr, alle anderen Möglichkeiten sind falsch.">
    <caption>Wahrheitstabelle</caption>
    <tr><th>und</th><th>0</th><th>1</th></tr>
    <tr><th>0</th><td>0</td><td>0</td></tr>
    <tr><th>1</th><td>0</td><td>1</td></tr>
</table>

Wahrheitstabelle
und	0	1
0	0	0
1	0	1

Tabellenzeilen, Element tr

Mit dem Element tr werden alle Zellen einer Tabellenzeile zusammengefaßt. Möglicher Inhalt sind die Elemente th und td. Mindestens eines davon muß notiert werden, mehrere in beliebiger Reihenfolge sind erlaubt.

Neben den allgemein anwendbaren Attributen hat tr einige für dieses Element spezifische Attribute. Diese sind allesamt optional.

Mit den Attributen align, char, charoff, valign kann für eine Zeile zusammengefaßt werden, wie bei einer visuellen Darstellung Zelleninhalte ausgerichtet werden sollen. Entsprechende Beschreibungen sind bei den Zellenelementen zu finden.

Tabellenzellen, Elemente th und td

In den Tabellenzellen th und td kann beliebiger laufender Inhalt stehen. Um eine gute Struktur zu bekommen, sollte man sich nur entscheiden, ob man als direkte Kindelemente nur Blockelemente verwendet oder nur Text und inzeilige Elemente.

th wird für Tabellenköpfe verwendet, sowohl für Spalten als auch Zeilen. Sie geben also an, welcher Variable oder welchem Objekt die Daten in einer Spalte oder Zeile zugeordnet sind.

Um Spalten zu kennzeichnen, sind typisch die Zellen im ersten tr beziehungsweise im letzten tr Element vom Typ th, in denen dann die Beschriftung steht. Im strukturierten Modell wären das dann entsprechend Elemente in thead und tfoot.

Um Zeilen zu kennzeichnen, ist typisch das erste oder letzte Kindelement eines jeden tr ein Element th.

In td stehen die eigentlichen Zellendaten der Tabelle. td sollte auch verwendet werden, wenn eine Zelle Inhalt enthält, der sowohl als Kopfinformation als auch als normaler Zelleninhalt interpretiert werden kann. In diesen Fällen kann es auch sinnvoll sein, einige Attribute, die eigentlich mehr für das Element th gedacht sind, bei einem td zu notieren, welches teilweise auch Kopfinformationen enthält.

th und td haben neben den allgemein verwendbaren auch einige spezifische Attribute, die allesamt optional sind.

Werden unterschiedlich viele Zellen pro Zeile beziehungsweise Spalte angegeben, so werden entsprechend weitere leere Zellen impliziert, bis es paßt. Da mit rowspan und colspan auch Zellen über mehrere Zeilen oder Spalten ausgedehnt werden können, zählen solche Zellen dann natürlich entsprechend mehrfach, daß heißt, es werden dann wirklich entsprechend weniger Elemente in der jeweiligen Zeile oder Spalte notiert. Passend gemacht wird dann alles unter Einbeziehung von rowspan und colspan.

Attribut scope

Mit dem Attribut wird angegeben, auf welche Tabellenzellen sich eine Kopfinformation bezieht. Ein solches Attribut ist also sinnvoll für th-Elemente und solche td-Elemente, die ebenfalls Kopfinformationen enthalten.

Das Attribut wird dann im Kopfelement notiert, mögliche Werte sind:

row: Die Zelle, in der das Attribut notiert ist, enthält die Kopfinformation für den Rest der Zeile
col: Die Zelle, in der das Attribut notiert ist, enthält die Kopfinformation für den Rest der Spalte
rowgroup: Die Zelle, in der das Attribut notiert ist, enthält die Kopfinformation für den Rest der Zeilengruppe (Zellen im zugehörigen thead, tfoot oder tbody)
colgroup: Die Zelle, in der das Attribut notiert ist, enthält die Kopfinformation für den Rest der Spaltengruppe (Struktur gemäß der Elemente colgroup oder col)

Attribut headers

Mit dem Attribut wird angegeben, welche Kopfzelle sich auf die Datenzelle bezieht, in welcher headers notiert ist.

Anders als bei scope wird hier als Wert des Attributes allerdings eine Liste von Fragmentidentifizierern der Zellenelemente angegeben, in welchen sich die Kopfinformation befindet. Zwei aufeinanderfolgende Listenpunkte werden dabei mit einem Leerzeichen voneinander separiert. Da keine Klassen angegeben werden können, können solche Listen folglich sehr lang werden. Damit läßt sich aber eine nahezu beliebige Zuordnung erreichen, während scope bereits eine gute Struktur voraussetzt. Bei gut strukturierten einfachen Tabellen wird man es also offenbar effizienter und einfacher haben, scope zu verwenden. Andererseits kann es bei mehr als zwei Variablen notwendig werden, mehrdimensionale Datensätze zu verschachteln, wofür dann headers viel flexibler einsetzbar ist.

Es ist jedenfalls zu empfehlen, nur eines der beiden Attribute scope und headers zu verwenden, auch schon um Widersprüche zu vermeiden. Im Konfliktfalle ist nicht definiert, welche Information Vorrang hat.

Attribut abbr

Mit dem Attribut kann eine Abkürzung für den Tabelleninhalt angegeben werden. Dies ist besonders für Kopfinformationen sinnvoll. Bei einer akustischen Wiedergabe (Vorlesen) kann so bei jeder Datenzelle die Abkürzung statt des kompletten Kopfes verwendet werden, nachdem bei der Kopfzelle selbst wiedergegeben wurde, wofür die Abkürzung steht. Das kann die Verstehbarkeit vorgelesener Tabellen deutlich verbessern. Das ist folglich nur hilfreich, wenn mittels scope oder headers die Kopfinformation mehreren Zellen zugeordnet wird, also somit mehrmals vorgelesen werden müßte, was bei den Datenzellen durch die Abkürzungen ersetzt werden kann.

Wert des Attributes ist einfacher Text, der eine Abkürzung des Tabelleninhaltes darstellt.

Attribut axis

Zumindest bei visueller Darstellung ist eine Tabelle ja zweidimensional wie der Darstellungsbereich selbst. Auch die Einteilung in Spalten und Zeilen weist auf eine solche Dimensionierung hin.

Nun kann es allerdings auch Daten geben, die mehrdimensional korreliert sind. Auch wenn eine Tabelle Unterkategorien enthält, kann sich eine solche mehrdimensionale Relation ergeben. Um auch hier eine gut verständliche Zuordnung notieren zu können, kann mit dem Attribut axis eine Datenachse festgelegt werden. Es ist allerdings nicht festgelegt, wie diese Information dargestellt werden soll. Folglich können Darstellungsprogramme dies jeweils für den Nutzer optimiert tun.

Der Wert des Attributes ist eine Liste mit Kategorienamen. Zwei aufeinanderfolgende Listenpunkte werden mit Leerzeichen separiert.

Ein Kategoriename ist einfacher Text, aber offenbar ohne Leerzeichen darin.

Das Attribut wird meist zusammen mit headers verwendet werden, um die Zuordnung zu einer Achse eindeutig angeben zu können.

In einer Kopfzelle, welche die Kategorie benennt, wird das Attribut mit dem Kategorienamen angegeben. Zudem wird für die Verwendung von headers ein Fragmentidentifizierer angegeben.

Ein dreidimensionaler Tensor, hier also eine Verteilung, die von drei Variablen oder Achsen x, y, z abhängt, könnte etwa so notiert werden:

<table border="1" cellspacing="5" cellpadding="5">
<caption>Wahrscheinlichkeitstensor</caption>
<tr><th>                    </th> <th id="x1" axis="x">x 1</th>   <th id="x2" axis="x"> x 2</th></tr>

<tr><th id="z1" axis="z">z 1</th> <td> </td>                      <td> </td></tr>
<tr><th id="y1" axis="y">y 1</th> <td headers="x1 y1 z1">0.2</td> <td headers="x2 y1 z1">0.7</td></tr>
<tr><th id="y2" axis="y">y 2</th> <td headers="x1 y2 z1">0.5</td> <td headers="x2 y2 z1">0.1</td></tr>


<tr><th id="z2" axis="z">z 2</th> <td> </td>                      <td> </td></tr>
<tr><th axis="y">y 1</th>         <td headers="x1 y1 z2">0.9</td> <td headers="x2 y1 z2">0.3</td></tr>
<tr><th axis="y">y 2</th>         <td headers="x1 y2 z2">0.4</td> <td headers="x2 y2 z2">0.6</td></tr>
</table>

Wahrscheinlichkeitstensor
	x 1	x 2
z 1
y 1	0.2	0.7
y 2	0.5	0.1
z 2
y 1	0.9	0.3
y 2	0.4	0.6

Spannweite von Zellen, Attribute rowspan und colspan

Manchmal kann es vorkommen, dass man mehrere Zellen zu einer zusammenfassen möchte, die nebeneinander oder übereinander stehen. Um dies zu realisieren, gibt es die Attribute rowspan und colspan.

Mittels rowspan wird angegeben, auf wieviele Zeilen eine Zelle ausgedehnt werden soll.

Mittels colspan wird angegeben, auf wieviele Spalten eine Zelle ausgedehnt werden soll.

Der Wert ist jeweils eine (ganze, nicht negative) Zahl, also die Anzahl der Zeilen, beziehungsweise Spalten. Sofern nicht angegeben, wird jeweils '1' angenommen. Bei '0' erstreckt sich die Zelle über den ganzen Bereich, also bei rowspan von der aktuellen bis zur letzten Zeile des aktuellen Tabellenabschnittes (thead, tfoot oder tbody), bei colspan entsprechend von der aktuellen bis zur letzten Spalte des aktuellen Tabellenabschnittes (gemäß colgroup).

Ein Beispiel:

<table frame="border" rules="all">
    <tr>
        <td colspan="2">Zelle mit colspan="2"</td>
        <td rowspan="3">Zelle mit rowspan="3"</td>
    </tr>
    <tr>
        <td>2. Zeile, 1. Spalte</td>
        <td>2. Zeile, 2. Spalte</td>
    </tr>
    <tr>
        <td>3. Zeile, 1. Spalte</td>
        <td>3. Zeile, 2. Spalte</td>
    </tr>
</table>

Zelle mit colspan="2"		Zelle mit rowspan="3"
2. Zeile, 1. Spalte	2. Zeile, 2. Spalte
3. Zeile, 1. Spalte	3. Zeile, 2. Spalte

Man sieht, dass die erste Zelle mit colspan sich über zwei Zellen erstreckt. Die Zelle mit rowspan spannt sich über alle drei Zeilen. Zu beachten ist, dass sich Zellen immer von links nach rechts beziehungsweise von oben nach unten spannen, und man die Zellen, über die gespannt wird, herausnehmen muss.

Horizontale Ausrichtung, Attribut align

Mit dem Attribut kann für die visuelle Darstellung angegeben werden, wie der Inhalt einer Tabellenzelle in horizontaler Richtung relativ zur Tabellenzelle ausgerichtet wird. Also bei mehrzeiligem Inhalt bestimmt dies, ob die Zeilen links oder rechts an der Zellenkante gleich angeordnet sind oder auch zentriert. Alternativ kann auch relativ zu einem bestimmten Zeichen in jeder Zeile ausgerichtet werden. das Zeichen wird mit dem Attribut char angegeben.

Folgende Werte sind möglich:

left: Der Zelleninhalt wird links ausgerichtet (Voreinstellung für td)
right: Der Zelleninhalt wird rechts ausgerichtet
center: Der Zelleninhalt wird zentriert (Voreinstellung für th)
justify: Der Zelleninhalt wird an beiden Rändern ausgerichtet, soweit möglich, dazu wird die Breite der Leerzeichen in der jeweiligen Zeile variiert.
char: Ausrichtung relativ zu einem bestimmten Zeichen in jeder Zeile

Vertikale Ausrichtung, Attribut valign

Mit dem Attribut kann für die visuelle Darstellung angegeben werden, wie der Inhalt einer Tabellenzelle in vertikaler Richtung relativ zur Tabellenzelle ausgerichtet wird. Da alle Zellen einer Zeile gleich hoch sind, bestimmt sich die Höhe aller nach dem Inhalt der Zelle, die für ihren Inhalt am meisten Platz braucht. Bei den anderen Zellen bleibt somit Leerraum, in welchem der Inhalt angeordnet werden kann.

Folgende Werte sind möglich:

middle: Der Zelleninhalt wird mittig ausgerichtet, dies ist die Voreinstellung.
top: Der Zelleninhalt wird oben angeordnet
bottom: Der Zelleninhalt wird unten angeordnet
baseline: Hierbei wird das Attribut in genau einer Zelle einer Zeile notiert. Die erste Zeile dieser Zelle dient dann dazu, die ersten Zeilen der anderen Zellen auf gleicher Höhe anzuordnen.

Attribut char

Wird mit align="char" angegeben, dass horizontal relativ zu einem Zeichen ausgerichtet werden soll, so wird mit char angegeben, welches Zeichen dies ist.

Der Wert ist ein einzelnes Zeichen. Bei der Angaben von reellen Zahlen könnte dies etwa ein Komma oder Punkt sein, mit dem die Nachkommastellen separiert werden. Das Zeichen sollte in den betroffenen Zellen nur maximal einmal vorkommen. bei mehrmaligem Auftreten ist das Verhalten undefiniert.

Die Voreinstellung ist entsprechend das in der mittels xml:lang angegebenen Sprache verwendete Trennzeichen für Nachkommastellen. Für 'en' wäre das also '.', für 'de' entsprechend ','.

Die Interpretation ist für Darstellungsprogramme allerdings optional. Autoren und Leser sollten sich also nicht darauf verlassen.

Attribut charoff

Bei Verwendung von char und align="char" gibt charoff den Randabstand zum ersten Auftreten des Trennzeichens an. Tritt das Zeichen gar nicht auf, sollte sich das Zeilenende vor die Position verlagern. Ob der Randabstand von links oder von rechts gemeint ist, hängt an der Textflußrichtung. Bei einem Textfluß von links nach rechts ist der Abstand zur linken Seite gemeint, bei rechts nach links der der rechten Seite.

Zeilengruppen, Elemente thead, tfoot, tbody

Die Zeilen einer Tabelle können zu Gruppen angeordnet werden, um die jeweilige Funktion genauer herauszustellen. Dazu werden ein thead (Tabellenkopf), ein tfoot (Tabellenfuß) und ein oder mehrere tbody (Tabellenkörper) notiert. Die Reihenfolge ist nach der obigen Aufzählung festgelegt. Mögliche Inhalte der drei Elemente sind jeweils ein oder mehrere Elemente tr.

Unter anderem ist diese Einteilung auch praktisch, wenn eine lange Tabelle ausdruckt werden soll. Eine mögliche Umsetzung wäre dann zum Beispiel, dass auf jeder ausgedruckten Seite die Kopf- und Fußinformationen zu den Spalten der Zeilen erscheinen. Andere Umsetzungen und Nutzungen der Strukturinformationen durch das Darstellungsprogramm sind natürlich auch möglich. Ansonsten dient natürlich auch die Einteilung in Kopf, Fuß und Körper der Strukturierung des Inhaltes und hilft dem Autor, die Daten verständlicher zu notieren und dem Leser beim Verstehen des Inhaltes.

Neben den allgemein nutzbaren Attributen haben die drei Elemente auch einige spezifische Attribute. Dies sind align, valign, char, charoff. Die Bedeutung ist bereits für die gleichnamigen Attribute von tr, td und th erläutert worden. Sofern bei thead, tfoot oder tbody notiert, beziehen sich die Angaben auf alle Zeilen der Gruppen, sofern es im jeweiligen Element tr keine anderen Angaben gibt.

Beispiel:

<table>
  <thead>
    <tr>
      <th>Buchstabe</th>
      <th>Stadt</th>
      <th>Land</th>
      <th>Fluss</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <td>Nur lateinische Buchstaben</td>
      <td>Größer als 10 Tausend Einwohner</td>
      <td>Größer als 50 Tausend km<sup>2</sup></td>
      <td>Breite größer als 20 Meter</td>
    </tr>
  </tfoot>
  <tbody>
    <tr>
      <td>D</td>
      <td>Darmstadt</td>
      <td>Deutschland</td>
      <td>Donau</td>
    </tr>
    …
  </tbody>
</table>

colgroup und col

Mit Hilfe von colgroup (englisch: column group, deutsch: Spaltengruppe) und col (englisch: column, deutsch: Spalte) ist es möglich, dem Darstellungsprogramm frühzeitig die Anzahl der Spalten und die Breite der einzelnen Spalten zu übermitteln. So können Verzögerungen und somit leere Inhalte beim Laden der Seite vermieden werden.

Dazu werden die Elemente colgroup oder col hinter dem gegebenenfalls vorhandenen caption und vor thead notiert, beziehungsweise falls keine Strukturierung mit thead, tfoot, tbody erfolgt, vor dem ersten tr.

Mit colgroup können entweder Angaben zu mehreren gleichartigen Spalten notiert werden oder damit können mehrere Spalten zu einer Gruppe zusammengefaßt werden. Einzelne Spalten werden dann darin oder ohne Verwendung von colgroup mittels col gekennzeichnet. Während mit colgroup eine inhaltliche Aussage über die Struktur der Tabelle gemacht wird, macht col keine Aussage über die inhaltliche Struktur der Tabelle, sondern dient nur der Aufnahme von Attributen zur praktischen Umsetzung der Struktur.

col selbst hat keinen Inhalt, colgroup kann mehrere Elemente col als Inhalt haben.

Neben den allgemein nutzbaren Attributen haben die beiden Elemente auch einige spezifische Attribute. Zum einen ist das die bereits erläutertete Gruppe align, valign, char, charoff. Die Bedeutung ist bereits für die gleichnamigen Attribute von tr, td und th erläutert worden. Sofern bei col oder colgroup notiert, beziehen sich die Angaben auf alle Zellen einer so definierte Gruppe, sofern es im jeweiligen Element keine anderen Angaben gibt.

Zum anderen gibt es die Attribute span und width.

span

Der Wert von span ist eine ganze Zahl, die größer als 0 ist. Bei colgroup notiert gibt sie die Anzahl gleichartiger Spalten der Gruppe an. Dies ist für colgroup nur sinnvoll, wenn keine Kindelemente col notiert werden. Sind diese vorhanden, wird das Attribut ignoriert.

Ist das optionale Attribut nicht notiert, so richtet sich die Anzahl der Spalten nach den Kindelementen col von colgroup. Sind diese nicht vorhanden und auch das Attribut nicht notiert, so wird eine Spalte angenommen.

Auch beim Element col kann das Attribut span notiert werden. Sofern vorhanden, gibt es an, wieviele gleichartige Spalten damit repräsentiert werden. Ist also eine Zahl S größer als 1 notiert, so teilt col seine Attributwerte mit den nächsten S-1 Spalten.

width

Mit dem Attribut width kann die Spaltenbreite angegeben werden. Der Wert ist eine Länge, also eine Zahl, die eine Breite in Pixeln bedeutet oder eine Zahl gefolgt von einem Prozentzeichen (%) für den prozentualen Anteil an der verfügbaren Breite oder eine nicht negative ganze Zahl gefolgt von einem Stern (*). '0*' gibt dann an, daß die Spaltenbreite die minimale Breite haben soll, die notwendig ist, um den Inhalt darzustellen. Dies impliziert dann, dass das Darstellungsprogramm alle Zeilen analysieren muß, um die minimale Breite zu bestimmen, bevor die gesamte Tabellen dargestellt werden kann. Andere Werte wie 1*, 2*, 3* dienen dazu, verbleibenden Platz anteilmäßig zu verteilen. Dazu wird zunächst der Platz anderer Spalten mit Prozentangaben oder Pixeln berücksichtigt. Der verbleibende Platz wird dann unter den gesternten Spalten aufgeteilt, wobei dann 2* doppelt so viel Platz wie 1* bedeutet, und 3* dreimal soviel Platz wie 1* etc.

Das Attribut kann bei col und colgroup notiert sein. Falls beides zutrifft und eine Spalte so zwei Zuweisungen bekommen hat, gilt jene, die mit col notiert ist.

Anzumerken ist insbesondere bei Breitenangaben in Pixeln, daß dies sehr problematisch bei Textinhalt ist, weil der Autor niemals die volle Kontrolle über die exakte Schriftart und Schriftgröße hat, die beim jeweiligen Betrachter verwendet werden. Der Autor kann nicht wissen, wieviele Pixel für den Textinhalt benötigt werden oder wieviel Platz in Pixeln überhaupt insgesamt verfügbar ist. Breitenangaben sind also so anzugeben, dass unter plausiblen Umständen immer sichergestellt ist, dass der Inhalt auch wirklich noch in die Zellen paßt. Ist das nicht gegeben, hat jedenfalls das Darstellungsprogramm im Notfall immer die Möglichkeit, Angaben zu ignorieren und die Darstellung zu optimieren, bis der Inhalt untergebracht werden kann.

Beispiele zu colgroup und col

<table>
    <colgroup>
       <col width="30%" />
       <col span="2" width="35%" />
    </colgroup>
    <tr>
        <th>Überschrift, 1. Spalte</th>
        <th>Überschrift, 2. Spalte</th>
        <th>Überschrift, 3. Spalte</th>
    </tr>
    <tr>
        <td>1. Zeile, 1. Spalte</td>
        <td>1. Zeile, 2. Spalte</td>
        <td>1. Zeile, 3. Spalte</td>
    </tr>
</table>

Wenn Sie aber für alle Spalten, die gleiche Breite zuweisen wollen, dann ordnen Sie dem colgroup-Element eine Breite zu und setzen das Attribut span (englisch: span, deutsch: spannen) für die Anzahl der Spalten, für welche die Breite gelten soll. Ein colgroup-Element mit einem gesetzten span-Attribut darf keine col-Elemente enthalten.

  <colgroup width="300" span="3"></colgroup>

oder

  <colgroup width="300" span="3" />

(Man beachte, dass diese Variante nicht rückwärtskompatibel zu HTML ist, also in der Praxis nicht verwendbar wäre, falls das XHTML doch noch als (fehlerhaftes) HTML brauchbar interpretierbar werden soll.)

oder alternativ:

  <colgroup>
    <col span="3" width="300" />
  </colgroup>

Hat die Gruppenstruktur keine inhaltliche Bedeutung, wird colgroup komplett weggelassen, es bleibt also nur

    <col span="3" width="300" />

Zurück zu Formulare |

Hoch zu XHTML |

Vor zu Kopfdaten