Im Vortrag auf der Beyond Tellerrand 2013 erzählt Harry Roberts über seine Anfänge als Frontend-Entwickler bei sky und über die Probleme, die sich ergeben, wenn man im Team an großen Webprojekten arbeitet. Die Lösung: SCALABLE CSS.
Auf der Suche nach einem einheitlichen Standard zum Schreiben von CSS ist man bei sky auf SMACSS (Scalable and Modular Architecture for CSS) von Jonathan Snook gestoßen. Nutzern von Twitter Bootstrap wird das Prinzip bekannt vorkommen. Eine Website wird in Komponenten, Elemente und Modifier unterteilt und CSS-Anweisungen werden so formuliert, dass alle Gemeinsamkeiten in einer Klasse stehen und durch zusätzliche Klassen modifiziert werden können.
Durch eine solche Schreibweise wie <button class="btn btn-warning btn-large"> wird zwar auf den ersten Blick nur mehr HTML geschrieben, der große Vorteil liegt jedoch darin, dass sich so ohne Probleme neue Klassen erschaffen und ergänzen lassen, ohne am bisherigen CSS Änderungen vornehmen zu müssen. Gleichzeitig können globale Änderungen an einer Stelle vorgenommen werden, ohne noch mal die kompletten CSS-Anweisungen durchgehen zu müssen.
Wer sich noch nicht mit Scalable CSS beschäftigt hat, sollte sich das Video auf jeden Fall ansehen. Die Slides zur Präsentation findet ihr bei Speakerdeck. Und für diejenigen, die das Video und/oder SMACSS kennen die Frage: Habt ihr euren Workflow bereits in dieser Richtung angepasst? Oder schreibt ihr CSS immer noch mit containerabhängigen Verschachtelungen und IDs?