Theme Frameworks / Grid System

Würde mich ehrlich gesagt auch alles interessieren - ich schreibe meine Templates stets selbst, so richtig per Hand. Ich halte CSS jetzt nicht für so überaus komplex, dass Frameworks wirklich nötig sind. Das mag bei großen Agenturen oder Teams mit mehreren Personen vorteilhafter sein, wenn Frameworks genutzt werden, aber Dank Firebug und entsprechenden Browserfunktionen sollte es eigentlich auch da kein Problem sein, in fremden CSS-Definitionen klarzukommen (mag jemand widersprechen, der hier andere Erfahrungen gesammelt hat).

Wenn ich dann noch sehe, dass Bootstrap z.B. alleine schon 6200 Zeilen und 130 KB hat, halte ich das für völlig übertrieben - wenn ich eigene Templates schreibe, haben selbst komplexe Layouts nicht mehr als 4000 Zeilen und vielleicht 90 KB - und das ist dann Code, der wirklich sehr individuell zusammengestellt ist und nicht - wie bei Bootstrap & Co - einfach mal alles beinhaltet, was man irgendwann mal gebrauchen kann.

Genauso sehe ich das bei den Theme Frameworks bei Drupal. Hat man so ein Framework/ Basis-Theme aufgesetzt, hat man erstmal locker mit an die (oder gar über) 100 Dateien zu tun, die dann im eigenen Theme munter überschrieben werden. Auch hier frage ich mich ernsthaft, ob das wirklich ein Gewinn ist, so vorzugehen.

Das ist natürlich eine Grundsatzfrage, wie man entwickeln möchte.
Ich mag bestimmte Richtungen und Grundsätze von z.B. Zen.
Als ich damals damit angefangen habe wäre ich aufgeschmissen gewesen. Allein auf die rafinierten Selektoren bzw. Klassen zu verzichten, war für mich nicht möglich.
Aber das Thema mit vielen Zeilen Code und zig Templates die man auch nie benötigt, beschäftigte mich sofort als ich erste mal den Zen Ordner öffnete.

Mittlerweile sind bei Zen die Template und css Ordner leer und nichts wird überschrieben, benötigt man dann ein eigenes Template, kopiert man dieses aus dem Base Theme. Dank Sass werden nicht genutze Selektoren in der CSS Datei gar nicht ausgegeben und bei Bedarf kann man diese natürlich raus schmeissen.
Aber naja, es wird immer eine Glaubensfrage sein :) Ich persönlich bin zumindest deutlich schneller mit einer Basis wie Zen, wenn man sie kennt. Jetzt ist der Umstieg von Version 6 auf 7 natürlich mit anfänglichen Aufwand verbunden.

Es dauert ein paar Tage, bis man sich mit Sass und Compass angefreundet hat, aber ich möchte es nicht mehr missen. Ich fahre Sass/Compass lokal auf meinem Entwicklungssystem und nicht auf dem Server.
In einem CSS-File kommen leicht tausend Zeilen zusammen und mit Sass hat man einfach einen besseren Überblick über seinen CSS-Code. Außerdem ist er lesbarer, da ich die Anweisungen strukturiert schreiben kann. Die Umsetzung in CSS erfolgt automatisch.
Ein einfaches Beispiel für die Möglichkeiten ist etwa die Benutzung von Variablen für Farbwerte. Die stehen dann an einer Stelle und eine Änderung einer Variablen zieht sich dann durch alle abhängigen CSS-Dateien. Außerdem bieten die "Mixins" so viele Erleichterungen, daß einem schier die Augen aus dem Kopf fallen.
Bei leveluptuts.com sollte man sich mal die Videos zu Sass und Compass ansehen, es lohnt sich.
Zen liefert einem übrigens bereits die Sass-Dateien mit.

Ich verwende seit über einem Jahr in allen Projekten SASS/Compass. Man kann nach einer kurzen Einarbeitungszeit viel Zeit beim Theming/CSS sparen.
Hier einige Beispiel was man so machen kann:

Variablen definieren und immer wieder verwenden. Änderung nur noch an einer Stelle nötig:

Verschachteln:

Sticky Footer erstellen mit einer einzigen Zeile:

Cross Browser Border Radius:

Mathematische Funktionen und Schleifen:

Danke für die Antwort. Der Link ist wirklich nett, werde ich mir heute Abend mal anschauen.
Mit Sass habe ich mich schon abgefunden, allein schon Variablen habe ich mir immer gewünscht :)

Primär drehe ich mich jedoch mit dem Grid / Layout Systemen im Kreis.
Also Responsive ist ja eigentlich nix anderes als ein fluid Layout, wie es damals auch schon in Zen enthalten war. Omega, Zen, Adaptive etc. sind ja mittlerweile alle responsive. http://mobiletest.me/ nutze ich für tests.
Die Grid Systeme ermöglichen mir nur an zentraler Stelle Änderungen am Layout durchzuführen. Das heisst, ich benötige es nicht zwingend wenn ich an meiner Seite eh keine Änderungen vornehme? In diesem Fall kann ich mir das mit dem Grid doch sparen oder?

Das adaptivethemes hat wirklich nette Möglichkeiten zur Einstellung des Layouts abhängig vom Endgerät. Wie erreiche ich dies im Zen Theme?

eine generelle frage: was bringt das?
ein beispiel
Verschachtelung

Sass erlaubt das Verschachteln von CSS-Regeln. Damit kann die Verschachtelung der Regeln die Verschachtelung der Elemente im HTML-DOM widerspiegeln. Beispiel:

.tabs {
height: 27px;
padding: 0 10px;

li {
float: left;
height: 23px;
overflow: hidden;
padding: 5px 2px 0;

&.active {
height: 24px;
padding: 4px 1px 0;
a {
background: white;
padding: 4px 12px 5px;
}
}
}
}

Der Selektor einer verschachtelten Regel wird mit dem Selektor der darüberliegenden Regeln kombiniert, sodass in der Regel ein Nachfahrensselektor entsteht. Der obige SCSS-Code wird in folgende vier CSS-Regeln übersetzt:

.tabs {…}
.tabs li {…}
.tabs li.active {…}
.tabs li.active a {…}

es ist doch einfacher das css direkt an den browser auszuliefern als über skripte die auf dem host installiert sind....

Also gerade von der Verschachtelung bin ich auch kein großer Fan in SASS - ich habe damit noch nicht gearbeitet, das muss ich einschränkend dazu sagen... aber mir erscheint die einfache CSS-schreibweise auch einleuchtender und übersichtlicher. Wo die Verschachtelung echt gut ist, sind die wohl möglichen verschachtelten Media-Queries. Beispiel von Wikipedia:

DAS ist nun wirklich cool - gerade das Überschreiben von Eigenschaften für das responsive Design an anderer Stelle ist in CSS etwas unübersichtlicher. Aber bisher hatte ich keine Projekte, wo das nicht auch mit reinem CSS, einigen Kommentaren und ein bisschen Struktur in der Datei zu managen war.

Was ich mir schon ganz cool vorstellen kann sind die Variablen... aber so wahnsinnig wild ist der Austausch eines Farbwerts jetzt eigentlich auch nicht. Jeder Editor bietet "Suchen&Ersetzen" an - ob das jetzt den Aufwand rechtfertigt, Ruby und SASS zu installieren und SASS zu lernen, bezweifle ich irgendwie.

Bleiben die Mixins... auch das kann an manchen Stellen die Übersicht und Arbeit erleichtern, kann ich mir vorstellen. Vor allem auch Änderungen an irgendwelchen Standard-Formatierungen, die auf verschiedene Selektoren angewendet werden sollen, sind damit sicher erheblich einfacher. Aber mit ein bisschen Organisation und Struktur in der eigenen Arbeit mit CSS und HTML sowie mit Klassen und Ids ist das eigentlich auch nicht so das wahnsinns Problem.

Also irgendwie bleibe ich dabei: CSS ist nun wirklich kein Hexenwerk und wenn ein CSS-Layout so komplex wird, dass man Variablen und Mixins braucht, sollte man vielleicht noch mal grundlegend etwas an dem CSS ändern. Wenn man sie nicht braucht, braucht man auch kein SASS (denke ich....)

Natürlich kommt man mit CSS aus, das denke ich ja auch die ganze Zeit. Die Welt kommt ja fast 20 Jahre damit aus :)
Die Verschachtelung macht derzeit für mich auch noch keinen Sinn, zumindest spare ich mir dabei nichts.
Aber das bisschen was ich mit mixins und variablen gemacht habe, ich will es jetzt schon nicht mehr missen. Natürlich käme ich ohne aus, aber warum ? Für den Seitenbetrachter, Browser oder Server ist das doch völlig egal. Später ist und bleibt es CSS. Ob ich nun einmal compiliere oder nicht, wenn stört das?

Ich benötige z.B. für fast jede Unterseite eine andere Farbpalette. Da sind Variablen ein Segen.
Die mixins für CSS3 Eigenschaften (@include box-shadow) sind auch sehr nett. ODer ich definiere mir Formatierungen als Mixins.
Ich denke also Sass ist nett und ich werde es mal nutzen, bis ich einen Nachteil entdeckt habe.

Aber das mit dem Grid ist nun immer noch nicht beantwortet :)
Das Menü mache ich nun über Responsive Menus, eine wirklich nette Lösung.

Das schöne an Zen Grids ist die Tatsache, dass man nicht mit vorgegebenen classes im HTML arbeiten muss, sondern im scss einfach jedes Element benutzen kann.
Beispiel:

Einfacher geht's nun wirklich nicht. Man kann natürlich noch viel mehr machen. Z.B. Container mit unterschiedlicher Anzahl von Spalten. Verschachtelte Grids usw. usw.

Man braucht auf dem Host keine Scripte, um scss zu kompilieren. Das macht man auf dem eigenen Rechner und lädt das kompilierte CSS auf den Webserver.

ja, ja aber das kompilierte muss ja zurückkompiliert werden...

Zurückkompiliert? nein, nein, du schreibst deine *.scss Datei mit SASS. kompilierst dein SASS mit COMPASS und heraus kommt eine stinknormale CSS-Datei. Da muss ganz garantiert nichts zurückkompiliert werden. Und wie gesagt Mixins und variablen, aber auch die mathematischen Operationen sind ein wirklicher Segen.

So isses.
Compass ist allerdings nicht zwingend erforderlich, wenn auch sehr empfehlenswert.