BaseGUI.de

Die Base-Schicht ist das Fundament. Hier geht es nicht um hübsche Buttons, sondern um verlässliche Standards: Schriftfamilie, Zeilenhöhe, Farben, Links, Tabellen-Grundverhalten und die typischen Browser-Abweichungen. Wenn diese Basis stimmt, wirkt schon reines HTML ordentlich, ohne dass du jede zweite Zeile mit Klassen zukleistern musst. Das ist kein Luxus, das ist die Voraussetzung, damit Components später klein bleiben und nicht aus lauter Ausnahmen bestehen.

Was typischerweise in Base steckt

Viele Frameworks starten mit Reset oder Normalize. Dazu kommen einfache Regeln wie box-sizing, feste Hintergrundfarbe, Linkfarben und ein Standard für Abstände. Wenn du hier sparsam bist, bekommst du weniger Überraschungen in alten Browsern und weniger “warum sieht das hier anders aus” Diskussionen. Und ja, auch Print-Styles können hier rein, wenn du Doku-Seiten druckbar halten willst.

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="style.css">
<link rel="canonical" href="https://basegui.de/base.html">

:root{
  --bg:#f8f9fa;
  --ink:#202122;
  --link:#0645ad;
}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  line-height:1.6;
  font-family:system-ui, sans-serif;
}
a{ color:var(--link); }

Ein häufiger Fehler ist, Base mit Design zu verwechseln. Base soll nicht „dein Theme“ sein. Sie legt Standards fest, aber sie sollte keine fertigen Karten oder Layouts erfinden. Das kommt später bei Objects und Components. Wenn man das trennt, ist refactoring viel einfacher. Wenn nicht, klebt man immer an denselben Stellen, und irgendwann ist alles ein wilder Mix aus globalen Regeln und Spezialfällen, das ist dann echt nervig.