Zehn Jahre lang haben wir uns beim «Surfen» im Web
an eine Kombination gewöhnt:
klicken, warten ... neu orientieren ... klicken, warten ... und so weiter. Feedback, zum Beispiel nach Ausfüllen eines Suchformulars, bekam man immer erst auf der nächsten Webseite.
Der Browser war damit eigentlich ein schlechtes interaktives System, denn als User erwartet man schnelles Feedback: innerhalb von 0.1 Sekunden sollte das System zeigen, dass es die Eingabe registriert hat, und innerhalb von 1 Sekunde sollte das Ergebnis vorliegen – sonst geht man von einem Fehler aus. Seit Modem-Zeiten, in denen diese Vorgaben grotesk überschritten wurden, sind die Wartezeiten zwar deutlich kürzer geworden, aber auch mit den heutigen Breitband-Verbindungen reichen «klassische» HTML-Webseiten immer noch nicht an eine lokale Applikation heran.Dies ändert sich nun auf vielen Websites, dank «Rich Internet Applications», kurz RIA. Sie zeichnen sich dadurch aus, dass der Client laufend Daten mit dem Server austauschen und zwischenspeichern kann. Der Server lädt teilweise Daten «auf Vorrat», und der User erhält wirklich unmittelbar Feedback auf seine Eingabe, oder es wird schnell nachgeladen, auch ohne dass der User die Seite verlässt. Somit fühlen sich RIAs sehr viel «fliessender» an als klassische, sequenzielle Websites.
Die am weitesten verbreitete RIA-Technologie ist «AJAX», gefolgt von Adobes «Flex», das vor allem für komplexere Applikationen langsam zum Lieblingskind der Programmierer wird.
Die erste populäre «grosse» AJAX-Anwendung war Googles «Gmail» (private Beta ab 2004). Rund zehn Jahre nach dem ersten Gratis-Angebot Hotmail wurde Webmail durch den Einsatz von AJAX völlig neu definiert.
Bei Gmail werden die Inhalte einiger E-Mails im Hintergrund heruntergeladen, so dass diese ohne Verzögerung angezeigt werden können. Auch das gesamte Adressbuch des Users wird von der AJAX-Engine zwischengespeichert.
Tippt man nun im «To»-Feld die Anfangsbuchstaben «gre» des Empfängers ein, erscheint sofort – das heisst wirklich unmittelbar im Sinne eines guten Interaktionssys-tems, nämlich nach einem Sekundenbruchteil – die vollständige Mailadresse: «Gregor Urech
Inzwischen ist bei Webmail der Einsatz von RIA bereits mehr oder weniger Pflicht. Microsoft und Yahoo sind mit gebührendem Abstand dem Vorbild von Google gefolgt und haben eigene RIA-Webclients entwickelt, Microsoft mit «Windows Live Hotmail», Yahoo unter Einsatz von Adobe Flex. Sunrise nutzt seit einigen Wochen Gmail als technische Plattform.
Dabei sind die Online-Mailapplikationen inzwischen so weit gekommen, dass sie es – eine schnelle Internet-Verbindung vorausgesetzt – in Sachen Performance problemlos mit den eigentlich «grossen Brüdern» wie Outlook/Exchange oder Lotus Notes/Domino aufnehmen können. Pikanterweise haben sie diese trotz des «Standortnachteils» vielfach bereits überholt: Eine Volltextsuche in Gmail – auf Servern irgendwo auf der Welt in der sagenumwobenen «Cloud» von Google – ist inzwischen schneller als in einer vorindexierten Mail-Datenbank mit Lotus Notes, dessen Server im selben Gebäude steht.
Das schon jetzt «klassische» Beispiel für den Einsatz von AJAX sind Mapping-Applikationen, Google Maps und map.search.ch wurden etwa gleichzeitig entwickelt. Landkarten und Stadtpläne sind die perfekte Anwendung für das asynchrone Nachladen von weiteren Daten: Zuerst wird gerendered und geliefert, was der User auf dem Bildschirm sieht, dann weitere Kartenausschnitte rundherum. Wer nun mit einer schnellen Internet-Leitung die Karte – stufenlos – verschiebt, dem kommt es vor, als sei sie unendlich nach allen Seiten.
Nach zwei bis drei Jahren AJAX-Maps sieht man auch das Fortschreiten der eigenen Erwartungshaltung: Bei der ersten Nutzung kam es einem gar nicht so besonders vor – aber wenn man heute mal wieder eine Kartenapplikation nutzen muss, die noch nach der alten Methode «springt», sobald man auf einen Pfeil am Kartenrand klickt, kommt man sich vor wie in der Web-Steinzeit. Diese Entwicklung – ohne RIA wird man zur Anwendung zweiter Klasse – dürfte sich in Zukunft verstärkt auch auf andere Typen von Applikationen ausweiten.
Wichtig bei AJAX-Applikationen ist es, die User zu Beginn der Nutzung nicht zu überfordern. Viele nehmen den Unterschied zu «klassischen» Websites nämlich gar nicht bewusst wahr, wenn die Applikation gut gemacht ist und vom Desktop bekannte Funktionalität übernimmt.
So ist der Unterschied zwischen der lokalen Browser-Funktion «AutoAusfüllen» und der (bisher nur in den «Google Labs» verfügbaren) Funktion «Google Suggest» kaum merklich – obwohl fundamental, denn beim einen wird nur die lokale Browser-History durchsucht, beim anderen nach der Eingabe jedes Zeichens die Google-Datenbank.
Eine weitere nützliche Funktion ist die Vorschau der Trefferanzahl. Immer mehr Sites zeigen bei einer strukturierten (d.h. aus mehreren Feldern bestehenden) Suche schon während des Ausfüllens der Maske die «Konsequenz» der aktuellen Suchkombination an. Schränkt man bei der Autosuche auf auto.local.ch die Treffer auf eine Marke ein, aktualisieren sich die Trefferzahlen der anderen Kategorien sofort. Ich sehe also auf einen Blick, dass meine Suche nach «Cabrio» 64 Autos mit der Farbe «Schwarz» findet; schränke ich weiter auf die Marke «BMW», gibt es nur noch 10 Treffer.
Interessant ist, dass in Usability-Tests das Verständnis dieser schrittweisen Einschränkungen («Refinement» genannt) ohne die Treffervorschau sehr schlecht war: Viele Testpersonen begriffen nicht, wofür die linke Spalte überhaupt gut sein sollte, und nach welchen Kriterien die Einschränkungen erschienen. Erst durch die kleine graue Zahl mit der Anzahl begriffen die Leute das Erscheinen und Verschwinden von zusätzlichen Einschränkungskriterien – und waren zudem sehr glücklich über die «Vorschau» der Suchtreffer. Die Nutzung des gesamten Features wurde plötzlich statt «verwirrend» und «störend» als «super nützlich» und «sehr einfach» bezeichnet – ein Indiz, wie wichtig Testing bei der Entwicklung von AJAX-Applikationen ist, denn nicht alles, was technisch möglich ist, wird auch von den Usern als Erleichterung der Arbeit wahrgenommen.
Gerade für Applikationen ist auch die Drag-&-Drop-Funktion sehr nützlich. So lassen sich zum Beispiel Umfragen erheblich einfacher gestalten: In einer Umfrage zu Skihandschuhen musste man zehn vorgegebene Hersteller-Marken zuordnen nach «bereits gekauft», «in Erwägung gezogen», «bekannt» und «unbekannt».
Statt in endlosen Radio-Button-Wäldern herumklicken zu müssen (immerhin 50 für die erste Frage), konnte man die Marke einfach in das entsprechende Feld ziehen. (Ob allerdings jeder Nutzer die Anweisung «Bitte ziehen Sie die Marken in die entsprechenden Felder per Drag & Drop» versteht, sei dahingestellt.)
Auch das Personalisieren von Websites (oder Intranets) durch das reine «Herumschieben» von Inhaltscontainern wird viel einfacher, intuitiver und somit schneller – und somit überhaupt erst einigermassen realistisch, denn in den ersten zehn Web-Jahren war den meisten Leuten Personalisierung generell zu aufwendig, so dass sie ein frommer Wunsch der Anbieter blieb.
Die Aufgabe «Elemente auf dem Bildschirm neu anordnen» wird um ein Mehrfaches einfacher: Bei der klassischen Variante musste man zunächst vom normalen Modus in den Bearbeitungsmodus wechseln (Link «Reihenfolge festlegen»). Dann konnte man ein Ele-
ment markieren und mit den Links «nach oben» und «nach unten» befördern, um schliesslich die neue Reihenfolge zu «speichern». Mit einer RIA-Applikation und Drag & Drop dauert das Gleiche eine halbe Sekunde – und ist deutlich intuitiver.
Einfacher wird die Benutzung durch AJAX vor allem dort, wo man einen Prozess auch näher an das «mentale Modell» des Users heranführen kann. Das Aufgeben einer Kleinanzeige war bisher zum Beispiel ein Task, der nicht viel mit dem fertigen Layout des Inserats zu tun hatte: Man füllte eine lange Maske mit vielen Optionen aus, und heraus kam ein völlig anders aussehendes Inserat. Heute dagegen kann man quasi direkt in das Layout reinschreiben, was ungleich intuitiver ist.
Auch beim Gratis-Online-Fotodienst Flickr kann man den Titel und die Beschreibung eines Bildes direkt durch einen einfachen Mausklick auf den bestehenden Text anfügen. Dieses «In-Page-Editing» an Ort und Stelle schneidet in Usability Tests sehr gut ab, da es den Erwartungen der User entspricht.
So begeistert war die US-Szene von den neuen Möglichkeiten, dass im Jahr 2005 ein regelrechter Boom einsetzte, Desktop-Applikationen auf dem Web nachzubauen, der bis heute nicht abgeebbt ist.
So schossen etwa rund ein Dutzend Browser-Startseiten-Startups wie Pageflakes und Netvibes aus dem Boden (sowie Google das Gleiche mit «iGoogle» realisierte), mit denen sich eine persönliche Browserstartseite mit den beliebtesten Funktionen und News zusammenstellen lässt. Eine marktbeherrschende Stellung scheint allerdings niemand erreicht zu haben. Auch vieles andere wird ins Web portiert, bis zu hoch komplexen Applikationen wie Photoshop. Denn RIA und das andere Trend-Thema «Software as a Service» hängen zusammen: Nur mit RIA-Methoden ist es möglich, Online-Software so attraktiv zu gestalten, dass SaaS überhaupt denkbar wird – und die ganzen übrigen Vorteile wie Ortslosigkeit etc. greifen.
Doch bedeutet der Einsatz von AJAX, dass auch die Usability automatisch besser wird? Nicht unbedingt. Es heisst zuerst einmal, dass man umfangreicher testen muss, denn die User sehen sich einer neuen Logik der Benutzerschnittstelle gegenüber. Das Surfen im Web 1.0 war zwar langsam und langweilig, aber es war vertraut.
Ein typisches Beispiel sind Checkboxen: Eigentlich ist die immer noch geltende Usability-Regel, dass eine Checkbox nicht direkt zu einer Aktion führen darf, sondern die Maske erst mittels «Submit»-Button abgesandt werden muss. Dieses Prinzip wird jedoch von den meisten RIA-Applikationen unterlaufen, indem heute viele Aktionen direkt mit dem Klick auf die Checkbox ausgeführt werden, ein «Absenden» ist nicht mehr nötig. In einem Test von immo.search.ch brachte ein rotes PLZ-Feld eine Nutzerin zur Verzweiflung – sie hatte nicht verstanden, dass das Hinterlegen des Felds mit Rot direkt beim Verlassen bedeutete, dass sich mit dieser PLZ überhaupt keine Treffer finden lassen.
Oft ist, während der weniger versierte Nutzer nach dem Button sucht, mit dem er seine Aktion ausführen kann, das Gewünschte schon längst geschehen – und eventuell unbemerkt geblieben, während der Benutzer immer noch wartet und sich fragt, was das System denn gerade macht. Nur sehr gutes Feedback-Design kann dieses Problem lösen (manchmal hilft auch ein «Dummy»-Button, das gewohnte Gefühl wiederherzustellen).
Ähnlich ist es auch mit der bereits erwähnten Drag-&-Drop-Funktion im Browser: Wenn die Möglichkeit nicht visuell angedeutet wird, wird sie von vielen Nutzern gar nicht erwartet. Ist also keine Alternative geboten, sehen wir oft ratlose Nutzer, die nicht weiterkommen.
Hinzu kommt, dass auf vielen heutigen Websites noch dieselben Usability-Fehler gemacht werden wie vor zehn Jahren. Wenn diese in das neue Zeitalter eintreten, muss es nicht unbedingt besser werden. Bei Eingabeformularen zum Beispiel bestehen manche Online-Shops immer noch darauf, dass man die Kreditkartennummer statt mit Leerzeichen (wie auf der Karte angegeben) konsequent ohne Leerzeichen (wie intern übermittelt und abgespeichert) eingibt. Wenn nun diese mediokren Formularentwickler denken, mit AJAX sei alles per se einfacher, dann kommen neue Probleme auf uns zu.
Ebenfalls einen schlechten Einfluss auf die User Experience hat die Ladegeschwindigkeit. Zwar fühlen sich viele moderne RIA «nahtloser» an, dies jedoch oft nur mit einer guten Internet-Verbindung und meist erst, wenn ein erster Teil der Applikation geladen ist. Gerade Flex-Anwendungen haben beim Start der Session diesen grossen Nachteil. Will man zum Beispiel im australischen Online-Shop für Camping- und Fischereizubehör «BCF», der ein wegweisendes RIA-Benutzungskonzept aufweist (store.bcf.com.au) schnell ein paar Wanderschuhe suchen, wartet man selbst mit einem schnellen Breitband Anschluss (4 Mbit/s bei uns im Büro) fast zwei Minuten, bis die Applikation geladen ist. Bei mobilem Zugang ist somit an eine Nutzung fast nicht zu denken.
Neben der Geschwindigkeit schliessen auch die Kosten eine mobile Nutzung oft aus. Wer pro Kilobyte bezahlt, wird sicher nicht wollen, dass megabytegrosse Kartenausschnitte, die er sich vielleicht nie anschauen wird, «auf Verdacht» heruntergeladen werden. Daher wird jeweils auch eine Version ohne AJAX-Unterstützung bereitgestellt werden müssen.
RIA-Applikationen können sehr gut werden, wenn sie von Teams entwickelt werden, die sehr sorgfältig umsetzen und sehr viel Wert auf Usability legen, was zum Beispiel bei Google der Fall ist. Ist das nicht der Fall, ist man schnell mal schlechter gestellt. Der Einsatz von AJAX und Verwandten bedeutet deutlich mehr Testing, und zwar sowohl Funktionstests – viel davon auf Browserkompatibilität – wie auch Usability-Tests. Für «faule» Webdesigner ist er also sowieso nicht geeignet.
Aber wie gesagt, das heisst nicht, dass man sicherheitshalber besser auf den Einsatz von RIA-Technologien verzichten sollte. Wenn ein neuer Mitbewerber kommt und diese einsetzt, dürften die erfahrenen User sehr schnell abwandern – und die anderen langsam hinterher.
Angie Born und Peter Hogenkamp sind Partner der Usability-Agentur Zeix AG, die z.B. das User Interface von local.ch aus Usability-Sicht mitentwickelt hat.
