Organisations-Tipps, Teil zwei

CSS – (msc) Wie der vorherige Tipp beweist, kann man mit Gliederung und Kommentaren schon sehr viel Licht in die CSS-Dateien bringen. Eine Frage, die sich bei der Organisation der Stile immer wieder stellt: Wie geht man mit unterschiedlichen Varianten um? Es kommt immer wieder vor, dass die gleichen Elemente auf unterschiedlichen Seiten verschieden ausgestaltet werden. Tabellen, die mal so und mal anders aussehen, Anpassungen der Navigation, unterschiedliche Farben – wenn bei einer Website mit mehreren Rubriken mit einer differenzierten Gestaltung gearbeitet wurde, ist ein Artenreichtum bei den CSS-Regeln unvermeidlich. Es gibt verschiedene Methoden, damit umzugehen:

  • Man hält sie in der gleichen CSS-Datei und arbeitet für jede Variante mit unterschiedlich benannten Regeln bzw. mit Klassen. Das ist die gängige Methode, die in vielen Fällen auch zweckdienlich ist. Sie kann aber zu aufgeblähten und unübersichtlichen Stildateien führen.
  • Man verwendet für jede Rubrik bzw. für jede Gestaltungsvariante eine eigene CSS-Datei. Das führt allerdings zu redundanten Regeln. Änderungen werden sehr aufwändig – mit dieser Lösung tut man sich keinen Gefallen!
  • Man verwendet eine Haupt-CSS-Datei, die die allgemeingültigen Re-geln enthält und eine CSS-Datei mit den spezifischen Regeln. Das ist eine gute Lösung, wobei es nicht immer einfach ist, die allgemeingültigen von den speziellen Regeln zu trennen. Je klarer das Gestaltungskonzept der Site, desto einfacher wird diese Aufgabe.
  • Die Aufteilung nach CSS-Dateien bietet sich auch für einzelne, selten gebrauchte Gestaltungselemente an. Wenn man beispielsweise Tabellen nur auf jeder zehnten Seite braucht, macht es Sinn, die Stilregeln für die Tabelle in einer eigenen CSS-Datei abzulegen und diese nur bei Bedarf in die HTML-Datei einzuklinken.
  • Eine Alternative zu komplexen CSS-Konstrukten eröffnet sich Anwendern, die auf dem Webserver mit Include-Dateien arbeiten können (z.B. mit dem PHP-Befehl <? include("page-header.inc"); ?>). Er erspart komplizierte CSS-Konstrukte, indem variable Elemente wie beispielsweise die Navigation oder die Kopf- und Fusszeilen über Includes eingebunden werden. Natürlich kann man auch den Header als Include realisieren.

Quelle: Publisher, Montag, 11. Juni 2007

Rubrik und Tags:

Faksimile

Metadaten
Thema: Webtipps
Nr: 7815
Ausgabe: 07-3
Anzahl Subthemen: 9

Obsolete Datenfelder
Bilder: 0
Textlänge: 56
Ort:
Tabb: FALSCH