Mai 2005 > mehr wissen > CSS-Praxis
 
Buchrezension: CSS-Praxis
Von Florence Maurice
 
Wenn Sie sich bereits mit HTML beschäftigt haben, ist CSS eine sinnvolle Erweiterung. Mit CSS können Sie das Aussehen von HTML-Seiten bestimmen. Über HTML legen Sie beispielsweise fest, dass ein Textabschnitt eine Überschrift sein soll, mit CSS definieren Sie, wie diese im Detail aussehen soll: Schriftfarbe, -größe, Position, Ausrichtung. Die Formatierungen mit CSS können für mehrere Dokumente angegeben werden und so ein einheitliches Erscheinungsbild garantieren. Bei einer konsequenten Anwendung von CSS lassen sich Dokumente in ihrem Aussehen ändern, ohne etwas am Dokument selbst modifizieren zu müssen. CSS bietet erstaunliche Möglichkeiten und es lohnt sich, sich damit genauer zu beschäftigen.

Es gibt unterschiedliche Arten, CSS einzusetzen. Im einfachsten Fall verwendet man weiterhin zu Layout-Zwecken HTML-Tabellen, nimmt aber Formatierungen - wie Angaben für die verwendete Schrift, projektweite Farbzuweisungen etc. - über CSS vor. Hierbei halten sich die auftretenden Probleme meist in engen Grenzen. Anders sieht es allerdings aus, wenn man den Versuch unternimmt, ein ganzes Layout statt über die beliebten HTML-Tabellen ausschließlich mit DIVs (Bereiche) zu realisieren, die mit CSS entsprechend positioniert werden. Hier kommt man oft zu Ergebnissen, mit denen man nicht gerechnet hatte, und außerdem überraschen die einzelnen Browser einen mit verblüffend unterschiedlichen Darstellungen.

Unterstützung bei diesen fortgeschrittenen Techniken – oder eher fortgeschrittenen Problemen – bietet das bei Galileo erschienene Buch „CSS-Praxis“ von Kai Laborenz.

Es unterteilt sich in acht Kapitel: Das erste Kapitel bietet eine Einführung in das Thema; es erklärt den Aufbau von CSS-Angaben und wie sie in HTML-Dateien eingebunden werden. Das folgende Kapitel „Grundlegende Konzepte von CSS“ stellt die bei CSS relevanten Begriffe vor. Erläutert werden unter anderem Selektoren (einfache und auch komplexere wie Attribut-Selektoren), das Konzept der Vererbung (welche Eigenschaften werden wann wie vererbt), das Boxmodell und die verschiedenen möglichen Längen- und Größenangaben.
Das dritte Kapitel wagt einen Ausblick in die Zukunft von CSS, nämlich CSS in der Version 3 und CSS für andere Endgeräte wie beispielsweise PDAs.

Im vierten Kapitel widmet sich der Autor dem leidigen Kapitel der Browserkompatibilität und führt bei den einzelnen Browsern auf, inwieweit sie CSS unterstützen. Nicht unerwähnt bleibt auch das Phänomen des Doctype-Switching, d.h. dass Browser in Abhängigkeit vom angegebenen Dokumenttyp Seiten unterschiedlich darstellen. Anschließend kommt der Autor zum wichtigen Thema der Browser-Hacks. Denn was macht man, wenn ein Browser eine bestimmte CSS-Eigenschaft falsch darstellt? Interpretiert beispielsweise der Internet Explorer in seinen älteren Versionen das Boxmodell anders als die anderen Browser, benötigt er auch andere Werte für die Breite eines Elements, damit es wie gewünscht dargestellt wird. Diese Angabe darf jedoch nur vom Internet Explorer interpretiert werden. Browser-Hacks nutzen besondere Schwächen einzelner Browser aus, um gezielt Angaben ausschließlich für diese bereitzustellen oder andere Angaben wiederum gezielt vor einzelnen Browsern zu verstecken. Hier werden die wichtigsten Hacks und Browserweichen aufgeführt – es sind inzwischen gar nicht so wenige: Kai Laborenz zählt dreizehn auf.

Das Herzstück des Buchs sind die nun folgenden Kapitel 5 und 6. Kapitel 5 „CSS in der Praxis“ bietet neben der Diskussion der verschiedenen Schriftgrößenangaben und welche man denn nun am besten einsetzt – ein Thema, das auch und gerade in Hinblick auf Barrierefreiheit eine nicht unwesentliche Rolle spielt – eine Vorstellung der Möglichkeiten, wie man reine CSS-Layouts erstellt.
Kapitel 6 präsentiert drei Praxisbeispiele für über CSS realisierte Websites, die kaum unterschiedlicher sein könnten.

Barrierefreiheit ist ein Begriff, der eng mit CSS verbunden ist. So geht es beim ersten Praxisbeispiel auch um die Vorstellung der Website „Einfach für Alle“, die als das Vorzeigebeispiel für barrierefreies Webdesign gelten kann. Aber nicht immer wird CSS mit dem Ziel Barrierefreiheit eingesetzt. Das zweite Beispiel ist der Auftritt der Suchmaschine Lycos und verfolgt mit fester Seitenbreite und fester Schriftgröße in Pixel (im Internet Explorer nicht skalierbar) einen ganz anderen Ansatz.
Das letzte Beispiel ist eine Realisierung eines Layouts für CSS Zen Garden. CSSZenGarden ist das Referenz-CSS-Projekt schlechthin; hier reizt Kai Laborenz die Möglichkeiten von CSS eher designerisch-verspielt aus und präsentiert die Seite im Ozean-Look.

Kapitel 7 bietet einen Überblick über Tools, die die Webdesignerin bei der Arbeit mit CSS unterstützen, und das letzte Kapitel beinhaltet eine umfangreiche Referenz über die CSS-Elemente.

Insgesamt ist CSS-Praxis ein Buch von hohem Niveau für fortgeschrittene WebentwicklerInnen, die ihre ersten Erfahrungen mit CSS bereits gesammelt haben und nun weiter gehende Layout-Techniken und browserübergreifende Lösungen kennen lernen wollen.

Etwas anderes aber ist auch klar: Je mehr man sich mit CSS beschäftigt, um so mehr wird man zum Internet Explorer-Hasser. Was gibt es nicht alles an tollen Effekten und guten Techniken, die in CSS vorgesehen sind und die von Firefox / Mozilla unterstützt, vom Internet Explorer jedoch falsch interpretiert oder schnöde ignoriert werden. Also noch einmal ein Appell: Wer etwas zur Hebung der Laune der WebentwicklerInnen und darüber hinaus zur Verschönerung des Webs tun möchte: Sofort umsteigen auf Firefox!

Details

Kai Laborenz: CSS-Praxis
Galileo Computing 2005.
ISBN 3-89842-577-0.
EUR 34,90
Direkt bei Libri bestellen

Website zum Buch
www.css-praxis.de

Deutsche Mozilla Firefox-Website

Weitere mediella-Artikel zum Thema

Buchrezension:
"Barrierefreies Webdesign"
mediella 03.05

Dokumenttyp-Angaben
mediella 05.04

Mozilla als alternativer Browser
mediella 01.04

Autorin
Florence Maurice
Kontakt: florence.maurice @mediella.de