kontakt

+49 421 20696 - 0
info@team-neusta.de

HTML5 – Hype und Realität

HTML5 Logo

HTML5 ist zur Zeit eines der angesagtesten Themen in der IT. Dies ist umso interessanter da es eigentlich ein sehr technisches Thema ist, aber auch weit entfernt von der Technik bei Entscheidern präsent ist und deren Strategien beeinflusst.

Die Firmengruppe team neusta bietet ein breites Portfolio an IT-Dienstleistungen und trifft auf das Thema an verschiedensten Stellen. Dabei sind zwei Themen besonders häufig vertreten:

  1. Im Bereich von Web Seiten soll HTML5 als Flash-Ersatz genutzt werden um mit modernen Methoden ansprechende Web-Anwendungen für alle Browser und Plattformen zu ermöglichen.
  2. HTML5 wird als Möglichkeit wahrgenommen mobile Anwendungen für mehrere Plattformen einheitlich zu entwickeln und den Aufwand von nativer Entwicklung zu reduzieren.

In diesem Artikel wollen wir einen kurzen Überblick zu HTML5 geben und die beiden genannten Ansätze hinterfragen. 

Was ist HTML5

HTML5-Technologien

Quelle: http://cdn2.peterkroener.de/uploads/2010/05/HTML5-Technologien3.png

HTML5, so wie der Term benutzt wird ist zunächt einmal ein – wenn nicht DAS – Buzzword. Abgesehen von einigen Experten haben die meisten Leute nur eine sehr diffuse Vorstellung von dem was HTML5 ist und was einen “HTML5 fähigen” Browser ausmacht.

Fälschlicherweise wird im Markt HTML5 als Bezeichnung für eine Reihe von Dingen, Techologien und Konzepten benutzt und wird genauso “kreativ” benutzt wie das berühmte Web 2.0 (siehe auch [4]).

Zunächst einmal ist HTML5 ein neuer Standard, der zur Zeit in der Entwicklung ist. Nach aktuellem Zeitplan soll HTML5 im Jahr 2014 als W3C-Empfehlung (Recommendation) veröfftentlich werden.

Stand heute gibt es eine ganze Reihe von Funktionen und Konzepten, die zum Teil schon recht weit verbreitet sind und von vielen Browsern unterstützt werden, und solche, die nur mit großem Aufwand durch externe Bibliotheken implementiert werden können.

Inhaltlich liefert HTML5 nun alles das, was heute Webanwendungen bereits benutzen und benötigen und nur mit großem Aufwand und proprietären Lösungen umsetzbar ist. Dabei ist Flash nur ein Beispiel. HTML5 hat neue Elemente um Dokumente weiter semantisch zu sturkturieren und bildet auch Funktionen wir z.B. Grafik, Audio und Video ab. Mehr Informationen hierzu finden sich in [1] und [2].

Wichtig ist, dass HTML5 heute kein geschlossener, vollständiger Standard ist, sondern eher eine Sammlung von Dingen, die mehr oder weniger hilfreich und mehr oder weniger verbreitet sind. Die Tabellen, die HTML5-Unterstützung in Desktop-Browsern und auf mobilen Geräten zeigen deutlich, wie unterschiedlich die einzelnen Clients sein können.

Was ist nun mit den oben beschriebenen Ansätzen?

Szenarien Desktop

HTML5 steckt in der Webentwicklung noch in den Kinderschuhen. In den letzten Monaten kamen in der team neusta Agentur Interwall  immer öfter Wünsche dass komplett auf Flash verzichtet werden soll und hier “zukunftssicher” auf HTML5 gesetzt wird. Wenn man diesen Weg wirklich konsequent beschreitet bedeutet das, dass man leider einen großen Teil seiner Nutzer von seiner Webseite ausschließt – denn schon die neuen semantischen HTML5 Elemente erweisen sich in dem Internet Explorer bis Version 8 als nicht funktionsfähig. Schlimmer noch: Das komplette Layout kann auseinanderbrechen. Zwar kann man diese Browser im Nachhinein durch Einbinden von Zusatzbibliotheken dieses Verhalten beibringen, doch muss man hier im Kauf nehmen, dass man davon abhängig ist, dass ein Nutzer, vielleicht sogar ein potentieller Kunde, Javascript aktiviert hat. Auch nicht zu vergessen: Jedes zusätzliche Stück Code kann die Webseite verlangsamen.

