Fallbeispiele

AMAZON.COM

Screenshot

URL: http://www.amazon.com/ Link

Hintergrund

Amazon.com war der erste Buchladen, der seine Produkte nur online anbot. Es gibt nirgendwo eine Niederlassung in der realen Welt, sondern nur in der virtuellen Welt des Internets. Kunden können auf der Website Bücher suchen, diese kaufen und erhalten sie wenig später nach Hause geliefert. Aufgrund des durchschlagenden Erfolgs dieses Verkaufsmodells während der Internet-Revolution Ende der 90er expandierte Amazon.com nach und nach. Heute kann man neben dem ganzen Unterhaltungsbereich auch Produkte der Sparten Elektronik, Bekleidung und Körperpflege finden.

Homepage

Der erste Eindruck, der ein Besucher von Amazon.com erhält ist geprägt von den vielen Bildchen. Man sieht vor lauter lustigen Illustrationen und Animationen die Seite selbst kaum und weiss nicht wohin zuerst zu schauen. Es braucht einen Moment, bis man sich daran gewöhnt hat. Erst dann kann man überhaupt beginnen die Website zu benützen.

Informationen zur Firma sind auf sechs verschiedene Seiten aufgeteilt, auf die man über Links unten an der Seite kommt.

Interessanterweise ist die Startseite nach jedem Aktualisieren eine andere: Der 'Willkommens-Bereich' besteht aus etwa vier Seiten, die ähnlich sind und abwechslungsweise als Homepage angezeigt werden. Es ist zwar eine witzige Idee, für den Benutzer aber sehr verwirrend. Einen nennenswerten Vorteil gegenüber einer gleichbleibenden Homepage bringt es nicht.

Auf jeder dieser Seiten sind die wichtigsten Neuerscheinungen aufgelistet. Dann werden einfach noch ein paar andere neue Artikel erwähnt, und die Werbungen sind verschieden. All das wäre ja nicht so verwirrend, wenn sich nicht von Seite zu Seite das Layout verändern würde

Fazit: Die Homepage ist nicht usable. Verwirrung ist nicht eine Emotion die durch eine Webseite hervorgerufen werden sollte!

Navigation

Die Navigation auf dieser Website ist gut gemacht. Die Navigationsleiste sieht überall gleich aus, wobei der aktuelle Bereich weisse Farbe annimmt. Es ist eine Art Breadcrumb Trail implementiert.

Sitemap hat es keine, dafür aber eine Hilfeseite. Diese ist eine ausführliche Zusammenstellung von Links auf Seiten, die alle möglichen Aufgaben erklären, die auf der Site ausgeführt werden können. Eine Sitemap wäre zwar besser, da man nicht Texte lesen müsste um die Webseite zu verstehen, dieses Vorgehen ist aber auch nicht schlecht und viel besser als nichts.

Zwischen besuchten und nicht besuchten Links wird unterschieden.

Layout

Das Layout ist gut gemacht und wird konsequent durchgezogen. Es besteht aus Kopfzeile, Navigationsleiste links, grossem Hauptteil und Infoleiste rechts.

Accessibility

Auf accessibility wurde bei dieser Site nicht geachtet. Der alt-Text zu jedem Bild lautet 'Image' . Es ist zwar möglich, die Webseite ohne Bilder zu benutzen, aber nur sehr schwer, da wie bei SPIEGEL ONLINE die Navigationsleiste mit Bildern aufgebaut ist.

Technisches

Diese Website lässt technisch einiges zu wünschen übrig:

  • Sie hat keine Doctype, kann also nicht validiert werden.
  • Auf beinahe jeder Seite hat es einen aktiven Link zu sich selbst
  • Tabellen werden zum Layouten benützt
  • Der Fenster-Titel sagt wenig aus, und Meta-Informationen sind gar keine angegeben

Anstatt CSS (cascading style sheets) zu benützen, werden die struktuerllen Informationen im HTML Code (ISO 15445) jeder Seite programmiert. Es ist ein mehrere Kilobytes langes Stück Code, dass für jede Seite unnötigerweise von neuem geladen wird. Die wegen den vielen Bildern sowieso schon lange Ladezeit von Amazon.com wird dadurch noch länger. Bei einer langsamen Internetverbindung braucht der Benutzer viel Geduld.
Ausserdem machen die Programmierer sich selber das Leben schwer: Jedes Mal, wenn sie eine strukturelle Veränderung machen, müssen sie alle Seiten entsprechend anpassen. Bei Verwendung von CSS braucht dies für die ganze Website nur einmal vorgenommen zu werden.

Zum Javascript-Code existiert eine sauber funktinierende Alternative.

Emotionen

Durch die vielen Bilder und Animationen macht die Site einen etwas hektischen Eindruck. Es werden sehr viele Farben eingesetzt, was der Website ein lebendiges Aussehen verleiht. Die Farben scheinen aber überhaupt nicht unter Kontrolle gehalten zu werden, vorallem in den Werbungen. Alles einfach möglichst bunt und hell. Zu Beginn ist es vielleicht amüsant, mit der Zeit geht es einem aber auf die Nerven.

In den verschiedenen Teilbereichen der Website sind die Farben der Navigationsleiste anders. Was aber bei SPIEGEL ONLINE gut gewirkt hat, ist bei Amazon.com kontraproduktiv. Die Farben sind überhaupt nicht aufeinander abgestimmt. Es kann vorkommen, dass man auf eine hellgrünen Leiste plötzlich eine schwarze folgt, ausserdem hat die Navigationsleiste auf manchen Seiten zwei Teile, die auch verschiedene Farben haben, so dass bei einem Übergang gleich zwei völlig neue Farben erscheinen. Die Zielgruppe von Amazon.com beinhaltet im Prinzip jeden, der Lesen kann. Für diese Zielgruppe ist das eine falsche Farbverwendung. Man sollte sich auf drei Farben beschränken und auf allen Seiten das gleiche Verwendungsmuster einhalten.

Amazon hat eine Funktion, die am Rand der Seite Verkaufsempfehlungen auflistet. Diese Funktion merkt sich, welche Waren sich ein Besucher schon angesehen hat und empfiehlt dann Produkte, die von anderen Benutzern noch zusätzlich gekauft wurden.
Die Seite merkt sich welche Produkte ein Kunde gekauft hat und wird in Zukunft bei jedem Besuch wieder neue Vorschläge haben.

Diese Funktion gibt dem User das Gefühl, umworben zu werben. Es ist wie ein Verkäufer in der wirklichen Welt. Die Seite ist hilfsbereit und bemüht sich, den Benutzer als Kunde zu gewinnen und zufrieden zu stellen.

Amazon.com war eine der ersten Websites, die Personalisierung in grossem Rahmen eingesetzt hat und jede Seite auf den Kunden angepasst dynamisch neu generiert. Für eine Werbeabteilung hat diese Technologie einen hohen Stellenwert.

Urteil

In den Bereichen Personalisierung, Hilfe und Navigation ist Amazon.com mustergültig. Negative Punkte sind die Verwendung der Farben und das Fehlen einer einheitlichen Darstellung über alle Seiten. Vor allem allem sollte die Website mit einem Augenmerk auf accessibility überarbeitet werden. Wenn diese Punkte optimiert werden, ist die Website für eine viel grössere Zielgruppe als usable zu taxieren.

Definitionen

Breadcrumb Trail:

ein Navigationstool, welches dem Benutzer anzeigt wo in der Website Hierarchie sich die aktuelle Seite befindet. Der Begriff kommt aus der Geschichte "Hänsel und Gretel", wo Brotbrösel zur Markierung des Weges verwendet werden.