BaseGUI.de

Tabellen sind perfekt für Dokus: Klassen, Eigenschaften, kurze Erklärungen. In einem Framework ist eine Table-Component meist schlicht, aber konsequent. Du willst klare Linien, ordentliche Zellabstände und einen Kopfbereich, den man sofort erkennt. Die Tabelle soll ruhig wirken und trotzdem Struktur geben. Als Component kann die Tabelle gezielt optimiert werden, ohne dass Base alles global beeinflusst.

<table class="table">
  <thead>
    <tr><th>Klasse</th><th>Wirkung</th></tr>
  </thead>
  <tbody>
    <tr><td>.btn</td><td>Button Grundstil</td></tr>
    <tr><td>.codebox</td><td>Code in Box darstellen</td></tr>
  </tbody>
</table>

Lesbarkeit vor Effekten

Für technische Seiten reicht ein sanfter Hintergrund im Header und ein feiner Rand. Der Rest ist Typografie. Wenn Zeilenhöhen stimmen und Abstände nicht zu eng sind, liest sich das angenehm. Gerade im Wikipedia-nahen Look wirkt das seriös und nicht laut. Das ist gut, weil du willst, dass Leute die Inhalte verstehen, nicht dass sie über das Design nachdenken.

.table{ width:100%; border-collapse:collapse; }
.table th, .table td{ border:1px solid #c8ccd1; padding:10px; }
.table th{ background:#eaf3ff; text-align:left; }

Tabellen passen perfekt in die Schichtenlogik. Base gibt Grundwerte, Content ordnet Standard-HTML, Objects bauen Layout. Eine Tabelle ist eine UI-Komponente, weil sie ein fertiges Element ist, das man erwartet. Wenn du später eine zweite Tabellenvariante brauchst, kannst du das als neue Component ergänzen, ohne überall Nebenwirkungen zu erzeugen. Wenn man das am Anfang schludert, wird’s später schwer wieder grade zu ziehen, und dann sitzt man da und fragt sich warum plötzlich jede zweite Tabelle anders aussieht.