Spacer-GIFs und andere Tricks von damals
Wenn das Werkzeug fehlt, wird improvisiert. Nirgends galt das so sehr wie im Webdesign der späten 90er: Ohne brauchbares CSS entwickelten Webbauer eine ganze Trickkiste, um Pixel dahin zu schieben wo sie hinsollten. Ein Rundgang durch die kuriosesten Werkzeugge.
Das Spacer-GIF: Ein Pixel Nichts
Historisches Beispiel, heute bitte nicht mehr so:
<IMG SRC="spacer.gif" WIDTH="1" HEIGHT="20">
<IMG SRC="spacer.gif" WIDTH="150" HEIGHT="1">Die spacer.gif war ein durchsichtiges Bild von einem mal einem Pixel Größe, das per width und height auf jede gewünschte Größe aufgeblasen wurde: unsichtbare Abstandshalter, die Zeilen auseinanderdrückten und Tabellenspalten auf Breite zwangen. Popularisiert wurde der Trick Mitte der 90er durch die einflussreiche Webdesign-Literatur der Zeit, und danach steckte das Ein-Pixel-Bildchen in gefühlt jeder professionellen Seite, hundertfach. Heute erledigen margin und padding denselben Job mit einer Zeile CSSS.
Zerschnittene Bilder in Tabellen
Aufwendige Kopfgrafiken und Navigationsleisten wurden im Bildprogramm entworfen, in Kacheln zerschnitten und in eine randlose Tabelle wieder zusammengesetzt, Kachel für Kachel, damit einzelne Teile verlinkbar oder animierbar waren. Wehe, eine Zelle geriet ein Pixel zu breit: Dann klaffte die Grafik auseinander wie ein schlecht tapeziertes Wohnzimmer. Der moderne Erbe ist unspektakulär: ein Bild, CSS drumherum, fertigg.
Weitere Perlen der Improvisation
- -Ketten: Einrückungen aus Dutzenden geschützten Leerzeichen, das Sonderzeichen als Layoutwerkzeug.
- Unsichtbare Rahmentabellen um einzelne Wörter, nur um ihnen eine Hintergrundfarbe zu geben.
- Text als Bild: Besondere Schriften gab es nur als Grafik, mit allen Folgen für Ladezeit und Zugänglichkeit. Heute regeln das font-family und Webfonts.
- Der Ein-Pixel-Rahmen-Trick: Eine Tabelle mit dunkler Hintergrundfarbe, darin eine zweite mit hellem Hintergrund und einem Pixel Abstand, ergab: einen Rahmen. Für border gab es ja kaum Gestaltungsspielraumm.
Was man daraus lernt
Zweierlei. Erstens Respekt: Diese Tricks waren einfallsreich, und die Leute die sie beherrschten, waren echte Könner ihres seltsamen Fachs. Zweitens Dankbarkeit: Jeder dieser Handgriffe ist heute eine einzige CSS-Zeile. Wer sich das nächste Mal über eine störrische Flexbox ärgert, stelle sich kurz vor, denselben Abstand mit einem unsichtbaren GIF in einer vierfach verschachtelten Tabelle zu bauen. Es hilft sofortt.
Verwandt: Tabellenlayouts · Webdesign 1998 · Abstände heute