knappschaft: CSS-Dateien aufsplitten

Liebe Forum-Gemeinde,

beim redesignen meiner Site möchte ich möglichst viel mit CSS steuern. Da ich eine farbige Navigation anbiete, deren Farbenschemata sich auf den einzelnen Seiten wiederspiegeln. Nun zu meiner Frage: Mein Hautcontent befindet sich auf der Startseite und es ist anzunehmen, dass die Besucher auf den restlichen "Mehrwert" gar nicht zugreifen will. Ist es, z.b. aus Bandbreitengründen, sinnvoll, die CSS in mehrer, seitenabhängige CSS-Dateien zu splitten? Dann würde vermieden, dass immer die ganzen Styles geladen werden, obwohl für die Startseite nur ein Teil gebraucht wird. Ist es überhaupt praktikabel?

Vielen Dank für Eure Mühe

die knappschaft

  1. Hallo Knappe,

    Mein Hautcontent befindet sich auf der Startseite und es ist anzunehmen, dass die Besucher auf den restlichen "Mehrwert" gar nicht zugreifen will. Ist es, z.b. aus Bandbreitengründen, sinnvoll, die CSS in mehrer, seitenabhängige CSS-Dateien zu splitten?

    wenn du den Ueberblick behaeltst, kannst du jedes Style in eine etxra Datei scheiben und dann einbinden. :-)
    Empfehlen wuerde ich dir, schreibe eine Haupt-css Datei mit allen globalen immer wiederkehrenden Styles und dann deine Seitenabhaengigen Styles die du dann zusaetzlich einbindest - je nach Seite.

    hochachtungsvoll
    scribble

    1. Moin!

      wenn du den Ueberblick behaeltst, kannst du jedes Style in eine etxra Datei scheiben und dann einbinden. :-)
      Empfehlen wuerde ich dir, schreibe eine Haupt-css Datei mit allen globalen immer wiederkehrenden Styles und dann deine Seitenabhaengigen Styles die du dann zusaetzlich einbindest - je nach Seite.

      Richtig!

      Beispiel:
      Ein Haupt-CSS formatiert Schriftarten, Schriftgrößen, Layerpositionen etc., und für jeden Bereich wird noch ein weiteres CSS eingebunden, welches die Farben definiert.

      Dabei sollten die Klassen und IDs auf den Seiten und in den Farb-CSS-Dateien immer identisch sein. Das erleichtert das Arbeiten bei einem Redesign der CSS-Dateien.

      Und zum Einbinden:
      <link rel="stylesheet" href="/mainstyle.css" type="text/css">
      <link rel="stylesheet" href="colorstyle.css" type="text/css">

      Damit bindest du die Datei "mainstyle.css" aus dem Hauptverzeichnis und die Datei "colorstyle.css" aus dem aktuellen Verzeichnis ein. Du mußt dann nur noch in jedes Verzeichnis eine colorstyle.css ablegen, in der die Farben definiert sind (natürlich auch im Hauptverzeichnis), und fertig. Wenn du eine Datei aus einem Verzeichnis in ein anderes packst, ändern sich automatisch die Farben (aber natürlich nur, wenn du immer die gleichen Klassen benutzt hast...)

      - Sven Rautenberg