Die CSS–Grids helfen dem WebDesigner bei der Aufteilung der Seite in Spalten. Es gibt dafür von verschiedenen Anbietern Lösungen wie YAML, 960 oder Blueprint. Alle arbeiten mit festen CSS–Klassen, die dann in bestimmter Weise genutzt dazu führen, dass man sehr leicht, Cross-Browser-kompatible Layouts erstellen kann. Seit ich YUI Grids benutze, habe ich jedenfalls keine Probleme mehr mit Spalten, die andere überdecken, im Internet Explorer wegedrückt werden und so weiter.
Der Nachteil von derart universellen Lösungen ist oft ein Overhead an Tags, die man in einer maßgeschneiderten Lösung nicht benötigen würde. Die Seiten sind also ein wenig aufgebläht, was sich auf Übertragungsgeschwindigkeiten und gegebenfalls auf die Durchsuchbarkeit für Suchmaschinen auswirken könnte. Während sich der Geschwindigkeitunterschied messen lässt und eher vernachlässigbar ist, lässt sich ein Problem mit Suchmaschinen nicht verifizieren.
Einfacherer Code + Flexibler
Der Code der YUI3 Grids ist wesentlich einfacher benutzbar, weil er lesbar ist. Die Klassennamen sind so gesetzt, dass man an ihnen erkennt, wie breit ein Element damit formatiert wird:
- Man legt ein neues Grid an, indem man ein Blogelement mit der Klasse .yui3-g (g = grid) anlegt.
- In diesem Grid können Units (u) benutzt werden. Soll es in einem Grid einen Bereich geben, der 1⁄4 des Platzes einnimmt, versieht man ein Block-Element mit der Klasse .yui3-u-1 – 4 — soll es 1⁄3 sein, nimmt man .yui3-u-1 – 3.
Auf diese Weise lässt sich eine Seite in Grids und Grids in Units zerlegen, in denen man wiederum sicher seine Inhalte positionieren kann.
Soweit ich das sehe, gibt es keinen Menü-Container mehr und die Reihefolge der Units wird ohnehin einfach von links nach rechts angezeigt.
Das alles führt dazu, dass die neuen YUI3-Grids einfacher zu benutzen sind. Der Grids-Builder, der unter YUI2 noch wichtiges Arbeitswerkzeug war, sollte mit YUI3 überflüssig sein.
Links
Foto: .marqs /photocase.com
