beta

Table

1. Was macht dieses Element?

  • Strukturierte Darstellung von Daten.

2. Wann soll das Element eingesetzt werden?

  • Einsatz bei der Darstellung von Daten, nicht zur Strukturierung von
    Content.
  • Tabellen sollen so aufgebaut werden, dass diese beim Hinzufügen von
    Datensätzen in der Vertikalen (Zeilen) wächst.

3. Regeln

  • Headertext kann mehrzeilig sein.
  • Inhaltszeilen werden alternierend mit weissem und grauem Hintergrund ausgezeichnet; die erste Inhaltszeile startet immer mit weissem Hintergrund.
  • Header- und Inhaltstexte können innerhalb der Tabellenzelle links-, rechtsbündig oder zentriert sein.
  • Legenden und Tabellenunterschriften werden direkt unter der Tabelle linksbündig aufgelistet.
  • In Tabellen sind keine Bilder zugelassen.
  • Leere Tabellenzellen werden mit einem Divis ausgefüllt.
  • Im Headertext sind keine Auszeichnungen oder Links erlaubt.
  • Jede Spalte hat zwingend einen Headertext (Barrierefreiheit).
  • Für Tablet und Mobile Ansichten gilt: Wenn die Tabelle breiter als der Viewport und die erste Spalte als Headerspalte definiert ist, wird die erste Spalte fixiert. Die restlichen Spalten können dann nach links geswiped werden.
  • Masseinheiten von Inhalten werden im Spalten- oder im Zeilenheader angezeigt.

4. Ausprägungen

4.1 Einfach

Design Spezifikation

Code Spezifikation

4.2 Gruppiert

Design Spezifikation

Code Spezifikation

4.3 Titel - Wert

Design Spezifikation

Code Spezifikation