Webdesign mit CSS

Einleitung (S. XVII-XVII)
Dieses Buch beschäftigt sich damit, wie man gutes Webdesign auf der Basis von XHTML und Cascading Style Sheets (CSS) realisiert. 30 praxisnahe Beispiele sollen einen Eindruck vermitteln, wie man mit CSS auf einfache und zugängliche Art anspruchsvolle Designs verwirklichen kann. Ebenso sollen sie veranschaulichen, wie viel Gestaltungsfreiraum CSS bietet und wie viele mögliche Herangehensweisen es gibt, Ideen in die Tat umzusetzen. Beim Schreiben dieses Buchs galt es, einige Finessen im Umgang mit CSS und beim Einsatz bestimmter Techniken herauszustellen. Nur am Rande wird auf besondere Aspekte in Bezug auf Barrierefreiheit eingegangen.

Die durchgehende Trennung von semantischer Struktur und der Präsentation gewährleistet jedoch bereits ein gewisses Maß an Zugänglichkeit, und nahezu alle Beispiele in diesem Buch erfüllen die Barrierefreiheitsrichtlinien des W3C mindestens in Form der »Web Content Accessibility Guidelines« (WCAG) Level A. Gutes Webdesign ist das Produkt aus spezifikationsgetreu verwendetem HTML und CSS, bei deren Entwicklung man auf die Bedürfnisse aller und vor allem Menschen mit Behinderungen eingeht, informativen und dekorativen Bildern sowie erwiesener Benutzerfreundlichkeit. Leider konnte es nicht Aufgabe dieses Buchs sein, die Benutzerfreundlichkeit aller Beispiele über Nutzertests zu garantieren. Der Leser wird jedoch ermutigt, diesem Aspekt bei seiner Arbeit große Bedeutung beizumessen – ein visuell ansprechendes Design, das nicht bedienbar ist und somit nicht funktioniert, ist kein gutes Design.

Technische Hinweise

Webdesign mit CSS wendet sich an Webdesigner und Webentwickler, die gute CSS-Kenntnisse besitzen. Vertrautheit mit HTML/XHTML wird vorausgesetzt, und damit nicht nur das Wissen um die Syntax, sondern auch um Validität und Semantik. Als Dokumenttyp aller Designs, mit Ausnahme von »Bildunterschriften«, wurde XHTML 1.0 Strict gewählt. Auf HTML 4.01 wurde verzichtet, um von den Vorteilen von XHTML – wie der einfachen, XML-ähnlichen Syntax – zu profitieren. XHTML 1.1 schied als Dokumenttyp aus, da es mit dem MIME-Typ application/xhtml+xml ausgeliefert werden muss, was bei herunterladbaren Dateien wie bei diesem Buch nicht garantiert werden kann. Zudem kann der Internet Explorer keine Dokumente mit diesem MIMETyp parsen. Ein einfacher Austausch der DOCTYPE-Deklaration ist jedoch möglich, alle Codebeispiele validieren auch gegen XHTML 1.1.

Alle Designbeispiele in diesem Buch wurden auf Kompatibilität mit folgenden Browserversionen hin getestet: Firefox ab Version 1.5, Internet Explorer ab Version 6.0, Opera ab Version 8.0 und Safari ab Version 2.0. In Browsern wie Mozilla, Netscape Navigator oder Konqueror wurde ebenfalls getestet, aber aufgrund entweder derselben technischen Basis wie Firefox oder der sehr geringen Verbreitung nicht so intensiv wie in den vorher genannten Browsern. Sollten einzelne Designs oder Designabschnitte in einer genannten Browserversion nicht funktionieren, wird separat darauf hingewiesen. Aufgrund der Vielzahl der Systeme und einzelnen Browserversionen kann leider keine vollständige Gewähr übernommen werden. Das CSS wird mitsamt etwaiger Besonderheiten detailliert besprochen, beispielsweise wenn Selektoren nicht überall unterstützt werden oder gar CSS-3-Eigenschaften eingesetzt werden. Die Beispiele berücksichtigen pauschal alle Medientypen, auf Druck- Stylesheets wird somit nicht eingegangen. In allen Beispielen kommt eine Regel zum Einsatz, die »global« alle Innen- und Außenabstände zurücksetzt:

* {
margin: 0,
padding: 0,
}

Diese Regel stellt sicher, dass browserspezifische Unterschiede bezüglich dieser Abstände eliminiert werden. Sollten Abstände notwendig sein, werden sie explizit angegeben und erklärt. Es gibt auch einige Fälle, in denen nebensächliche Zuweisungen nicht explizit aufgeführt werden – zum Beispiel, wenn ein Innenabstand auf dem body-Element zwar nützlich, aber für das umzusetzende Design nur von marginaler Bedeutung ist. Wird der gesamte CSS-Code am Ende eines Beispiels aufgelistet, findet man diese Regeln dort wieder, ebenso sind sie natürlich in den online verfügbaren Dateien vorhanden.