ksi
consulting

Mobile Geräte - Strategie - Responsives Web-Design

 

Trends – Mobiles Inter­net

Das Internet ist mitten in einem Umbruch. Vielfalt und Dauer der Nutzung nehmen zu. Internet­nutzung über Mobilfunk gewinnt schnell an Bedeutung.

  • Die Verkaufs- und Bestands­zahlen von Smartphones steigen extrem schnell und werden die Absatz­zahlen von Desktop-PCs weit hinter sich lassen.
  • Der Daten­verkehr über Mobilfunk­netze verviel­facht sich von Jahr zu Jahr.
  • Für regel­mäßige Kommuni­kation, sowie spora­dische Auskünfte wird immer häufiger das Mobil­gerät benutzt. Vielfalt mobiler und stationärer Geräte
  • Die Vielfalt der Geräte ist beinahe unüber­schau­bar: Smart­phones unter­schied­licher Gene­rationen, Tablets mit und ohne Tastatur, Net­books und Note­books mit Touch-Screen. Allein auf Mobil­geräten sind min­destens drei Betriebs­systeme zu berücksichtigen: Android, IOS und (im Kommen) Windows 8 Phone und dazu diverse Hybrid­geräte – ältere und weniger verbreitete System außer acht lassend.
    Außer durch die Betriebssysteme unterscheiden sich die Geräte hinsichtlich
    • Bildschirmeigenschaften (Bildschirmgröße, verfügbares Darstellungsfeld, erhöhte Pixeldichte der Retina-Displays)
    • Interaktionsmodell (Maus, Touch, Stift, Clickwheel)
    • Hardwareeigenschaften (Prozessor, GPS, Kamera, Dateisystem)
    • Netzanbindungen
    • Web-Browser 
  • Die technischen Fähigkeiten von mobilen Geräten, Notebooks und Desktop-PCs gleichen sich, bei großer Vielfalt, an. Neue Smart­phones sind teil­weise bereits heute mit Vierkern-Pro­zessoren und Bild­schirm­au­flösungen bis 1280 Pixel Breite aus­ge­stattet. Neue Tablets haben zum Teil bereits höhere Bild­schirm­auf­lösungen als gängige Note­books. Präsen­tationen mit Beamer sind bereits direkt vom Mobil­telefon mög­lich. Selbst Desktop-Betriebs­systeme können zum Teil schon auf einem Smartphone laufen. Anderer­seits werden Netbooks auch mit Android als Betriebs­system verkauft.
  • Es wird bereits eine schier unglaub­liche Menge an Apps zur Installation ange­boten. Unter­suchungen zeigen, dass jetzt schon ein Groß­teil installierter Apps nach Installation nie wieder benutzt werden. Installiert und regel­mäßig benutzt werden nur Apps, die echten Nutzen (gegen­über einer Website) haben.

Was tun?

Wie steht es mit dem Ansatz, einen klassischen Web-Auftritt einfach um eine mobile Variante zu ergänzen?

  • Soll es speziell eine Web-Anwendung für Mobil­geräte sein, so ist zu fragen: Für welche Gerätegröße, Bild­schirm­auf­lösung und welche Über­tragungs­ge­schwin­dig­keit? Schon jetzt gibt es sehr unterschied­liche Leistungs­klassen. Je eine Desktop-Version und eine iPhone-Version mit einfacher ein­spaltiger Aus­gabe vorzu­sehen, wird der Aufgaben­stellung nicht mehr gerecht.
  • Soll es eine installier­bare App sein, ist auch noch zu fragen: Für welches der Betriebs­systeme? iOS, weil zur Zeit noch die Mehrheit der Tabletts damit laufen, oder Android, weil es das häufigste Betriebs­system für aktuelle Smart­phones ist, oder doch noch für Windows 8, weil Tabletts und Net­books zusam­men wachsen? Und welchen Mehr­wert bietet die App, damit sie häufig installiert und nachher auch noch genutzt wird? Und was ist mit den Nutzern, die die App (dennoch) nicht installiert haben und vom mobilen Gerät Ihre Web­seiten aufrufen wollen?

Oder lässt man es doch einfach bei einem Internet­auftritt, auf allen Geräten gleich, da Mobil­geräte sowieso leistungs­fähiger werden? Dieser Ansatz ist (nur) dann in Erwägung zu ziehen, wenn die einge­setzten Techniken mobil­tauglich sind, also der Internet­auftritt auf Mobil­geräten fehlerfrei funktioniert, flüssig läuft, und – etwa bei Internet­diensten – nicht schlechter ist als bei Wett­bewerbern.

