Kolumne: EnterpriseTales

Just another Client: Mobile HTML


Was hat ein „Ausflug“ in die mobile Welt in einer Enterprise-Kolumne zu suchen? Ganz einfach: Mehr und mehr Unternehmen entdecken in den letzten Monaten für ihre klassischen Enterprise-Webanwendungen Smartphones und Tablets – und somit auch das Mobile Web – als zusätzlichen Channel. Dabei vernachlässigen sie häufig, dass der Benutzer auch von mobilen Webanwendungen eine optimale Ausrichtung an sein Gerät erwartet. Die Displays von modernen Handys und Tab­let-PCs sind bekanntermaßen deutlich kleiner als die von gewöhnlichen Notebooks oder Desktop-PCs. Daher ist es wichtig, auf diese Unterschiede beim Entwurf einer mobilen Anwendung bewusst einzugehen. Dabei kommt es nicht nur auf technische Details, wie die korrekte Anzeige von Schriften und Grafiken auf den kleinen Bildschirmen, an, sondern vor allem auch darauf, dass die Webseite übersichtlich und zielgerichtet für das mobile Device designt wird. Eine überladene Website ist nicht nur auf einem Smartphone nervig, dort wird sie aber nahezu unbrauchbar.

Mobile First – Mobile Only

Unter [1] und [2] führt Luke Wroblewski wichtige Gründe auf, warum bei der Planung einer neuen Webanwendung das „mobile Frontend“ sogar im Vordergrund stehen sollte. Neben dem Mobile First-Ansatz gibt es im Silicon Valley auch einige Firmen, die ihre Anwendungen nach dem Mobile Only-Prinzip erstellen [3]. Neben dem naheliegenden Problem der deutlich kleineren Displays gibt es aber auch noch eine Reihe anderer Dinge, die in einer guten mobilen Anwendung beachtet werden sollten, wie beispielsweise die jeweils aktuelle Empfangsstärke oder der Status der Batterie. Während derartige Aspekte für Native-Mobile-Entwickler (z. B. iOS oder Android) mittlerweile eine Selbstverständlichkeit sind, tun sich Webentwickler an dieser Stelle erfahrungsgemäß eher schwer. Dabei bieten HTML5 & Friends bzw. das W3C alles, was man braucht. Das Abfragen der aktuellen Empfangsstärke des mobilen Devices kann mit dem Network Information API [4] erfolgen:

... var myConnection = navigator.connection.type; switch(myConnection) { case "2g": // handle 2g break; case "none": // handle none break; case "unknown": // handle unknown connection type break; .... 

Das connection API ist sehr einfach und enthält derzeit nur das type-Attribut, das die aktuelle Verbindungsstärke als String zurückliefert:

  • unknown

  • ethernet

  • wifi

  • 2g

  • 3g

  • 4g

  • none

Die Webanwendung kann so entsprechend auf Verbindungsschwankungen reagieren – ein MUST für eine gute User Experience.

Sichtbar ...

Neugierig geworden?

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang