Browser, Standards, Workarounds

Ratgeber HTML5: Stabilität in der Praxis

07.06.2011 von Sven Hähle
Ist HTML5 praxisreif? Kann es für stabilere Webapplikationen sorgen? Oder ist die Stabilität nur eine Sache des Browsers? Mit diesen Fragen beschäftigt sich dieser HTML5-Praxis-Beitrag. So viel vorweg: Die Stabilität wird eine schwere Aufgabe für Entwickler beim Umstieg auf HTML5.

Die schlechte Nachricht zuerst: Die Stabilität ihrer Webanwendungen zu gewährleisten wird für Entwickler beim Umstieg auf HTML5 sicher eine der größten Herausforderungen. Die gute Nachricht ist: Die Aufgabe lässt sich lösen.

HTML ist eine Beschreibungssprache. Reiner HTML-Code beschreibt dem Webbrowser, was er zu tun hat. Wie er es tut, bleibt ihm überlassen. Deshalb ist es normal, wenn ein und dieselbe Website in verschiedenen Browsern unterschiedlich dargestellt wird. Die sich daraus ergebende Herausforderung ist hinlänglich bekannt: Webapplikationen so zu optimieren, dass sie trotz verschiedener Browser und Plattformen gleich aussehen und funktionieren - mit anderen Worten: dass sie stabil laufen.

Bildergalerie:
HTML5 und die Stabilität
In Arbeit: HTML5 ist nach wie vor kein Standard, sondern wird vom W3C als Arbeitsentwurf (Working Draft) geführt. Wann die Standardisierung erfolgen wird, ist derzeit unklar.
HTML5 und die Stabilität
Altersgemäß: Die Website canIuse.com vergleicht die Unterstützung von HTML5-Features in den wichtigsten aktuellen und älteren Browsern und zeigt, wo es noch Schwachstellen gibt.
HTML5 und die Stabilität
Hilfreich: Die Experten der Website HTML5 Doctor beschäftigen sich unter anderem mit diversen Workarounds, damit HTML5-Features auch in Browsern wie dem IE8 nutzbar sind.
HTML5 und die Stabilität
Abhilfe: CSS3please.com liefert ein Stylesheet, das bestimmte CSS3-Eigenschaften für viele ältere Browser nachrüstet, zum Beispiel gerundete Ecken oder durchsichtige Elemente.

Daran ändert sich auch durch HTML5 nichts. Im Gegenteil, es kommt sogar eine erschwerende Tatsache hinzu: Der Begriff HTML5 meint nicht nur den reinen HTML-Code, sondern ein Sammelsurium verschiedenster Webtechnologien. Als HTML5 wird landläufig ein bunter Mix aus HTML, JavaScript/Ajax, Datenbankanbindungen und anderen Technologien bezeichnet. Diese Mischung macht es besonders aufwendig, Stabilität für alle Browser und Plattformen zu gewährleisten.

Stabilität - eine Frage des Standards?

HTML5 kann niemals stabil sein, behaupten manche Experten. Sie argumentieren, dass Entwickler gar keinen Einfluss auf die HTML5-Spezifikation in ihrer Gesamtheit hätten, sondern diese einfach hinnehmen müssten. Und in der Spezifikation gebe es nun einmal stabile und instabile Bestandteile. Das Fazit: Entwickler könnten allenfalls jeden Code-Abschnitt ihrer Applikation so optimieren, dass unter allen Zielsystemen eine optimale Stabilität gewährleistet ist.

In Arbeit: HTML5 ist nach wie vor kein Standard, sondern wird vom W3C als Arbeitsentwurf (Working Draft) geführt. Wann die Standardisierung erfolgen wird, ist derzeit unklar.

Andere Fachleute sind der Meinung, dass jede von aktuellen Browsern unterstützte HTML5-Funktion automatisch stabil sei. Aus ihrer Sicht müssten Entwickler nur darauf achten, dass sie keine experimentellen Features einsetzen. Wer hat recht?

Fest steht: Das W3C arbeitet daran, HTML5 so schnell wie möglich zu standardisieren. Solange HTML5 noch ein Arbeitsentwurf (Working Draft) ist, wird es naturgemäß einige experimentelle Komponenten geben, die vergleichsweise unstabil sind. Man kann davon ausgehen, dass es in den fertigen Standard aber nur solche Features schaffen werden, die das W3C als stabil ansieht. Die Frage ist also eher, wann HTML5 vom Working Draft zum Standard wird. Und darauf gibt es zurzeit leider keine verlässliche Antwort.

Stabilität - eine Frage des Browsers?

Während das W3C noch um die Standardisierung von HTML5 bemüht ist, sorgen die Browser-Hersteller mit den aktuellen Versionen der Programme bereits für eine breite Unterstützung der wichtigsten HTML5-Features.

Eine weitestgehend einheitliche Darstellung ein und derselben Website ist unter der neuesten Browser-Generation auf jeden Fall einfacher zu erreichen als früher. Selbst der neue Internet Explorer 9 aus dem Hause Microsoft kann generell gut mit HTML5 umgehen, auch wenn im Vergleich zu anderen Browsern noch wichtige Features fehlen - doch dazu später mehr.

Altersgemäß: Die Website canIuse.com vergleicht die Unterstützung von HTML5-Features in den wichtigsten aktuellen und älteren Browsern und zeigt, wo es noch Schwachstellen gibt.
Foto: canIuse.com

Das eigentliche Problem liegt im Detail: Microsofts Internet Explorer 9, Mozilla Firefox 4, Google Chrome 10 und Safari 5 von Apple unterstützten bestimmte HTML5-Features auf unterschiedliche Weise. Während manche Funktionen in dem einen Browser tadellos laufen, sind genau diese Funktionen in anderen Browsern Fehlanzeige - und umgekehrt.

Und zu allem Überfluss sind manche HTML5-Tags, die von jedem modernen Browser richtig interpretiert werden, nicht gleichermaßen Garant für Stabilität. Aus unserer Sicht kommen Entwickler deshalb nicht umhin, ausgiebig mit verschiedenen Systemen und Bedingungen zu experimentieren - und bei etlichen HTML5-Lösungen zu tricksen, um Stabilität zu gewährleisten.

HTML5 in älteren Browsern

Damit auf HTML5 basierende Websites auch für Besitzer älterer Browser nutzbar sind, bedarf es sowieso diverser Tricks. Browser wie der IE8 oder Firefox 2 lassen sich mithilfe von JavaScript-Hacks und anderen Methoden in die Lage versetzen, wesentliche HTML5-Tags zu nutzen. Im Netz kursieren dafür diverse Anleitungen, zum Beispiel jene von HTML5 Doctor. Um die neuen HTML5-Tags in älteren Browsern auch in Verbindung mit CSS3 nutzen zu können, sind ebenfalls Workarounds nötig. Beispielsweise bietet die Website css3please.com eine Lösung in Form eines Cross-Browser-Stylesheets.

Hilfreich: Die Experten der Website HTML5 Doctor beschäftigen sich unter anderem mit diversen Workarounds, damit HTML5-Features auch in Browsern wie dem IE8 nutzbar sind.

In HTML5 ist es erlaubt, Code durch das Weglassen bestimmter Tags zu verkürzen. Im Hinblick auf die Kompatibilität zu älteren Browsern und die allgemeine Stabilität Ihrer Anwendungen raten wir davon dringend ab. Auf die Tags <body>, </body>, <head> und </head> sollten Sie auf gar keinen Fall verzichten - der Internet Explorer 8 und seine Vorgänger können damit nicht umgehen.

Welche älteren Browser in der Entwicklung neuer Webapplikationen überhaupt noch berücksichtigt werden, darüber lässt sich streiten. Inzwischen ignorieren mehr und mehr Entwickler den Internet Explorer 6, das größte Problemkind unter den Browsern. Selbst eine Website-Optimierung für den Internet Explorer 7 scheint fraglich, seit der IE9 auf dem Markt ist. Den Internet Explorer 8 sollten kluge Entwickler in ihre Pläne einbeziehen, auch wenn er HTML5 nur rudimentär unterstützt. Die schon erwähnten Workarounds schaffen Abhilfe.

Abhilfe: CSS3please.com liefert ein Stylesheet, das bestimmte CSS3-Eigenschaften für viele ältere Browser nachrüstet, zum Beispiel gerundete Ecken oder durchsichtige Elemente.

Weniger problematisch als die verschiedenen Internet Explorer sind alle anderen Browser, und zwar aus einem Grund: Nutzer der Alternativ-Browser steigen in der Regel schnell auf die jeweils aktuellste Version um. Deshalb sind die Marktanteile älterer Browser, die für die Applikationsentwicklung problematisch werden könnten, sehr gering. Aus unserer Sicht kann deshalb auf die Optimierung für Firefox 1 und 2 sowie frühe Chrome- und Safari-Varianten getrost verzichtet werden. Noch ältere und exotische Browser spielen erst recht keine Rolle mehr - bestes Beispiel: der Internet Explorer unter Mac OS.

