Die moderne Inkarnation eines Webdesigners kommt üblicherweise verhältnismäßig regelmäßig mit drei Formen von Code in Berührung: (X)HTML, CSS und JavaScript. Alle drei folgen ihren eigenen Gesetzen, haben eine eigene Syntax, werden in den einschlägigen Texteditoren unterschiedlich eingefärbt und sind auch sonst sehr verschieden.

Ich persönlich gebe mir stets Mühe, dass mein HTML halbwegs sauber ist. Und zwar einerseits formal, so dass die Einrückungen stimmen und auch die Verwendung von Leerzeichen und Tabulatoren konsequent ist. Andererseits natürlich (viel wichtiger) muss es auch funktional stimmen, also im Aufbau der Struktur, die Tiefe der Verschachtelung, die Anzahl der IDs, Klassen usw. Das HTML-Dokument ist das Herzstück einer Website und muss einfach gut und clean und logisch aufgebaut sein. HTML enthält Inhalt, und Inhalt ist der König auf der Datenautobahn.

Bei JavaScript bin ich oftmals schon ein wenig schlampiger. Man lagert seine Scripte ja inzwischen glücklicherweise zu 99 Prozent in externe Dateien aus, so dass sie nicht unmittelbar im Blickfeld sind, wenn jemand in den Quelltext guckt ;-) Dennoch ist es ein relativ leichtes, eine gewisse Ordnung in seine Funktionen und Klassen und Schleifen und Objekte zu bekommen. Immerhin ist JavaScript eine richtige Scriptsprache und nicht nur eine Auszeichnungssyntax. Von daher ergeben sich automatisch Strukturen, die geschachtelt und eingerückt werden können. Und vieles davon wird dem Webworker von einem guten Texteditor abgenommen. Außerdem sind gute Scripte meist nicht so riesig, so dass man hier keine besondere Philosopie des Aufbaus und der Organisation benötigt.

Kommen wir zu meinem Sorgenkind, Ihr ahnt es schon: CSS-Code lässt sich nur schwierig in schöne, homogene und saubere Form gießen. Woran liegt das? Ich versuche, das mal zu erläutern:

CSS ist eine serielle Aneinanderreihung von kleinen Info-Häppchen (Selektoren), die zueinander keine hierarchische Beziehung haben. Die Reihenfolge ist egal. Eine Einrückung findet nicht statt. CSS-Dateien können sehr lang werden und gerade hier schreit man förmlich nach einer Gliederung in mehrere Bereiche – allein, es gibt keine sinnvollen Regeln dafür, die sich aus der Funktion des Codes ergeben könnten; man muss sich selber mit der Anordung und Quelltext-Kommentaren behelfen. Darüber hinaus neigt CSS-Code dazu, auch über das formale Aussehen hinaus, hässlich zu sein:

• Rendering-Unterschiede in den Browsern führen häufig zu eigentlich redundanten Stilzuweisungen.
• Das gleiche gilt für den zwangsweise praktizierten Verzicht auf praktische CSS2-Features wie Kind-Selektoren.
• Komische CSS-Eigenschaften wie »Margin Collapsing« führen dazu, dass man andere CSS-Eigenschaften missbrauchen muss. Einen weißen border-top als Abstandshalter zum Beispiel.
• Die Regeln der Spezifitäten führen dazu, dass man in manchen Fällen ganz hässliche Dinge machen muss, um mächtige Zuweisungen bei einzelnen Elementen zu überschreiben. Heraus kommen Dinge wie html body #wrapper #content #footer ul li.active (also ellenlange Selektoren, die möglichst viele IDs enthalten, damit man auch ja alle anderen Eigenschaften überschreiben kann.)
• Das Jonglieren mit unterschiedlichen CSS-Layout-Techniken (Floaten, absolut Positionieren, negative Margins usw …) führt oft zu einem Mischmasch an Konstrukten, die nur schwer über den CSS-Code nachvollziehbar sind.

All diese Faktoren (und noch einige mehr) führen zu einer Verschandelung des CSS-Codes. Leider kann man es aber oftmals nicht vermeiden (wie zumindest ich die Erfahrung gemacht habe), denn wenn man versucht, dass CSS sauber und clean zu halten, muss man Änderungen an der HTML-Struktur machen. Und genau das ist der springende Punkt, weswegen ich diese ganzen Zeilen überhaupt schreibe, und ich wage erneut, Thesen aufzustellen:

1. Die Sauberkeit des HTML-Code ist wichtiger als die Sauberkeit des CSS-Codes.
2. Wer sein CSS aufräumt, darf sein HTML dabei nicht verschmutzen.
3. Wer sein HTML aufräumt, darf sein CSS dabei sehr wohl verschmutzen, wenn es trotzdem funktioniert und kompatibel ist.
4. CSS darf dreckig sein.

Klingt hart, ist aber nahe dran an der Realität. Denn aus oben genannten Gründen ist CSS eh schon von Natur aus dreckig. Wer mit Hacks arbeitet, weiß das noch besser. Da fällt es dann auch nicht ins Gewicht, wenn man ein paar Umständlichkeiten hinzufügt, wenn ich mir dadurch ein umschließendes DIV oder ein paar IDs oder Klassen im HTML sparen kann. Es dient also dem Wohle des strukturierten Inhalts!

Disclaimer: Und ja, natürlich weiß ich, dass man in vielen Fällen sowohl HTML als auch CSS gleichzeitig sauber bekommen kann. Aber eben in vielen Fällen auch nicht.