Schluss­fol­gerungen

  • Eigentlich gib es kein „mobiles Internet“, sondern nur ein Internet. Es gibt nur sehr unter­schied­liche Geräte. Diese in Mobil­geräte und Desktop zu unter­scheiden macht zukünftig immer weniger Sinn. Zwei Mobil­geräte (Smart­phones, erst recht Smartphone und Tablet) werden sich oft stärker unter­scheiden als leis­tungs­fähige Mobil­geräte und Notebook oder Destop-PC.
  • Es wird immer ein vernünftig auf Mobil­geräte nutzbarer Internet­auftritt gebraucht, es sei denn, es kann auf den in Zukunft größeren Teil der Nutzer verzichtet werden oder es handelt sich um einen der wenigen Fälle, für die selbst leistungs­fähige Mobil­geräte nicht geeignet sind.
  • Der häufig von Agenturen vor­ge­schla­gene Weg, eine klassische Internet­seite und eine Mobil­version bzw. eine Version für iPhone/iPad, dürfte wohl nur in seltenen Fällen sinnvoll/ausreichend sein (aber die Agentur hat schon mal zwei Aufträge).
  • Statt der bisher zumeist gewählten pixel­genauen Layouts für vorge­gebene Bildschirm­größen sind Web-Designs sinn­voller, die eine geräte­über­greifend anpassungs­fähige Seiten­gestal­tung vorsehen.

Mobil-Strategie

Der jeweilige Anwendungsfall, die Zielgruppe und Marketing­aspekte sind die Eingangs­parameter für die Entwicklung einer geräte­über­greifen­den Stategie. Die wesentlichen Strategien sind:

Mobile App

„All the cool innovation is happening inside the browser.“ [Mobile Entertainment Market]

Da braucht es schon besondere Gründe für den Aufwand installierbare Apps zu programmieren. Solche können sein:

  • Marketing­gründe (etwa Angebot über App-Store),
  • Erweiterte Funktionalität (z.B. Kamera, Zugriff auf andere Apps oder Daten),
  • Hoher Komfort für den Nutzer, bei häufiger oder regelmäßiger Nutzung.

Mobile first

Mit diesem Ansatz liegt der Schwer­punkt darauf, die Web­seiten bzw. -anwen­dung besonders auf Mobil­geräte auszu­richten. Erst danach werden ggf. Ergänzungen speziell für Desktop-PCs vorge­nommen. Auf diese Art wird sicher­ge­stellt, dass Nutzer mit Mobil­geräten/Smart­phones alle (wesent­lichen) wichtigen Funktionen zur Verfü­gung haben.

  • Inhaltsorientiert: Konzentrieren auf das, was für den Nutzer wichtig ist (Inhalt vor Design) 
  • Sicherstellen, dass primär die immer wichtigeren Mobilgeräte ordentlich bedient werden
  • Kein festes Layout, da unterschiedliche Bildschirmgrößen (fließend statt pixelgenau)
  • Für Desktops evtl. zusätzliche Seiten und Spalten (insbes. große Bilder und Werbung).

Respon­sives Web-Design

Mit responsivem Web-Design (siehe hierzu den Blog-Beitrag) werden Web­seiten erstellt, die sich automatisch an das jeweilige Gerät anpassen. Das kann zum Teil gleitend („fluid“) und auch in Sprüngen („adaptive“) geschehen. Dabei sind entsprechende Vor­selek­tionen oder Anpassungen auf dem Web­server möglich.

  • Eine Web-Anwendung für alle Geräte
  • Die Darstellung passt sich an das jeweilige Gerät an
  • Gezielte Designunterschiede sind mög­­=lich
  • Anordnung abhängig von Bildschirmgröße
  • Variable Größe für Bilder und Multimedia-Objekte
  • Ausblenden/ersetzen einiger Elemente auf bestimmten Gerätetypen
  • Bedienung und Menü angepasst an die Geräte­möglich­keiten (z.B. Touchscreen, Maus).

Mit Drupal lassen sich die verschiedenen Strategien für geräteunabhängige und/oder gerätespezifische Websites sehr gut umsetzen. Dabei werden neue Web-Standards, geräteabhängige Bibliotheken, sowie serverseitig Geräteerkennung und gerätespezifische Unterschiede in Layout und Inhalt, aufeinander abgestimmt.

Begriffe: