CSS (Cascading Style Sheets) ist eine Technik, die die vollständige Trennung von Inhalt und Design ermöglicht. Diese Trennung ist elementar für dynamische Inhalte und bringt in der Praxis sehr viele Vorteile mit sich. Wenn z.B. das Design einer Seite geändert werden soll, muss man keine Inhalte mehr konvertieren, sondern passt einfach das Stylesheet an!
Vorteile der Trennung von Inhalt und Design:
- Neue Designs einfach umzusetzen ohne Inhalte ändern zu müssen
- Designs passen sich an Endgeräte an (verschiedene CSS für z.B. großen Desktop / mobile Endgeräte mit sehr kleinen Bildschirmen / Ausdruck / ...)
- Barrierefreies Internet (z.B. für Hör- und Sehgeschädigte)
- Dynamische Darstellung mit JavaScript möglich (z.B. Ein-/Ausblenden von Ebenen)
- Noch dynamischer geht es mit AJAX, das eine Kombination von PHP und JavaScript ist.
- Einfaches Erstellen von Templates und Skins für Web Applications mit Datenbankanbindung
Zur Verdeutlichung sei auf die Seite CSS Zen Garden verwiesen, die diesen Design-Ansatz hervorragend demonstriert. Die HTML-Datei bleibt immer gleich, nur das CSS wird geändert und das Design radikal anders dargestellt.
Einbinden von CSS
- im <head> (intern und extern)
- in individuellen Tags mit <tag style="background-color:red">
Ressourcen
- SelfHTML (CSS)
- CSS4You - Umfassende deutsche CSS Referenz
- CSS Menu Maker
- w3.org - CSS @media queries (Auswahl von CSS für Endgeräte)
- Web Design Inspiration for the iPhone