Entwickler können HTML5 für das plattformübergreifende Programmieren von Web Apps und hybriden Apps verwenden.

Entwickler können HTML5 für das plattformübergreifende Programmieren von Web Apps und hybriden Apps verwenden.Rudie – Fotolia.com, Google, Microsoft, RIM, Apple

Die moderne Software-Welt wird unüberschaubarer und komplexer. Es gibt verschiedene Zielplattformen, zum Beispiel Smartphones, Tablets sowie Desktop-PCs, und unterschiedliche Betriebssysteme wie iOS, Android und Windows. Eine Prognose vom Marktforschungs-Institut Gartner geht davon aus, dass das Betriebssystem An­droid die Anzahl von Microsoft-Installationen in drei Jahren weltweit auf allen Geräten übertrifft. Das heißt, die Vielfalt der Betriebssysteme und Plattformen wächst in den nächsten Jahren weiter. Außerdem haben sich die Interaktionskonzepte der mobilen Endgeräte durch die Touch-Bedienung grundlegend geändert und erhöhen somit die Anforderungen an die Designer von Anwendungen. Nicht zuletzt ist das Verwenden mobiler Geräte für immer mehr Nutzer im privaten Bereich selbstverständlich. Daher erwarten sie ein entsprechendes Nutzererlebnis zunehmend auch im beruflichen Umfeld.

Wohin des Wegs

Bevor die Entwickler von Industrie-Apps loslegen, müssen sie zunächst klären, ob eine native, eine Web- oder eine hybride App für den jeweiligen Anwendungsfall geeignet ist. Sowohl die Web- als auch die hybride App verwenden HTML5 (Hypertext Markup Language) für die Struktur, die Programmiersprachen CSS für das Layout der Oberfläche und Javascript für die Logik beziehungsweise die Interaktionen. Beim Erstellen einer nativen App werden von jedem Betriebssystem-Hersteller die Programmiersprache, Bibliotheken (SDKs) und eine Entwicklungsumgebung empfohlen. Beispielsweise verwendet Apple für die Erstellung von nativen Apps für iOS die Programmiersprache Objective-C und die Entwicklungsplattform X-Code in Verbindung mit dem iOS Software Developer Kit. Das Programmieren muss auf einem Mac erfolgen und die App steht dann im Apple-eigenen Onlineshop zur Verfügung. Soll die Applikation auf mehr als einer Plattform laufen, muss sich der Entwickler bei nativer Entwicklung in alle Entwicklungstools und Regularien der jeweiligen Hersteller einarbeiten, was zu sehr hohen Kosten führt.

Den Kompromiss suchen

Abhilfe schafft hier die plattformunabhängige Entwicklung von Web- oder hybriden Apps mit HTML5. Erstere laufen im Browser der jeweiligen Zielplattform. Das erstmalige Laden des Programms erfolgt über einen Internetserver. Im Gegensatz zu nativen Apps haben Web Apps nur eingeschränkten Zugriff auf die Hardware-Funktionen des mobilen Endgeräts. Die Arbeitsgeschwindigkeit der Anwendung kann durch die Interpreta­tion des Codes im Browser ebenfalls sinken. Auch das Nutzererlebnis, wie die Darstellung der Elemente und die Interaktionen, könnte durch die Vereinheit­lichung über verschiedene Plattformen hinweg leiden. Die jeweiligen Browser basieren auf unterschiedlichen Rendering und Javascript Engines, was in der Praxis zu einer unterschiedlichen Unterstützung der HMTL5-Elemente und des Javascript Codes führt.

Hybride Apps lösen einige dieser Probleme. Sie werden zunächst plattformun­abhängig mit HTML5 entwickelt und anschließend als native App bereitgestellt. Durch das nachträgliche Hinzufügen von nativem Code lassen sich nahezu alle Hardwarefunktionen der Plattform verwenden. Die Bereitstellung erfolgt wie bei der nativen Variante über den entsprechenden App-Onlineshop.

Bevor es an die Entwicklung geht, müssen die Verantwortlichen entscheiden, welche Art App sie möchten: eine ­native, Web- oder ­hybride App.

Bevor es an die Entwicklung geht, müssen die Verantwortlichen entscheiden, welche Art App sie möchten: eine ­native, Web- oder ­hybride App.M&M-Software

Einfach entwickeln

HTML5 liefert mit CSS und Javascript einen wichtigen Beitrag zur Verbesserung der Benutzeroberfläche für die jeweiligen Gerätetypen, bei gleichzeitig geringeren Entwicklungskosten. Mit HTML5 finden neue Elemente, die jedes für sich eine bestimmte Funktion beinhalten, Einzug in die Beschreibungssprache, um mobile Endgeräte zu unterstützen. Die Vorgängerversion HTML 4 basiert überwiegend auf statischen Elementen für Desktop Browser. In HTML5 rücken die Interak­tionen und die Mobilität mehr in den Vordergrund. Beispielsweise ist es möglich, über das Element ‚Geolocation‘ den Standort des Nutzers zu bestimmen. Neue Video- und Audio-Elemente sollen dem Entwickler helfen, Filme und Musik in Webseiten einzubinden, um sie auf
jeder Plattform abspielen zu können. Das HTML5-Element ‚Application Cache‘ ermöglicht es, die Daten der Anwendung lokal auf dem mobilen Endgerät abzulegen. Somit funktioniert die App auch ohne Internetverbindung. In HTML5 wurden außerdem Elemente definiert, die eine client-seitige Umsetzung von Aufgaben erlauben, die bisher ein Server übernehmen musste. Mit dem Element ‚Web Worker‘ ist es beispielsweise möglich, einen Prozess im Hintergrund zu starten. Der Hauptprozess kann dann über einen ­Benachrichtigungsmechanismus mit dem Hintergrundprozess kommunizieren. Über das Responsive Web Design (RWD) lässt sich die Oberfläche mittels CSS automatisch an die unterschiedlichen Formfaktoren der Geräte anpassen. Beim RWD können beispielsweise die Formfaktoren des Mobilgeräts ausgelesen werden, wie Quer- oder Hochformat. Der Programmierer kann dann eine an den jeweiligen Fall angepasste Darstellung der Oberfläche bereitstellen. Die Entwickler können die HTML5-Funktionen für die plattformübergreifende Programmierung von Web- und hybriden Apps verwenden. Die verschiedenen Browser setzen die Funktionen dann auf den verschiedenen Gerätetypen um. Da die Browserhersteller eng in die HTML5-Weiterentwicklung eingebunden sind, ist eine schnelle Anpassung an den Standard möglich. Aktuell gibt es viele Web- und hybride Apps, die sich in der Oberfläche und dem Verhalten kaum von nativen unterscheiden.

