Colorscheme

AJAX Ladezeiten Feedback zur Erhöhung der Usability


AJAX ist schon was tolles, man kann Bereiche auf seiner Website aktualisieren, ohne die komplette Seite neuzuladen, doch wer jetzt denkt das man garkeine Ladezeiten hat, der liegt falsch. Ein normaler Aufruf ohne AJAX sieht so aus:

- die Anfrage wird gestartet (zum Beispiel: Klick auf einen Link)
- der Server wird kontaktiert
- der Server verarbeitet die Anfrage (zum Beispiel: Datenbankabfrage)
- der Server schickt die Daten an den Client (also an denjenigen der den Klick auf den Link ausgeführt hat)
- der Browser läd die Website mit den erhaltenen Daten neu und präsentiert sie dem User

So sieht eine normale Anfrage aus, mit AJAX ändert sich nicht viel:

- die Anfrage wird gestartet (zum Beispiel: Klick auf einen Link)
- der Server wird kontaktiert
- der Server verarbeitet die Anfrage (zum Beispiel: Datenbankabfrage)
- der Server schickt die Daten an den Client (also an denjenigen der den Klick auf den Link ausgeführt hat)
- der Browser fügt, über JavaScript, das Ergebnis der Abfrage in die Website ein, ohne die ganze Seite neuladen zu müssen.

Wie man sieht, in beiden Fällen muss der Server kontaktiert und die neuen Daten berechnet werden und das kostet Zeit. Greifen viele User gleichzeitig auf einen Dienst zu, muss der Server schuften und manchmal dauert dann das Beantworten einer Anfrage länger. In Zeiten vor AJAX war das kein Problem, der User konnte an dem Ladebalken rechts unten erkennen, das die Seite noch läd, für die Usability war also alles klar.

Doch nun kommt AJAX, die Website läd nicht neu und daher zeigt der Browser auch keinen Ladebalken an, was soll man machen? Den User einfach im ungewißen lassen oder doch der Usability einen kleinen Schub verpassen? Ich bin stark für zweiteres, wir erhöhen die Usability. Der Browser will uns keinen Ladebalken anzeigen? Dann greifen wir uns einfach einen eigenen Ladebalken/Ladegrafik, und einen Generator für eine eigene Ladegrafik, natürlich als Beta deklariert, findet sich hier: ajaxload.info, viel Spass mit Usability-treuen AJAX-Anwendungen.


Verwandte Artikel
  1. Feedback
  2. Ajax -Einführung
  3. AJAX und Suma-dolle-Links
  4. AJAX - die 5 TOP Einsatzgebiete
  5. Ajax-Erfahrungsbericht - die Web2.0-Wunderwaffe

am September 19, 2006 um 10:08 Uhr | in Usability | 7 Kommentare

2 Trackbacks/Pingbacks
  1. Pingback: VisualBlog - das VisualOrgasm-Weblog » Vor- und Nachteile von AJAX on September 19, 2006
  2. Pingback: AJAX - die 5 TOP Einsatzgebiete » Webdesignblog on Oktober 3, 2006

5 Kommentare
  1. matias, September 19, 2006:

    Also ich denke auch, dass Ladebalken unbedingt notwendig sind, damit der User merkt: da passiert gerade etwas.
    Da denken die Portalbetreiber noch viel zu selten dran.
    Aber AJAX-Ladebalken werden sich einbürgern und durchsetzen. Hoffe ich zumindest :)

    Finde ich gut, dass dieses Thema hier mal angerissen wird!

  2. Martin Labuschin, September 19, 2006:

    AJAX ist bedeutend schneller als ein normaler Request weil:

    -Der Browser muss nicht die Scripte, Stylesheets und andere verknüpfte Dateien auf Änderungen prüfen.
    -Der Browser braucht den Quellcode nicht nochmal rendern.

    Das alle Surfer wissen, dass der Ladestatus unten im Browser zu sehen ist, bezweifle ich.

    Zum Einsatz eines Ladebalkens rate ich auf jeden Fall. Falls der Server gerade viel zu rennen hat, kann selbst ein AJAX Request mal mehr als 10-20 Sekunden dauern (schon erlebt).

  3. hot-elle, September 20, 2006:

    also mit dem ladebalken ist ne richtig gute idee - das sollte standart werden!

    habe nämlich erst letztens in ein blog eine nachricht hinterlassen auf dem AJAX verwendet wird. und nach dem absenden ist einfach nichts passiert - dachte ich zumindestens, da nichts zu sehen war. dann nach etwa ner halben minute wurde mein beitrag eingetragen, in der zwichenzeit habe ich aber bestimmt 5x noch einmal auf den absenden button geklickt! *g*

  4. Rupert, September 26, 2006:

    Es sollte auch einen Ladebalken oder ähnliches geben, wenn es sehr schnell geht. Sonst merkt der Nutzer gar nicht, dass sich etwas geändert hat, weil er mit den Augen noch an dem Bedienelement hängt, das die Serveranfrage ausgelöst hat - schließlich passieren Aktion und Reaktion fast gleichzeitig.
    Daher sollte man auch bei hoher Datenübertragungsgeschwindigkeit einen kurzen Ladeprozess fingieren, um darauf aufmerksam zu machen, dass sich nun am Interface etwas ändert. Und die Änderung sollte visuell hervorgehoben werden - ein gutes Beispiel ist die “yellowfade technique” von 37signals, die z.B. bei Backpackit.com oder basecamp eingesetzt wird.

  5. Christian Strang, September 26, 2006:

    Dem kann ich mich nur anschließen, ersten wissen die meisten Internetnutzer nichts von AJAX und den Techniken des “Ladens” und zweitens braucht der Internetuser einfach ein Feedback, es ist schon seltsam: Ohne Ladebalken kommt die Website einem sehr langsam vor, aber mit Ladebalken lehnen wir uns zurück und lassen die Wartezeit über uns ergehen.

    Noch ein Zusatz: Um ein effektives Feedback für den User zu erzeugen kann man sich auch mal an “Struktur”-verändernde Maßnahmen wagen, also anstelle eines Ladebalkens oder einer Ladegrafik ist es auch sehr effektiv wenn man mal kurz einen Teil der Website “wackeln” läßt, indem man zum Beispiel ein Element in einen Bereich kurz einfügt was die Struktur dann quasi sprengt. Durch diese “Bewegung” wird die Aufmerksamkeit des User direkt geweckt und ihm wird bewußt das sich was geändert hat (ist allerdings nur bei sehr kurzen Ladezeiten zu empfehlen). Den Effekt der Bewegung kennt jeder von den animierten Gifs, die keiner mehr sehen mag (und mit dem Beginn des Web2.0 auch irgendwie nicht mehr existent sind).

Tut mir leid, die Kommentarfunktion für diesen Beitrag ist geschlossen.