HTML5 für Mobile Web

Von Bernd Pehlke und Mario Flucka

HTML5 und jQuery sind die Mittel der Stunde, wenn es darum geht, angepasste Anwendungen für Mobile Devices zu entwickeln. Smartphones und Tablets bieten gerade Unternehmen große kommunikative Möglichkeiten, stellen sie aber auch vor neue Herausforderungen. Denn User werden immer anspruchsvoller, was die Gestaltung und den Aufbau von mobilen Anwendungen angeht. Auch die Einbindung von Geolocation spielt in diesem Zusammenhang eine immer wichtigere Rolle.

Spezielle Enterprise-Apps können Unternehmensprozesse hervorragend unterstützen und werden in diesem shortcut anhand von zwei Praxisbeispielen vorgestellt. Auch Webseiten können dank verbesserten Technologien heute so gestaltet werden, dass sie nativen Apps in nichts nachstehen. Genau darum geht es im zweiten Teil des shortcuts. Der dritte Teil thematisiert das vom W3C spezifizierte Geolocation API, das von immer mehr Browsern unterstützt wird und auch Usern ohne GPS-Empfänger standortbezogene Informationen zur Verfügung stellt.

• Sprache: Deutsch
• Herausgeber: entwickler.press
• Erscheinungsdatum: 30. Juni 2012
• ISBN: 9783868024180

Buchvorschau

Bernd Pehlke, Mario Flucka

HMTL5 für Mobile Web

ISBN: 978-3-86802-418-0

© 2012 entwickler.press

Ein Imprint der Software & Support Media GmbH

1 HTML5 im mobilen Unternehmenseinsatz

von Bernd Pehlke

In zahlreichen Unternehmen spielt Mobilität eine große Rolle. In vielen Bereichen, wie z. B. dem Vertrieb, sind Mitarbeiter im Außendienst unterwegs, um Produkte und Lösungen an Kunden zu verkaufen. Der mobile Zugriff auf Geschäftsdaten und Applikationen ist heute dank Notebooks und UMTS oder WLAN selbstverständlich geworden. Doch im Trend liegen Geräte, die immer kleiner und integrierter sind, wie z. B. Tablets oder Smartphones. Diese Geräte leisten heute zum Teil das, wofür man früher einen vollständigen Fat Client PC benötigt hat. Daher werden sie nicht nur für Mitarbeiter im Außendienst verwendet, sondern immer häufiger auch als Notebook-Ergänzung innerhalb des Unternehmens. Neben E-Mail, Kalender und Webseiten können diese Geräte dank vielfältiger individueller Apps auch interne Geschäftsprozesse unterstützen oder eine Schnittstelle für Kunden sein. Zahlreiche Apps, die Dienstleistungen oder das Produktportfolio eines Unternehmens vermitteln, gibt es schon. Da native Apps für unterschiedliche mobile Betriebssysteme und Geräte entwickelt werden müssen, sind Apps, die auf Webseiten basieren, dank neuer Webtechnologien eine echte Alternative geworden. Wie der IT-Dienstleister Computacenter AG & Co. oHG diese Technologie nutzt, wird anhand von zwei Praxisberichten beschrieben.

1.1 HTML5 & Co.

Mit der zunehmenden Verbesserung von Webtechnologien können heute Anwendungen im Browser realisiert werden, für die man früher einen vollständigen Fat Client PC benötigte. Microsoft und Google bieten z. B. Office-Programme wie Word, Excel und PowerPoint als Browseranwendungen an, die vergleichbaren Desktopanwendungen in Aussehen und Funktionsumfang kaum nachstehen. Die verbesserten Webtechnologien HTML, CSS und JavaScript ermöglichen es heute, komplexe Anwendungen auch für mobile Endgeräte zu entwickeln.

Der neue HTML-Standard in der Version 5 bietet diverse neue Möglichkeiten und Vorteile, die es sehr viel einfacher machen, leistungsfähige Webanwendungen, insbesondere für mobile Endgeräte, zu entwickeln. Zu diesen Vorteilen gehören unter anderem:

Einfache Integration von Multimediadaten, wie z. B. Video und Sound

Auslesen der Geolocation

Offline-Caching auf mobilen Geräten

Zahlreiche neue Elemente/Tags

Neben HTML5 bieten Cascading Style Sheets (CSS) Level 3 auch Neuerungen, die das Look and Feel einer Webanwendung deutlich an Desktopanwendungen oder an native Apps angleichen. Durch abgerundete Kanten, Farbverläufe und transparente Elemente, die man früher zum Teil mit aufwändigen Bildern oder CSS Hacks umgesetzt hat, kann man nun nativ attraktive Effekte in Style Sheets nutzen. Für JavaScript gibt es inzwischen eine sehr viel bessere Unterstützung in Entwicklungstools, wie z. B. Visual Studio und unzählige Bibliotheken, die die Verwendung von JavaScript vereinfachen und teilweise beeindruckende Funktionen haben, um Webanwendungen dynamischer zu machen. jQuery ist ein Framework, das es enorm erleichtert, HTML-Webseiten mithilfe von Selektoren dynamisch zu verändern.

Alle diese Webtechnologien zusammen nutzen Frameworks, wie das hier eingesetzte jQuery Mobile [1], um mobile Webanwendungen, sogenannte Web-Apps, geräteunabhängig zu ermöglichen. Dabei haben Web-Apps, die auf solchen