“Bisch au scho Mobile Web?!”
September 21, 2015
Aus dem Unterricht des CAS Mobile Business mit Frank Lang berichtet Andreina Naef:
If you don’t have a mobile website, you don’t have a website
Am Anfang des Internets mussten sich die Technologie-Experten noch mit der Frage beschäftigen, für welchen Browser die Website optimiert werden musste.
Dann kamen plötzlich mobile Handys dazu und neue Fragen kamen auf: Welche Screens müssen ermöglicht werden? Welche Auflösung? Welches Device: Nokia, iPhone oder Samsung? Zum Smartphone kamen dann plötzlich Tablets in allen möglichen Grössen und eine Begrenzung auf einzelne Devices war und ist fast nicht mehr möglich.
Die Webtechnologie muss sich an möglichst alle Devices anpassen bzw. an sie adaptiert werden können. Sie muss also nach Bedarf reaktionsfähig, sprich responsive sein.
Typologie der Technologien
Folgende Technologien werden genutzt, um den neuen Anforderungen bezüglich Anpassungsfähigkeit und Reaktionsfähigkeit zu entsprechen:
HTML5
- Funktioniert auf den meisten Smartphones, im Speziellen iOS und Android
- Ersetzt die Flashfunktionalität mittels neuer Funktionen wie Video, Audio, lokalem Speicher und dynamischen Grafiken
- Offlineverfügbarkeit
Javascript
- Inhalte können animiert, generiert und nachgeladen werden
- Einblendungen und Suchbegrifffunktionen wie Formulareingaben werden ermöglicht
CSS3 (Cascade Style Sheets)
- Anwendbar auf iOS und Android
- Ermöglicht responsives Verhalten
- Definiert Farben, Layout, Schrifteigenschaften etc.
Im Normalfall werden alle drei Technologien kombiniert eingesetzt.
Adaptive vs. Responsive
Vorgehen
Wichtig ist, sich als erstes eine Strategie zu definieren. Was soll bedient werden und hat Priorität?
- Mobile first
- Tablet first
- Mobile only
- Mobile too
- Inside out / Outside in
Nach der Strategie wird das übliche Projektvorgehen angestrebt, vom Konzept zur Umsetzung, Testing, Rollout, Maintenance.
Dabei darf die Maintenance nicht unterschätzt werden. Ein mobiler Webauftritt ist kein One-Time-Projekt, sondern muss laufend unterhalten und den neuen Technologien angepasst werden.
Nachschlagewerk
- CSS Cascading Style Sheets
- CMS Content Management System
- IA Informationsarchitektur
- Retina Bilder mit hoher Pixeldichte
- RWD Responsive Web Design
- UX User Experience