Den Werkzeugkasten sortieren

Die unterschiedlichen Entwicklungswerkzeuge, beziehungsweise Bibliotheken für die plattformübergreifende Programmierung von Web- und hybriden Apps, unterscheiden sich sehr stark in Art und Qua­lität der Unterstützung. Es gibt ver­schiedene Javascript-Erweiterungen, die spezifische Funktionen bereitstellen. Knockout.js beispielswiese ist eine Javascript-Bibliothek, die es ermöglicht, das Model-View-Controller-Muster (MVC) innerhalb von Javascript zu verwenden. Mit dem MVC-Muster werden spätere Änderungen und die Wiederverwendung der Software erleichtert. Es gibt aber auch umfangreiche Javascript-Bibliotheken, wie jQuery Mobile, mit denen sich Apps einheitlich und konsistent auf sämtlichen Plattformen darstellen lassen. Die Basis hierfür liefern UI-Elemente wie Buttons oder Toolbars, mit denen Entwickler die Elemente mittels CSS beliebig in der Darstellung anpassen können. Manche Hersteller, beispielsweise Sencha, bieten komplette IDEs (Integrated Development Environment) an, die weitere Komfort­funktionen, beispielsweise die grafische Zu­sammen­stellung der Oberflächenelemente, Editierfunktionen für HTML, CSS und Javascript, Tests der Programme auf Emulatoren, Debugging und Unterstützung bei der Bereitstellung bieten. Des Weiteren gibt es Anbieter, die eine Web App in eine native überführen und somit eine hybride App erzeugen. Diese Entwicklungsumgebungen stellen auch die Bibliotheken zur Verfügung, um auf die plattformspezifische Hardware zugreifen zu können. Phonegap bietet beispielsweise einen Cloud Service an, über den Entwickler aus einer Web App eine native App generieren können. Derzeit gibt es eine fast unüberschaubare Menge an Frameworks, die eine plattform­unabhängige Programmierung unterstützen, teilweise bauen die Entwicklungswerkzeuge beziehungsweise Bibliotheken aufeinander auf. Die Lizenzkosten, die Wartungsfreundlichkeit des Codes, die Unterstützung beim Debugging und die Erlernbarkeit der Entwicklungswerkzeuge und Bibliotheken sind weitere Kriterien, die bei der Auswahl des passenden Frameworks eine Rolle spielen. Momentan arbeiten die Hersteller intensiv an der Weiterentwicklung der Tools, um die oben beschriebenen Problemen zu lösen.

Blick in die Kristallkugel

Laut den Marktforschern von Gartner dominieren in den nächsten Jahren Apple, Android und Microsoft den Betriebssystem-Markt. Native Entwicklungen für diese Zielplattformen wird es vermutlich weiterhin geben, da sie alle Stärken des mobilen Endgerätes optimal ausnutzen können. Auch das Layout und die Interaktionen lassen sich bei nativen Apps gezielt an das mobile Endgerät anpassen. Allerdings wird durch die Erweiterung der Nutzungsszenarien über den Consumer-Bereich hinaus der Druck auf die Industrie immer größer, plattformunabhängige Applikationen herzustellen. Alle großen Browserhersteller bauen die HTML5-­Unterstützung weiter aus. Daher wird HTML5 der Web-Standard der nächsten Jahre werden. Bibliotheken, die eine plattformunabhängige App-Erstellung ermöglichen, werden erweitert und zunehmend in der Lage sein, professionelle Apps zu erstellen. Aktuell ist die Anzahl verfügbarer, plattformübergreifender Apps in der Industrie allerdings noch gering. Für viele Anwendungsfälle ist HTML5 aber schon jetzt eine Lösung.

Technik im Detail

HTML5

HTML5 ist eine textbasierte Beschreibungssprache für den semantischen Aufbau von Webseiten. Sie soll den bisher geltenden HTML-4-Standard, der 1999 verabschiedet wurde, sowie XHTML und DOM Level 2 ablösen. Die Arbeit an der HTML5-Spezifikation hat 2004 begonnen. Das W3C, das Gremium zur Standardisierung der das World Wide Web betreffenden Techniken, plant, die finale Version Ende 2014 zu verabschieden, die alle Browser-Hersteller unterstützen wollen. Parallel arbeitet die WHATWG, ein Zusammenschluss von Browserherstellern, an einer HTML5-Spezifikation, die allerdings ständig weiterentwickelt werden soll und deshalb ‚HTML Living Standard‘ heißt. Aktuell unterstützen die Browserhersteller den Großteil der HTML5-Funktionen. Die Hauptziele für die Spezifikation waren eine höhere Kompatibilität, Verwendbarkeit, Sicherheit, Vereinfachung und Universalität von Webseiten und Apps.