Mit HTML5 aus der Cross-Plattform-Falle

Der Autor ist Lead Software Architect und HTML5-Spezialist bei Zühlke Engineering. Das Thema Cross-Plattform ist nicht neu. Die unterschiedlichen Desktop-Betriebssysteme stellten Software-Entwickler schon vor Jahren vor die gleiche Problematik. Heute kommen noch mobile Betriebssysteme wie iOS, Android oder Windows RT und darüber hinaus auch noch die verschiedensten Formfaktoren hinzu. Unternehmen, die für ihre Kunden oder Mitarbeitenden mobile Applikationen bereitstellen wollen, sehen der pa­rallelen Entwicklung nativer Applikationen wegen der hohen Investitionen mit Sorge entgegen. Auf der Suche nach einem Ausweg wird HTML5 hoch gehandelt. Gründe gibt es dafür mehrere. Zum einen ist HTML eine weitverbreitete Webtechnologie und damit für die meisten Unternehmen nichts Neues. Sowohl die Web­infrastruktur als auch die technischen Kenntnisse sind oft schon vorhanden, auch weil die Webtechnologie bereits auf dem Desktop gute Dienste zur Lösung der Cross-Plattform-Problematik geleistet hat. Die grosse Aufmerksamkeit, die HTML5 momentan geniesst, beruht aber auch darauf, dass die Technologie bereits gereift ist. Insbesondere das mobile Web basiert auf einer modernen Browserinfrastruktur und einem ausgereiften Ökosystem. So lassen sich selbst funktional komplexe Applikationen benutzerfreundlich, effizient und wartbar entwickeln. Für HTML5 und moderne Browser ist die Unterstützung heterogener Landschaften keine Not, sondern eine Tugend. Denn sie verfügen über Eigenschaften, die für den Einsatz in verschiedenen Umgebungen vorgesehen sind. Bestes Beispiel sind die «Media Queries». Sie ermöglichen die dynamische Adaption der HTML-Oberfläche an verschiedenste Bildschirmgrössen mit CSS3. Das wohl wichtigste Argument, das HTML5 auf die Poleposition katapultiert, ist ein eigentlich banaler Umstand: Das Technologie­gespann HTML, JavaScript und CSS ist als einziges wirklich auf jeder Plattform verfügbar. Dies verdanken wir insbesondere Apple, das die Adobe-Flex-Technologie vom iOS verbannt hat. Damit ist HTML5 automatisch der Platzhirsch. Lesen Sie auf der nächsten Seite: Anzätze zur Plattform-Integration

HTML, JavaScript und CSS versprechen also den  berühmten Synergieeffekt, der dank der Wiederverwendung technischer Assets die Unterstützung verschiedenster Geräte und Betriebssysteme erleichtert. Es stellt sich dabei aber die Frage, wie denn nun die Webtechnologie in einer Applikation auf den verschiedenen Plattformen integriert werden kann. Dafür gibt es mehrere Ansätze.

Mobiles Web

Der Zugang zu einer Applikation über einen Webbrowser auf einem mobilen Gerät ist der leichtgewichtigste aller Ansätze. Der Benutzer gelangt – wie vom Desktop gewohnt – über eine Webadresse oder ein Lesezeichen zur Applikation. Die Applikation ist komplett in HTML geschrieben. Damit verspricht sie den höchsten Grad an Wiederverwendbarkeit und den kleinsten Zusatzaufwand für die Anpassung an verschiedene Plattformen. Die Nachteile: Bei dieser Lösung sind die Möglichkeiten der Integration in das Betriebssystem gering. Punkto User Experience müssen zudem Einschränkungen in Kauf genommen werden. Die Applikationen sind zum Beispiel nicht im App Store zu finden. Auch die Benutzung von Hardware-Sensoren oder einer Kamera ist aus dem Browser nur beschränkt möglich. Dennoch bietet das mobile Web für manchen Anwendungsfall eine gute Option, insbesondere wenn die Reichweite der Lösung im Mittelpunkt steht.

Hybride Applikationen

Dieser Ansatz ermöglicht weitgehend die Integration in das Betriebssystem. Frameworks wie Apache Cordova schliessen die Lücke zwischen Webapplikation und Gastbetriebssystem. Die HTML-Applikation läuft nicht in einem Browser, sondern in einem nativen Applikationsgerüst. Die Applikation ist nach wie vor komplett in HTML und JavaScript geschrieben, läuft aber in einer Browserkomponente, die von der App intern gestartet wird. Für den Benutzer ist der Umgang mit einer hybriden App derselbe wie mit einer nativen App. Er installiert sie über den App Store und startet sie wie eine native App. Der Entwickler hingegen hat Zugriff auf weitere Funktionen wie Kamera, Accelerometer oder Notifications, die im mobilen Web nicht garantiert sind. Das Framework schliesst nicht nur die Lücke zur Hardware, sondern garantiert auch Support für HTML5-Standards, die sonst noch nicht browserübergreifend verfügbar sein könnten. Hybride Applikationen sind bezüglich Integration und Verteilung (App Store) von nativen Applikationen nicht mehr zu unterscheiden. Die Nachteile: Dem «Look and Feel» der Applikation sind gewisse Grenzen gesetzt. Mit CSS3 lassen sich zwar bezüglich Design  und Usability hervorragende
Applikationen erstellen. Aussehen, Animationen und Verhalten von nativen Oberflächen perfekt zu imitieren, ist aber kaum möglich respektive mit einem ausser­ordentlich grossen Aufwand verbunden.

HTML-Komponenten

Beim dritten Ansatz werden HTML-Komponenten in die ansonsten native Oberfläche eingebettet. Damit lässt sich eine perfekte Integration in das native Benutzererlebnis erreichen. Die Navigation innerhalb einer App und typische Bedienelemente wie Kopf- oder Fussleisten, aber auch der Einsatz von Hardware-Buttons folgen den Design­richtlinien der nativen Systeme. Innerhalb der Applikation werden einzelne Bereiche in HTML implementiert, die dann für verschiedene Plattformen wiederverwendet werden können. So lassen sich die Kosten optimieren. Die Nachteile: Die perfekte Integration in die jeweilige Plattform hat ihren Preis. Die Wiederverwendbarkeit ist auf kleine Teile der Applikation beschränkt und zur Entwicklung braucht es beträchtliche Kenntnisse, sowohl der nativen Plattformen als auch der Webtechnologie. Lesen Sie auf der nächsten Seite: Entwicklung bleibt anspruchsvoll

Mit HTML bieten sich also verschiedene Optionen, der heterogenen Systemlandschaft entgegenzutreten. Mit der Wiederverwendung ganzer Applikationen oder einzelner Komponenten lässt sich der Aufwand minimieren. HTML bringt vieles mit, was in heterogenen Umgebungen von Nutzen ist. Dennoch sollte nicht übersehen werden, dass die Cross-Plattform-Entwicklung immer anspruchsvoll bleiben wird – völlig unabhängig von der Technologie, mit der das Vorhaben in Angriff genommen wird. Allein die Bewältigung der vielfältigen Gerätelandschaft bringt Herausforderungen für die Entwicklung, den Build-Prozess und nicht zuletzt für das Testing mit sich. Ohne die Bereitschaft, beim nativen «Look and Feel» Kompromisse einzugehen oder zum Beispiel auf extravagante Animationseffekte zu verzichten, ist der Weg auch mit HTML steinig. Wer hingegen kompromissbereit ist und die Auslieferung von Funktionalität in den Mittelpunkt stellt, kann mit HTML5 einiges erreichen.