Websiteentwicklung: CSS

Dieses Buch hat eine Druckversion.

Dieses Buch steht im Regal EDV.

Lieber Leser, liebe Leserin,

vielleicht haben Sie schon das Buch Websiteentwicklung: XHTML gelesen. Wenn Sie mit diesem Buch keine Probleme gehabt haben, sollte es Ihnen nicht schwer fallen, CSS zu lernen.

Eine reine XHTML-Seite sieht recht nüchtern aus, denn es fehlt noch ein individuelles Design und ein Layout, welches, neben dem reinen Inhalt, einen wesentlichen Einfluss auf den Erfolg eines Projektes haben kann.

Mit CSS kann der Autor seine kreativen Ideen und Phantasien hinsichtlich der Präsentation der Inhalte einbringen oder die Gestaltungswünsche eines Kunden verwirklichen.

Durch ein gutes Design kann auch die Lesbarkeit und die ganze Ergonomie eines Projektes deutlich verbessert werden.

Um einen Eindruck davon zu bekommen, was ein professionelles CSS-Design leisten kann, sollte man sich einmal das Projekt www.CssZenGarden.com anschauen. Dort haben hunderte von Designern aus der ganzen Welt immer wieder dieselbe XHTML-Seite mittels CSS gestaltet. Der reine Inhalt der Seite wird nie verändert, weder der Inhalt, noch die Reihenfolge der XHTML-Elemente (mit Ausnahme vielleicht von Übersetzungen des Textes in verschiedene Sprachen). Alle Änderungen des Aussehens werden ausschließlich mit CSS-Mitteln erreicht.

Viel Spaß beim Stöbern, Lernen und Ausprobieren!

• Zielgruppe: Autoren, die ihre eigenen (X)HTML-Projekte im Netz selbst gestalten möchten. Als Vorkenntnis ist das XHTML-Buch der Buchserie empfehlenswert, anders erworbene Kenntnisse über (X)HTML sollten aber ebenfalls helfen.
• Lernziele: Kenntnisse zu bestehenden Empfehlungen des W3C hinsichtlich CSS sollen vermittelt werden. Leser sollen anhand der Definitionen und anhand von Beispielen in die Lage versetzt werden, selbst Stilvorlagen komplett und gemäß Empfehlung zu erstellen.
• Buchpatenschaft/Ansprechperson: Doktorchen
• Sind Co-Autoren gegenwärtig erwünscht? Bei größeren Änderungswünschen und Ideen zur Ergänzung besser kurz Rücksprache halten, das Buch befindet sich bereits in einem komplett lesbaren Zustand, was sich nicht mehr ändern sollte.
• Richtlinien für Co-Autoren: Sofern neue CSS3-Module endlich einmal von Arbeitsentwürfen zu offiziellen Empfehlungen werden, ist eine Ergänzung natürlich erwünscht. Von daher ist anders als bei anderen, klassisch strukturierten Büchern zu erwarten, dass es immer einmal wieder neue Kapitel gibt, die ergänzt werden sollten, einfach weil es neue Empfehlungen gibt. Bevor sie Empfehlungsstatus annehmen, sind indessen Arbeitsentwürfe nicht als 'gesichertes Wissen' im Sinne von wikibooks anzusehen und eher für eine spätere Ergänzung vorzusehen. Aktuell (2014) fehlt von den bestehenden Empfehlungen insbesondere noch der Abschnitt von CSS 2.0 zu auralen Stilvorlagen, der gerne ergänzt werden kann. Hinsichtlich praktischer Anwendungen und ausführlicher Beispiele für komplette Stilvorlagen für Projekte und auch besondere Anwendungsfälle etwa für EPUB-Bücher sind natürlich vollständige Anwendungskapitel als Ergänzung ebenfalls sehr erwünscht, ebenso wie die Darstellung etablierter Methoden zur Verbesserung der Ergonomie durch Stilvorlagen für besondere Nutzergruppen. Wünsche hinsichtlich weiterer Inhalte sollten auf der Diskussionsseite formuliert werden, nicht etwa als Verweise zu nicht exisiterenden Inhalten im folgenden Inhaltsverzeichnis.

• Beschreibung
• Geschichte
• Grundlagen
• Einbau in HTML/XML
• Syntax
• Kaskadierung, Spezifität und Vererbung
• numerische Angaben
• Farben
• Farbe und Hintergrund
• Box-Modell
• Schriftformatierungen
  • Schriftarten: font-family
  • Schriftgröße: font-size
  • Schriftgewicht: font-weight
  • Schriftstil: font-style
  • Schriftvarianten: font-variant
  • Schriftweite: font-stretch
  • Korrektur der Schriftgröße: font-size-adjust
  • Schrift (allgemein): font
• Textformatierungen
  • Zeichenabstand: letter-spacing
  • Zeilenhöhe: line-height
  • Textausrichtung: text-align
  • Textdekoration: text-decoration
  • Texteinrückung: text-indent
  • Textschatten: text-shadow
  • Texttransformation: text-transform
  • Vertikale Ausrichtung: vertical-align
  • Textumbruch: white-space
  • Wortabstand: word-spacing
  • Schreibrichtung: direction und unicode-bidi
• Cursor
• Tabellen
• Listen
• Pseudoklassen, Pseudoelemente und erzeugte Strukturen
• Seitenmedien
• Praxis
• Werkzeuge zum Bearbeiten von CSS
• Literatur - Referenzen, Tutorials, Blogs etc.

So beeindruckend die Beispiele aus dem www.CssZenGarden.com sind, gibt es zum Lernen und Nachschlagen bessere Quellen.

Wichtige deutschsprachige Projekte zum Thema CSS

• de.SelfHtml.org - Stylesheets (CSS) (ältere Version)
• www.TheStyleWorks.de
• www.Css4You.de
• www.Html-World.de - CSS-Einführung
• www.Css-Info.de - CSS-Einführung
• de.Html.net - CSS-Anleitung

• Webdesign