Cascading Style Sheets (oder abgekürzt CSS) ist eine Ergänzungssprache zur exakt formatieren und positionieren von Seiten-Elementen eines strukturierten Dokuments. Sie wird vor allem in HTML und XML-Dokumenten eingesetzt. MIttels CSS wird dabei das Erscheinungsbild einer Ausgabe festgelegt, während im HTML ausschliesslich der Inhalt bearbeitet wird.

Diese Trennung von Funktion und Design führt bei korrekter Anwendung zu mehrerer entscheidenden Vorteilen:

• Die einzelne HTML-Seite wird deutlich kleiner, da sie sich nur noch auf das wesentliche (den Inhalt) beschränkt.
• Ladezeiten werden verringert, da der Browser die ausgelagerten (in einer seperaten Datei abgelegt) CSS-Definitionen für viele Seiten nur ein einziges Mal laden muss.
• Mit sehr wenigen Änderungen lassen sich auch riesige Projekte auf ein neues Design (auf ein neues CI) umstellen.
• Es wird möglich, verschiedene Erscheinungsbilder für verschiedene Ausgabe-Medien (Bildschirm, Druck, PDA/Mobil u.w.) zu definieren und so in den einzelnen Ausgaben bessere Ergebnisse zu erhalten (im Ausdruck stören Hintergrundbilder, mobile Geräte haben meist keine so grossen Bildschirme u.s.w.).
• Fehlerhafte Darstellungen von Browseren (an erster Stelle sei hier der IE – Internet Explorer von Microsoft genannt) können korrigiert werden.
• Grafische Effekte können (teilweise) ohne Bilder erzielt werden und sind somit barrierefrei.
• und vieles mehr …

CSS gilt heutzutage als die Standard-Stylesheetsprache für das Web.

Das folgende Beispiel zeigt, mit wie wenigen Elementen eine Seite aufgebaut werden kann:

  

    

      
Premium Hosting 24
      
Suchmaschinen-Optimierung und Webhosting
    
  
  

  

    

      
«
        
        zurück zum Artikel
      
      

    
    

      
CSS - Cascading Style Sheets
      

        
Eine Demonstration, mit wie wenigen Elemente eine
             komplette Seite projektweit designed werden kann...
      
    
  
  

  

    
Home
  

Der Screen-Shoot der Seite wird vielleicht irgendwann veraltet sein (falls sich das Design von Premium Hosting ändern wird), die Demo-Seite wird sich aber dank der Formatierung via CSS immer an das aktuelle Design anpassen…

Das wohl beeindruckenste Beispiel, was mittels CSS alles möglich ist, finden Sie auf der Seite von CSS-Zen-Garten.