Webtechnik

CSS-3 Revolution für Webdesigner

13. August 2009 von Mario

Der neue Firefox, Safari und Chrome unterstützen bereits Teile der CSS Version 3. Auf wenigen Demoseiten kann man schon die Funktionen in Aktion sehen.
Ich finde es sind wirklich einige sinnvolle und praktische neue Befehle dabei. Diese möchte ich in diesem Beitrag vorstellen und damit den Druck auf die Browsermacher erhöhen die CSS3 Version in die kommenden Browserversionen zu integrieren. Das würde den Webdesignern neue Möglichkeiten eröffnen und vor allem die Arbeit erleichtern.

Grundlegende Veränderung des Stylesheets

In der dritten Version des Cascading Style Sheets werden erstmals alle Funktionen in einzelne Module unterteilt. Diese Module werden unabhängig voneinander Weiterentwickelt und können auch unabhängig voneinander unterstützt werden. Zum Beispiel muss ein Anzeigegerät mit schwarzweiß Display keine Farben unterstützen. Also kann das Farbmodul bei der Programmierung ausgelassen werden.
Außerdem werden eine stattliche Anzahl an neuen Befehlen und Möglichkeiten eingeführt, die bei der Gestaltung völlig neue Möglichkeiten eröffnen.
Ein offizielles Release der CSS Version 3 gibt es noch nicht. Ursprünglich waren schon einige Erscheinungstermine, unter Anderem für 2007, angesetzt, doch leider wurden diese auch wieder abgesagt. Einige Browser unterstützen schon Teile von CSS3. Der Spitzenreiter ist hier wie bei allen neuen Webentwicklungen der Mozilla Firefox. Die rote Laterne trägt, wie immer, Microsofts Internet Explorer.

Die wichtigsten Module

Selektoren

Ich möchte hier zwei Selektoren vorstellen, die ich am wichtigsten finde.
Zum Einen ist es mit CSS3 möglich, Formularkomponenten und vom Benutzer aktivierte Formularkomponenten (z.B. Checkbox) getrennt zu gestalten. Einige kreative Köpfe werden mit dieser Möglichkeit bestimmt für die eine oder andere Überraschung sorgen.
Zum Anderen wird es möglich sein, Text abhängig von dessen Inhalt zu gestalten. Beispielsweise wird Text generell mit einem weißen Hintergrund hinterlegt. Sobald aber das Wort Design im Text auftaucht, wird der ganze Paragraph mit einem grauen Hintergrund hervorgehoben.

Medien

Wenn man eine externe CSS Datei einbindet, gibt es bisher die Möglichkeit über das Attribut media zu spezifizieren, bei welchem Medium die CSS Datei geladen werden soll. Mit CSS3 hat man nun zusätzlich noch die Möglichkeit im media Attribut, beispielsweise bei einem Stylesheet für die Druckansicht, die minimale Druckauflösung zu bestimmen.

Mehrspaltiges Layout

Es soll einen Befehl geben, der dem Browser mitteilt, wie viele Spalten er rendern soll. Hier ist noch nicht sicher ob sich dieser Befehl auch für das Layout eignet. Vermutlich ist er für das mehrspaltige Anzeigen von Texten, wie in Zeitungen gedacht.
Falls er allerdings doch für Layouts verwendbar ist, würde das den HTML Code um eine beachtliche Länge verkürzen. Die Voraussetzung für diese Art der Programmierung ist aber, dass alle verbreiteten Browser den CSS3 Standard unterstützen. Bis das der Fall ist, vergehen mindestens noch 5-10 Jahre. Warum das so lange dauert? Das liegt einzig und allein daran, dass viel zu wenige Internetbenutzer die Updatefunktion ihres Browsers benutzen. Außerdem sollte man den Hinweisen Beachtung schenken, wenn eine neue Version, z.B. Internet Explorer 8, zur Verfügung steht.

Neue Funktionen im Überblick

Ein zweites, ergänzendes Boxenmodell lässt die Gesamtbreite des Containers fest vorgeben. Alle Befehle wie padding und border werden von dieser Gesamtbreite abgezogen. Somit steht die Breite der Box genau fest und das auch bei unterschiedlichen Einheiten. (px/em)
Ränder werden auch näher gestaltet werden können. So ist es möglich, Bilder als Rand einzusetzen. Abgerundete Ecken müssen nun auch nicht mehr über das Design realisiert werden und Bilder können über einen CSS Befehl um eine bestimmte Gradzahl gedreht werden.
Außerdem gibt es die Möglichkeit, Hintergrundbilder wie ein normales Bild auch mit padding zu versehen. Zudem können mehrere Hintergrundbilder in einem Objekt eingesetzt werden.

Fazit

Ich hoffe, dass die Entwicklung von CSS3 bald abgeschlossen ist und alle großen Browser diesen Standard unterstützen. Das Einzige, was dem Siegeszug von CSS3 dann noch im Wege steht, sind die vielen updatefaulen User. Doch da der Internet Explorer 6 in absehbarer Zeit als erfolgreichster Browser das Internet seinen nachfolgern überlassen muss, hoffe ich, dass wenigstens der Internet Explorer 8 die Nachfolge antritt. YouTube und einige andere große Internetseiten haben bereits den IE6 ausgesperrt.
An dieser Stelle rufe ich abschließend dazu auf, allen euren Freunden, Bekannten, Verwandten und Kollegen einen neuen Browser zu empfehlen. Schließlich sind alle Browser kostenlos und die neuen Browser bieten weit mehr Komfort bei der Bedienung.