Eine weitere Möglichkeit Besuchern mit älteren Browsern ein gleichbleibendes Surferlebnis zu bieten ist für diese eine alternative Version zu erstellen. D.h. wird ein älterer Browser erkannt, bekommen diese eine funktionsfähige, leicht abgespeckte und veränderte Seite.  Der Besucher merkt hier keinen Unterschied. Allerdings kann man mit der Anpassung für ältere Browser auch mindestens ein Drittel der Entwicklungszeit draufschlagen.

Aber auch wenn noch nicht alles problemlos benutzbar ist kann man einige Elemente trotzdem heute schon benutzen. Wie z.B. das neue Video Element. Dieses ist insofern clever programmiert weil hier bereits an ältere Browser gedacht wurde. Das Videoelement kann mehrere Quellen beinhalten, was für verschiedene Browser ein Video in einen anderen Format laden kann. Und sollte HTML5 nicht unterstützt oder kein entsprechendes Videoformat hinterlegt worden sein, kann hier immer noch auf ein traditionelles Flash-Video zurückgegriffen werden. Der einzige Nachteil besteht also darin, dass ein Video zur Zeit in bis zu fünf Formaten hinterlegt sein werden muss um ein garantiertes Abspielen beim Besucher garantieren zu können. Und das Adobe Flash Plugin ist – laut Angaben von Adobe – auf 99% aller Rechner installiert.

Flash vs. HTML5

Spätestens seit dem IPad, das bekanntermaßen kein Flash unterstützt, kommen öfter Wünsche dass komplett auf Flash verzichtet werden soll und hier “zukunftssicher” auf HTML5 gesetzt wird. Dies ist schon insofern schwierig, weil leider die Technik an sich bereits falsch interpretiert.

Als Apple mit Einführung des iPhones komplett auf Flash verzichtete musste diese Firma seinen Kunden natürlich einen Ersatz bieten und erstellte viele Beispiele mit HTML5, welche durchaus hübsch anzusehen und – nicht “HTML5” waren. Eigentlich wurde hier größtenteils CSS3 Animationen in Zusammenspiel mit Javascript angepriesen. Das war nur einer der vielen Ausgangspunkte für das generelle Falschverständnis von puren HTML5 und die Entstehung eines gleichnamigen Buzzwords.

Flash ist, wie bereits erwähnt, auf 99% aller Rechner installiert. Daraus hat sich ergeben, dass heute viele Webseiten komplett mit Flash umgesetzt werden. Schließlich ergeben sich hier eine Vielzahl an Möglichkeiten Ideen umzusetzen, welche mit Standard Webtechnologien nicht möglich sind. Das Abspielen von Audio und Videodateien oder komplexe Animationen sind mit Adobe Flash schnell realisiert.

Dieses soll bald auch mithilfe von HTML5 und CSS3 möglich sein. Für kleinere Animationen bspw. in einer Menünavigation kann man CSS3 nutzen. Für komplexere Applikationen bietet sich das HTML5 Canvas Element an. Aber Canvas befindet sich – wie viele andere neuen HTML5 Elemente – noch in den Kinderschuhen.

Mit Flash kann qualitativ hohe Qualität erreicht werden – und es wird bereits seit einigen Jahren als Quasi-Standard angesehen. Das Problem mit Flash ist allerdings: Es ist kein offener Standard. Als Entwickler und als Nutzer ist man von einer Firma abhängig. Adobe entscheidet was das Flash-Plugin kann oder nicht kann. Funktionen die man jetzt benutzt könnten theoretisch von einen auf den anderen Tag gestrichen werden und unsere Flash-Webseite könnte nicht mehr funktionieren.

Aber auch wenn Flash geschlossen ist, ist die Verbreitung des Flashplayer immer noch höher als die Verbreitung von HTML5 fähigen Browsern. Außerdem hat es ein Unternehmen wie Adobe wesentlich einfacher, ein neues Feature in ihren Player einzuführen, als die großen Standardisierungsgremien, die jedes Feature auf ihre Art demokratisch einführen und dann auf Browsersupport hoffen müssen.

Flash wird uns sicherlich noch eine Weile erhalten bleiben, da mit HTML5 in seiner jetzigen Form noch nicht weit genug und vor allen einheitlich genug verbreitet ist.. Sicher ist auch, dass keines der beiden Programme das andere vollständig ersetzen kann, weshalb man auch nicht von Konkurrenz sprechen sollte, sondern als gegenseitige Ergänzung.

