HTML 5 und CSS 3 in der Praxis, Teil 1: Ausgangslage
Dieser mehrteilige Artikel dokumentiert anhand eines realen Projektes, wie weit sich HTML 5 und CSS 3 bereits heute in der Praxis einsetzen lassen und wo Vorteile aber auch Stolpersteine zu finden sind.
Was schon länger angenommen wurde, ist seit kurzem offiziell: Das W3C hat sich entschlossen, per Ende 2009 die XHTML 2.0-Arbeitsgruppe einzustellen (ich habe berichtet). Mit diesem Beschluss dürfe das Interesse und hoffentlich auch die Weiterentwicklung von HTML 5 zusätzlich an Fahrt bekommen. Aber auch die fast untrennbar mit HTML verbundene Formatierungssprache CSS wartet seit 1998 auf ein grösseres Update auf Level 3.
Doch welche Vorteile erwarten uns mit den neuen Versionen dieser Web-Urgesteine und wovon können wir heute schon profitieren? In den letzen Monaten habe ich mich recht intensiv mit dem Thema auseinandergesetzt und gespannt die teils heftigen Diskussionen verfolgt. Testcases sind in der Blogosphäre denn auch wie Pilze aus dem Boden geschossen. Doch noch zu selten ist der Einsatz in der Praxis bei ganzen Websites zu finden. Und noch seltener habe ich beide neuen Technologien in Symbiose miteinander unter einem Dach erlebt, denn das eine wird in Zukunft nicht ohne das andere eingesetzt werden.
Nun ebenfalls eine weitere Test-Page aufzubauen, die dann erfahrungsgemäss doch nicht mehr weiter gepflegt wird, wäre dann auch nicht das Richtige gewesen. Denn Flexibilität im Einsatz mit den neuen Sprachen ist momentan aus verschiedenen Gründen gefragt:
- Beide Spezifikationen sind noch kein finaler Standard, sondern lediglich ein Entwurf. Änderungen sind damit zumindest theoretisch jederzeit möglich.
- Eine Best-Practice, wie wir es für (X)HTML oder CSS 2.x kennen, hat sich bei den neuen Versionen noch nicht eingespielt. Das führt zu Unsicherheit oder gar Fehlinterpretationen in der Anwendung.
- Die Browser sind momentan am Wettrüsten bei der Unterstützung neuer Elemente beider Sprachen. So können mit fast jeder neuen Browsergeneration zusätzliche Bestandteile genutzt werden. Zudem ist die Unterstützung noch nicht in allen User Agents implementiert, doch davon später mehr.
Dass unter diesen Umständen der Einsatz bei Kundenprojekten mit Vorsicht zu geniessen ist, versteht sich von selbst. Denn eine ständige Wartung und Anpassung an neue Gegebenheiten ist damit unumgänglich, denn nur so können entsprechende Erfahrungen gesammelt werden. Trotzdem sollte als Testcase eine reale Website dienen. Und siehe da, ein Opfer war schnell gefunden: Freundlicherweise hat Mischa seinen Blog für dieses Experiment zur Verfügung gestellt.
Die in den nächsten Wochen folgende Artikelserie soll verschiedene Bereiche des Projektes genauer beleuchten. Der grobe Fahrplan dürfte in etwa so aussehen:
- Umrüsten von (X)HTML zu HTML 5
- Grundlagen: Doctype, Charset, Syntax, Kompatibilität
- Strukturierung, Semantik
- Formulare
- Kleider machen Leute: CSS 2.1 mit CSS 3 anreichern
- Grundlagen: Kompatibilität
- @font-face
- multi-column
- text-shadow, box-shadow
- border-radius
- RGBa, opacity
- :nth-child
- CSS-transitions
- Accessibility
- WAI-ARIA
Soviel bereits im Voraus: Die neuen Möglichkeiten von HTML 5 und CSS 3 machen enormen Spass und vor allem Appetit auf mehr! In Kürze steigen wir an dieser Stelle tiefer ins Thema ein.
Am 4. Juni 2010 um 13:26 Uhr
Bin gespannt wann es weiter geht mit infos…