Besonderheiten bei Webseiten für mobile Clients
05.02.2011
Programmierung von Webprojekten für mobile Clients
Mobile Clients?
Mobile Clients sind tragbare Geräte mit einem Betriebssystem und einem Browser, welcher beivorhandener Internetverbindung online oder offline Webseiten und Webanwendungen anzeigenkann.
Es können allgemein drei Arten der mobilen Clients unterschieden werden:
Mobile Telefone
Mobile Telefone sind hauptsächlich nicht für die Nutzung als mobile Clients konzipiert wurden,prinzipiell aber in der Lage sind, Webinhalte darzustellen. Sie verfügen in der Regel nur über eineZahlentastatur mit erweiterter Buchstabeneingabemöglichkeiten, ein kleines Display, keineTouchscreenfunktionalitäten und die geringste Rechenpower im Vergleich der Gerätetypen.
Smartphones
Smartphones sind eine multimediale Weiterentwicklung des Mobiltelefons. Mit mehrRechenleistung ausgestattet erlauben sie den Betrieb leistungsfähigerer Betriebssysteme undverfügen über bessere Darstellungsmöglichkeiten und erweiterer Eingabemöglichkeiten, oft perStift, Touchscreen oder echter (Mini-) Tastatur.
Tablets
Mit Einführung des Apple iPads hat sich ein neues Marktsegment etabliert, welches explizit für diemobile Nutzung des Internets und multimedialer Inhalte entwickelt wurde. Mit Apples iPad kann inder ursprünglichen Version gar nicht mehr telefoniert werden, Nachfolger und Adaptionen andererHersteller erlauben auch wieder das Telefonat. Diese Geräte sind die die leistungsstärksten Clients,nutzen die Eingabeform per Fingerzeig und Fingerdruck und zeigen Inhalte auf den größtenBildschirmen an.Besonderheiten der Webentwicklung für mobile Clients.
Wie gezeigt kann die Hardware des Internetnutzers also sehr stark variieren. Zu Berücksichtigen bei der Entwicklung von Webinhalten für mobile Clients sind folgene Parameter:
– kleine Bildschirme (geringe Auflösung, oft nur 20 bis 25 Zeichen pro Zeile, 5 bis 7 Zeilengleichzeitig sichtbar)
– Eingeschränkte Eingabemöglichkeiten
– Langsame CPUs und damit langsame Verarbeitung der empfangenen Daten
– Geringer Speicherplatz
– Geringe Bandbreite im Download und meist noch deutlich geringere Bandbreite in Upload-Richtung
Minimalkonfiguration
Um diesen Besonderheiten gerecht zu werden, sollte ein Minimalangebot angeboten werden, um keinen Internetnutzer auszuschließen. Diese Minimalkonfiguration sieht wie folgt aus:
– Displayauflösung von 120x120 Pixeln– 256 Farben– JPEG / GIF – Unterstützung
– XHTML 1.0
– <table> - Unterstüzung ohne Attribute rowspan und colspan
Browserweiche
Ist eine Internetseite auf diese Minimalkonfiguration hin konzipiert, ist sie natürlich auf einemnormalen Desktop-PC mit aktueller Hardware aber auch auf den meisten Smartphone und erst Recht auf den Tablets in Darstellung und Funktion veraltet und nicht sehr attraktiv.Ideal ist somit die automatische Bereitsstellung unterschiedlicher Seiten für die verschiedenenLeistungsstärken der mobilen Clients. Dies wird mittels Browserweichen erreicht. Unterschieden werden wieder unterschiedliche programmiertechnische Ansätze:
– per Javascript
– per CSS
– per externer teilweise kostenpflichtiger Dienstleister
– per PHP
– per WURFL
Die Browserweiche erkennt anhand einer Signatur des Browsers, die dieser bei seiner Anfrage nachDaten an den Webserver mitschickt, welcher Browser und welches Betriebssystem vorliegt undkann mit dieser Information entscheiden, ob– per eigener CSS – Datei– oder per Umleitung (Redirekt) auf eine komplette eigene Seite das Design an dietechnischen Vorraussetzungen angepasst werden soll.
Welche Informationen übermittelt der Browser als Sigantur?
Eine Sigantur kann wie folgt aussehen:
Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.16 (KHTML, like Gecko)Chrome/10.0.648.127 Safari/534.16
Die eingesetzte Browserweiche erkennt darin den Browser "Crome" von Google, installiert aufeinem PC mit dem Betriebssystem Windows 7, es handelt sich also nicht um ein mobiles Gerät.
Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko)Version/3.0 Mobile/1A538a Safari/419.3
Hier erkennt die Browserweiche ein Apple iPhone mit dem Browser "Safari".
Betriebssysteme
Unterschiedliche Betriebssystem stellen unterschiedliche Browser und Lizenzumgebungen zurVerfügung. Damit sind oft auch die gestalterischen Möglichkeiten sehr unterschiedlich.Gern zitiertes Beispiel ist hier das Betriebsystem iOS des Apple iPads, welche bei Markteinführungkeine Flash-Filme darstellen konnte, offiziell begründet mit dem Ressourcenhunger von AdobesFlash-Umgebung. Es zeigt sehr gut auf, dass eine Internetseite genau wie in der Desktop- undNotebookwelt auf verschiedenen Betriebssystemen und mit verschiedenen Browser getestet werdenmuss und in der Programmierung den Besonderheiten der einzelnen Systeme Rechnung tragen muß.
Folgende Betriebssysteme kommen heute auf mobilen Clients zum Einsatz:
– Apple iOS
– Google Android
– Symbian Linux
– Microsoft Windows Phone
– Blackberry OS bzw. RIM OS
– Hewlett Packard webOS (früher PalmOS)
– Sony Maemo und Intel Moblin, heute vereint als Meego
– LiMo (Linus Mobile)
– Samsung Bada
– Opera Mini
Displayauflösungen
Wie die Produktpalette und Betriebssystemvielfalt kann auch die Auflösung eines mobilen Endgeräts sehr unterschiedlich sein. Gängige Formate sind unter anderem
– 480 x 800 Pixel
– 480 x 854 Pixe
l– 240 x 320 Pixel
– 320 x 240 Pixel
– 320 x 240 Pixel
– 960 x 480 Pixel
Technk und Tools
Je nach Webseite oder Webanwendung erfolgt die Anpassung der Darstellung für mobile Clientssehr unterschiedlich. Tools wir jQuery mobil stellen eine gute Grundlage zur Verfügung. Cookies und Session-Verwaltungen sollten mit Vorsicht genutzt werden.
Abschließend darf aber derwichtigste Aspekt der mobilen Webentwicklung nicht vergessen werden:
Still a phone! Es ist und bleibt ein Telefon!
In diesem Sinne: Bei Rückfragen einfach anklicken, ob der Taste, Zeigestift oder Multitouch-Fingerzeig: +49 2403 54276