smart developer Ein Code für alle (Vorschau)

Schwerpunkt
Mobile Business Apps
und Maus zur Verfügung, sondern die Interaktion
erfolgt über Gesten mit den Fingern.
Auf diesen Umstand ist bereits während des
Applikationsdesigns einzugehen.
Der Benutzer sollte dabei in möglichst wenigen
Schritten und mit möglichst wenig Interaktion
an sein Ziel — die gewünschten Informationen
— gelangen. Dies kann zum
Beispiel dadurch erreicht werden, dass er in
einer Liste verschiedene Werte zur Auswahl
bekommt, anstatt zu verlangen, einen Wert
manuell einzugeben.
Zu vermeidende Elemente
Ebenfalls ist es sinnvoll, auf spezielle Elemente
und Funktionen zu verzichten, die
zwar im Desktopumfeld weitverbreitet sind,
jedoch im mobilen Umfeld unbedingt vermieden
werden sollten. Hierzu zählen unter
anderem die Weiterleitung beziehungsweise
das Öffnen von Popups und Weiterleitungen
mit target="_blank". Bereits bei Desktop-
Browsern ist diese Art der Benutzerführung
schwer zu handhaben. Auf mobilen Geräten
ist dies jedoch nochmals sehr viel schwieriger,
da viele Geräte Popups gar nicht erst unterstützen.
Doch selbst wenn solch eine Unterstützung
vorhanden ist, sorgen mehrere
Bildschirmebenen auf einem Mobil-Display
in der Regel für eine komplizierte Handhabung
und sollten deshalb vermieden werden.
Weiterhin beliebt sind auch HTML-Frames,
um mehrere HTML-Dokumente in einer Ansicht
zusammenzufassen und so eine anwendungsähnliche
Oberfläche zu schaffen. Abgesehen
davon, dass viele mobile Geräte
Frames nicht unterstützen, führt diese Art
der Aufbereitung einer Ansicht im mobilen
Umfeld zu unzähligen Problemen: Oft funktioniert
der Zurück-Button nicht oder nicht
wie gewünscht, auch Lesezeichen anzulegen,
ist meist nicht möglich. Zudem wird die
Suche nach Inhalten erschwert und es entstehen
Sicherheitsprobleme, da nicht immer direkt
zu sehen ist, wenn verschiedene Frames
aus verschiedenen Quellen stammen.
Verzichten sollten Sie auch auf Spacer-Gifs,
also auf Grafiken, die lediglich dazu dienen,
Inhalte an bestimmten Positionen zu platzieren.
Diese Grafiken erhöhen nicht nur die
Anzahl an Requests, sondern verursachen
unter Umständen auch höhere Kosten. Für
jedes hinterlegte Bild muss beim Aufruf des
Inhalts bzw. der Seite ein weiterer Request
abgesetzt werden. Höhere Latenzzeiten und
ein höheres Datenaufkommen sind die Folge.
Deshalb sollte stattdessen auf Cascading
Style Sheets (CSS) zurückgegriffen werden.
Damit lassen sich Platzierungen durch Definition
in einer zentralen Datei realisieren,
was die Anzahl an Requests minimiert und
eine saubere und fehlerresistentere Seitenstruktur
zur Folge hat.
Durch den Einsatz von CSS kann zudem
auf Layout-Tabellen verzichtet werden. Dadurch
erspart man sich unerwünschte und
meist nicht vorhersehbare Seiteneffekte:
Wird beispielsweise eine Tabelle vollständig
dargestellt und überschreitet sie eine gewisse
Breite, müssen Benutzer horizontal und vertikal
scrollen, um Inhalte anzusehen. Diese
Art der Navigation ist gerade bei einem mobilen
Endgerät äußerst umständlich und
sollte deshalb vermieden werden. Ebenfalls
kann es passieren, dass der verwendete
Browser die Tabelle beim Überschreiten der
Displaybreite umbricht und die fehlenden
Spalten in einer neuen Zeile einfügt. Diese
clientseitige und geräte- sowie softwareabhängige
Transformation ist nicht vorhersehbar
und geht somit zulasten der Übersichtlichkeit.
Außerdem vergrößert sich durch die
Verwendung von Tabellen der zugrunde liegende
HTML-Code erheblich, was zu einem
unsauberen Code und erhöhtem Datenvolumen
führt. Durch die Verwendung von CSS
können diese Effekte vermieden werden.
Semantisches HTML
Um eine Aufblähung des Codes zu vermeiden,
sollte man sich bei der Umsetzung von
Seiten und Layouts nicht nur auf das rein optische
Ergebnis konzentrieren. Vielmehr
sollte man darauf achten, dass die drei für
ein gutes Ergebnis notwendigen „Säulen“ Inhalt,
Design und Struktur strikt voneinander
getrennt bleiben und auf alle drei Punkte in
gleichem Maße Wert gelegt wird. Im Hinblick
auf die Struktur sollte man zudem beachten,
dass das zugrunde liegende Konstrukt an
HTML-Elementen eine gesunde und möglichst
semantische Struktur besitzt. Doch
was genau ist darunter zu verstehen?
Das World Wide Web stellt eine riesige
Masse an Inhalten und Information bereit.
Diese Daten stehen innerhalb des WWW
normalerweise jedoch in keinerlei Beziehung
zueinander. Das WWW bietet lediglich eine
Art Präsentationsplattform, die die erfassten
Daten darstellt.
Um Inhalte tatsächlich als solche zu erkennen
und erfasste Daten entsprechend deuten
zu können, entwickelte Tim Berners-Lee (der
„Erfinder“ des WWW) das Konzept des Semantic
Web. Dieses beruht darauf, dass das
Internet aus Daten besteht, die direkt oder
indirekt von Maschinen interpretiert und verarbeitet
werden können. Ein Punkt, der als
26
02/2011 smart-developer.de