Szenario Mobile – Plattformunabhängige Apps mit HTML5

Die neusta mobile solutions entwickelt Apps für fast alle mobilen Plattformen. Gerade bei Smartphone Apps sollen in der Regel mehrere Plattformen bedient werden. Da liegt es nahe mit der Technologie HTML5 universelle Apps zu entwickeln. Einmal entwickeln, auf allen Plattformen nutzen.

Hier sieht die Realität leider ziemlich düster aus. Mit HTML5 tauschen wir das Problem der unterschiedlichen Betriebssysteme durch das Problem der unterschiedlichen Browser. Aus der Tabelle wird ersichtlich, dass die einzelnen Systeme HTML sehr unterschiedlich unterstützen. So finden wir bei gängigen Geräten Scores (siehe [3]) von unter 100 bis knapp über 300 von 475 möglichen Punkten. Das bedeutet, dass bei jedem Feature, dass genutzt werden soll erst geprüft werden muss wie weit es von den einzelnen Systeme überhaupt unterstützt wird. Hinzu kommt, dass Layouts trotz Standards wie CSS in verschiedenen Browsern nicht immer gleich dargestellt werden. Hier explodieren oft die Aufwände für das letzte Fine Tuning.

Hinzu kommt, dass die Implementierung von komplexer Logik in HTML5-Ansätzen mittels JavaScript zum einen aufwändiger ist als nativ, zum anderen können Gerätenahe Funktionen und Performance optimierende Dinge, die das jeweilige Betriebssystem anbietet, nicht oder nur mit Einschränkungen genutzt werden.

Ist also alles schlecht? Nein, ganz sicher nicht. HTML5 bietet im mobile Bereich schon heute einige Dinge, die Aufwand reduzieren und Dinge erleichtern:

  • Spezielle Controls werden bereits überall unterstützt. Nutzt man diese bei einer mobilen Web Seite, kann z.B. definiert werden, dass ein Eingabefeld eine Emailadresse oder eine Zahl enthält. Dies führt dazu, dass die Smartphones dann ein optimiertes Tastaturlayout einblenden.
  • Telefonieren oder SMS senden kann direkt aus der Webseite initiiert werden.
  • Layout-Elemente und 2D-Grafik wird fast überall unterstützt und ermöglicht so Plattformunabhängige Ausgabe

Fazit

Zusammenfassend kann man also folgende Regeln aufstellen, die Ihnen das Leben mit HTML5 erleichtern:

  1. Achtung! Buzzword-Alarm!
  2. Nicht alles was HTML5 genannt wird ist HTML5.
  3. Bis HTML5 durchgängig wirklich “da” ist wird es noch einige Zeit dauern.
  4. HTML5 ist eine großartige Perspektive.
  5. Punktuell biete HTML5 schon heute einige Technologie die Lösungen vereinfachen.

 

HTML5-Unterstützung auf Smartphones und Tablets – Score nach www.html5test.com

Gerät Betriebssystem Browser Score
(von 475 möglichen)
iPhone 3G iOS 4 Safari 207
iPhone 4 iOS 5.0.1 Safari 305
IPad 1 iOS 5.0.1 Safari 305
Huawei Ideos X3 Android 2.3.3 Standard 182
Google Nexus One Android Cyanogenmod 7.1.0 Standard 182
HTC Sensation Android Standard 216
HTC Sensation Android Dolphin 182
HTC G1 Android 1.5 Standard 49
HTC Flyer Android 3.2.1 (Sense) Standard 226
HTC Hero Android 1.6 Standard 151
Motorola Defy Android 2.2.2 Standard 182
Huawei Mediapad Android 3.2 Standard 222
Huawei Mediapad Android 3.2 Dolphin 256
Blackberry Torch 9800 Blackberry Standard 266
Blackberry Bold 9700 Blackberry 6.0 Standard 258
Nokia N97 Symbian Standard 19
Nokia N97 Symbian Opera Mini 54

von Holger Bothmer, neusta mobile solutions GmbH
und Florenz Heldermann

Links
[1] http://de.wikipedia.org/wiki/HTML5
[2] http://www.selfhtml5.org/2010-html5-features/95/
[3] http://www.html5test.com
[4] http://www.peterkroener.de/was-ist-html5-und-was-nicht-und-was-haette-der-kaiser-dazu-gesagt/

Share