Fallbeispiele

SPIEGEL ONLINE

URL: http://www.spiegel.de/ Link

Homepage

Die Homepage der Site bietet einen Übersicht des umfangreichen Angebotes dieser Nachrichtenseite. Zusammenfassungen von Artikeln und Vorschaubilder (Thumbnails) sind mit aktuellen Nachrichten und Artikeln verknüpft. Die Navigationsleiste in der linken Spalte ist sehr umfangreich, wirkt aber übersichtlich und klar strukturiert. Die Gliederung in verschiedene Ressorts erleichtert dem Benutzer sein gewünschtes Ziel schnell zu erreichen.

Navigation

Die Navigation ist sehr einfach und übersichtlich gestaltet. Die Navigationsleiste befindet sich auf jeder Seite an der gleichen Position (Konsistenz, Erwartungskonformität). Für jede Rubrik wurde eine unterschiedliche Farbe für die Navigationsleiste definiert. Ausserdem ist eine Breadcrumb Trail implementiert, um dem Benutzer jederzeit als Orientierungshilfe innerhalb der Seitenstruktur zu dienen.

In der Navigationsleiste wird nicht zwischen besuchten und unbesuchten Links unterschieden.

Auf vielen Seiten bestehen aktive Links zur Seite selber. Diese kann bei Benutzern zu Verwirrung führen, da er erwartet, dass er durch einen Mausclick die aktuelle Seite verlässt. Damit ist dieser Dialog nicht erwartungskonform. (ISO 9241-10 Grundsätze der Dialoggestaltung)

Die Seitentitel erleichtern es dem Benutzer sich zurechtzufinden. Im Seitentitel steht jeweils die Überschrift des Artikels gefolgt von der Rubrik und dem Namen des Angebotes (SPIEGEL ONLINE).

Eine Suchfunktion in der Kopfzeile jeder Seite ermöglicht die Suche nach Inhalten. Die Suchfunktion ist nicht fehlertolerant. Sie gibt dem Benutzer keine Möglichkeit fehlerhafte Eingaben in das Suchfeld mit wenig Aufwand zu korrigieren. Beispielsweise werden bei Tippfehlern im Suchterm keine Vorschläge zu Korrektur angeboten.

Layout

Das Layout ist einfach, übersichtlich und konsistent.

Die Text sind gut lesbar und in kurze Abschnitte gegliedert. Störend wirken Werbeeinbledungen, welche innerhalb des Texbereiches des Artikels eingeblendet werden. Dies ist vom Standpunkt der Usability schlecht, da es den Benutzer in der Erreichung seines Zieles, die Aufnahme von Information durch das Lesens des Artikels, behindert, den Benutzer also in der Effizienz negativ beeinflusst. Ausserdem kann durch diese störende Werbeeinblendung die Zufriedenheit des Benutzers (user satisfaction) erheblich gesenkt werden.

Die Grössenangaben in der Seitenbeschreibungssprache (HTML) legen die Layoutelemente in absoluten Massen fest. Der Benutzer kann die Seite folglich nicht an seinen spezifischen Nutzungskontext (Bildschirmauflösung, Fenstergrösse) anpassen. Die Seite ist für den Benutzer nicht individualisierbar.

Accessibility

Es gibt keine Alternativtexte zu den Bildern und Grafiken. Die Navigationsleiste wurde ausschliesslich durch den Einsatz von Bildern (Buttons) realisiert. Dies kann bei Benutzer in bestimmtem Nutzungskontext (Sehbehinderte, WAP-Geräte, Bilder im Browser deaktiviert) dazu führen, dass die Navigationsleiste nicht benutzbar ist.

Technische Umsetzung

Die Seite beinhaltet Javascript-Code, es gibt jedoch technische Alternativen für Benutzer mit Nutzungskontext ohne dieser Funktionalität.

Emotionen

Jede Seite ist grundsätzlich in drei Farben gehalten (ausgenommen Bildern und Illustrationen). Auf der Homepage sind es sogar nur zwei, da die Navigationsleiste, Links und Überschriften ebenfalls rot sind. Die Links sind alle rot und der Hintergrund ist immer weiss. (Konsistenz)
Die verschieden Farben der Seiten bringen Abwechslung in ein Gesamtbild, dass sonst mit der Zeit langweilig würde. Zudem unterstützen sie den User dadurch, dass sie darauf aufmerksam machen, dass er in einen neuen Bereich der Website eintritt.

Die Seite wird durch den Einsatz von Bildern aufgelockert, ohne dadurch an Seriösität einzubüssen.