Zitat:
Zitat von accessoire
Was ist denn nun zu empfehlen? Ist es nur Geschmackssache, oder wie schauts aus mit den Vor - und Nachteilen. Beim Grid-Design wird gerne mal der Text einfach abgeschnitten, wenn man die Schrift vergrößert und das passt mir nicht wirklich in den Kram.
|
Es gibt momentan viele leidenschaftlich kommentierte Blog-Beiträge dazu, wobei die Begriffe "Grid vs. flexibel" oft ein bisschen wischi-waschi gebraucht werden und jeder etwas anderes damit meint. Deswegen erst mal ein paar Worte vorweg:
- Ein Grid ist vom Wort her einfach nur ein Raster zum Gestalten. Zeilen und Spalten, die die zu gestaltende Fläche systematisch aufteilen. Designer verwenden diese Raster seit Ewigkeiten, z. B. auf der Basis des goldenen Schnitts.
- Die Bezeichnung Grid-Design oder auch Grid-Layout hat sich für Layouts eingebürgert, die meist feste Pixel-Breiten haben und sich stark an einem Raster orientieren. Beispiel sind mit Blueprint erstellte Designs.
1. Fest versus flexibel: Pixel, em und %
Ein Grid-Design kann aber durchaus flexibel sein. Dazu muss man die Breiten statt in px in % oder em definieren.
So hat YAML-Erfinder Dirk Jesse die
Beispielseite von Blueprint mit festen Breiten mit Hilfe von YAML Subtemplates nachgebaut:
Blueprint Beispielseite - flexible Breiten. Dirk hat auch einen
Artikel zur Entstehung der flexiblen Variante geschrieben.
Ein Grid-Layout müsste also nicht zwangsläufig feste Pixelbreiten haben. Die Orientierung an einem Raster ist grafisches Grundwissen, wie es sehr schön in dem von paracelsus verlinkten Buch beschrieben wird. Die Umsetzung dieses Rasters auf Webseiten könnte aber genausogut mit % oder em erfolgen. Man findet "Raster" und "Pixel" oft zusammen, weil eine von Papier und Photoshop geprägte DENKWEISE eine natürliche Tendenz in Richtung Pixel zu haben scheint.
2. Inhaltsbezogene Vorgehensweise: Zuerst HTML, dann CSS
Neben "flexibel vs. fest" gibt es noch einen bemerkenswerten Unterschied:
- Normalerweise schreibt man HTML und gestaltet diese Elemente dann mit CSS. Man geht vom Inhalt aus. Diesen Ansatz verfolgt YAML. Es gibt ein allgemeines HTML-Grundgerüst, die eigentliche Gestaltung erfolgt aber im CSS.
- Die "Grid-Frameworks" machen das genau andersrum: Es gibt eine fertige CSS-Sammlung. Dieses CSS wird nicht verändert. Die Gestaltung erfolgt im HTML über die Zuweisung von Klassen für die HTML-Elemente.
Andy Clarke beschreibt diesen Unterschied in "Transcending CSS" ab S. 55 mit dem Satz "Mit CSS gestylte Seiten werden oft immer noch 'von oben nach unten, von links nach rechts' konstruiert", nur halt mit DIV statt mit TABLE.
Er empfiehlt stattdessen "Die inhaltsbezogene Vorgehensweise": Zuerst nur strukturelle HTML-Elemenente, dann das Design. Und er bringt wunderschöne und überzeugende Beispiele. Bemerkenswert daran ist, dass er von Haus aus Grafikdesigner ist und trotzdem den inhaltsbezogenen Ansatz bevorzugt, weil der der Flexibilität des Mediums "Web" besser entspricht.
Das was heute als "Grid-Layout" bezeichnet wird, verfolgt NICHT die inhaltsbezogene Vorgehensweise, weil das grafische Raster als Ausgangspunkt genommen wird.
Um die Verwirrung zu komplettieren: Man kann natürlich sehr wohl inhaltsbezogen arbeiten und das dann mit einem Raster gestalten. Man muss halt nur anders DENKEN, aber wer will das schon. Schließlich sind wir alle Gewohnheitstiere...