Probleme im Internet Explorer 9

Microsoft gibt an, mit dem Internet Explorer 9 in Sachen HTML5-Unterstützung und Kompatibilität mit aktuellen Webstandards auf dem neuesten Stand zu sein. Die Realität sieht leider anders aus, auch wenn der IE9 der bislang beste Internet Explorer sein mag. Der Internet Explorer 9 ist kein fehlerbehaftetes Problemkind mehr, wie es seine Ahnen IE6 und IE7 waren. Zudem ist er deutlich leistungsfähiger als der IE8. Und der neue Browser unterstützt auch viele wichtige HTML5-Features. Allerdings fehlen aus Entwicklersicht auch einige, die bei Weitem nicht unwichtig sind.

Wichtige HTML5-Features, die der Internet Explorer 9 bietet, sind zum Beispiel:

Wichtige HTML5-Features, die dem Internet Explorer 9 fehlen, sind zum Beispiel:

Auch wenn er gerade erst erschienen ist, beurteilen manchen Experten den Internet Explorer 9 aufgrund der fehlenden HTML5-Features als unzeitgemäß. Als Technology Evangelist von Mozilla mag Paul Rouget als durchaus parteiisch gelten, aber wenn man ihm Glauben schenkt, so hinkt der Internet Explorer 9 seiner Konkurrenz sogar um mindestens zwei Jahre hinterher

Auf seiner Website listet Rouget die oben genannten und etliche weitere HTML5- und CSS3-Features auf, die es noch immer nicht in den Internet Explorer geschafft haben. Um seine Meinung zu untermauern, zieht Rouget Verfahren wie den HTML5 Browser Test und CanIus.com heran. Laut Microsoft zeigen diese Tests allerdings lediglich das Vorhandensein, aber nicht die Tiefe der Implementierung verschiedener Features. Allerdings spricht Microsoft selbst von "Real-World-Tests". Hier muss sich wohl jeder Entwickler eine eigene Meinung bilden.

Internet Explorer 9 und Browser-Weichen

Lange Zeit waren Entwickler gezwungen, für den Internet Explorer Browser-Weichen einzusetzen. Für den Microsoft-Browser wurde spezieller HTML- und JavaScript-Code genutzt, der Kompatibilitätsprobleme mehr oder weniger gut kompensierte. Für den Internet Explorer 9 ist dieses Vorgehen prinzipiell nicht mehr notwendig - es kann sogar kontraproduktiv sein. Denn bezieht sich eine Browser-Weiche generell auf den IE, kann es leicht passieren, dass Webseiten zwar im IE8 richtig, dafür aber im IE9 falsch dargestellt werden. IE-Browser-Weichen müssen die Version 9 separat berücksichtigen. Die Abfragen müssen so gestaltet werden, dass IE9-Nutzer denselben Code bekommen wie Anwender von Firefox, Chrome und Safari.

Achtung: Browser-Weichen ersetzen nicht die generelle Prüfung, ob ein HTML5-Feature von einem Browser unterstützt wird oder nicht. Unabhängig vom Einsatz der Abfragen bleibt ein ausführliches Testen unabdingbar.

Wenn eine Website noch nicht für den IE9 angepasst wurde, kann man sie notfalls in einen Kompatibilitätsmodus schicken. Der IE9 stellt sie dann so dar, als würde sie im IE8 aufgerufen. Dazu fügen Sie in den HTML-Header folgende Code-Zeile ein, die andere Browser als der Internet Explorer ignorieren:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

Fazit

HTML5 ist praxisreif, aber leider nur eingeschränkt nutzbar. Die Stabilität von Webapplikationen unter allen Browsern und Plattformen zu gewährleisten ist für Entwickler derzeit sehr schwierig - mit viel Experimentieren und etlichen Workarounds aber nicht ganz aussichtslos. Sowohl das W3C als auch die Browser-Hersteller haben noch viel zu tun.

Das W3C muss dafür sorgen, dass HTML5 als Standard nur noch stabile Elemente enthält - sofern das durch eine Standardisierung gewährleistet werden kann. Die Browser-Hersteller, insbesondere Microsoft mit dem Internet Explorer, müssen für eine weiter verbesserte Unterstützung der HTML5-Features sorgen. Die Internetwelt verlangt dabei nach einer neuen Einheitlichkeit, die es bis heute leider immer noch nicht gibt. Ob es sie jemals geben wird, steht in den Sternen. (mje)