• Facebook
  • Google+
  • Twitter
  • XING
21.12.2003

Die Top Ten der Webdesign-Fehler 2003

Sites werden besser, indem sie minimalistisches Design benutzen, Archive bereitstellen und umfassende Dienste anbieten. Allerdings bringen diese Vorteile eigene Usability-Probleme mit sich, wie mehrere markante Fehler des Jahres 2003 zeigen.

 

by Jakob Nielsen (deutsche Übersetzung) - 22.12.2003

 

Hier ist meine Liste von zehn Unarten, die in jüngster Zeit bei Websites besonders negativ aufgefallen sind.

1. Unklare Zweckangabe

Viele Firmen, besonders in der High-Tech-Branche, nutzen vage und generalisierende Begriffe, um ihre Absichten zu beschreiben. Das Verschleiern dieser grundlegenden Fakten erschwert es den Besuchern sehr, die Informationen und Dienste einer Website einzuschätzen.

Ein belastbares mentales Modell kann aus kleinen Samenkörnern heranwachsen, so wie jedes zusätzliche Design-Element das bestehende Verständnis des Besuchers von der Site ergänzt. Allerdings erzeugen viele Sites verschwommene Vorstellungen in den Köpfen ihrer Besucher. Sie missachten die Tatsache, dass Nutzer die Informationen in den richtigen Kontext einordnen können müssen.

2. Neue Web-Adressen für archivierten Inhalt

Mit sehr geringem zusätzlichen Aufwand vergrössern Archive den Wert einer Site substanziell. Obwohl mehr und mehr Sites alte Inhalte archivieren, misslingt es den meisten Sites, gute Archive bereitzustellen. Manche Sites behandeln Archive als separaten Site-Bereich und vergeben neue Web-Adressen (URLs) an die Seiten, sobald sie aus dem Hauptbereich ins Archiv gestellt werden.

Die Web-Adresse beim Archivieren zu ändern, verursacht gebrochene Links. Außerdem führt es dazu, dass andere Sites nur widerwillig auf Ihre Site verlinken. Obwohl es diese in Betracht ziehen könnten, auf einen Ihrer aktuellen Artikel zu verlinken, werden sie es oft bleiben lassen, falls sie sich damit in der Vergangenheit Probleme mit gebrochenen Links eingehandelt haben. Denn sie möchten sich nicht mit dem Aktualisieren ihrer Seiten herumschlagen, falls Sie Ihre umgestalten.

3. Undatierte Inhalte

Ohne Datum auf Artikeln, Pressemitteilungen und anderen Inhalten haben die Nutzer keine Ahnung, ob die Information aktuell oder veraltet ist. Es ist grossartig, Inhalte in Archiven bereitzustellen. Die Alertbox zum Beispiel gewinnt 80% ihrer Leserschaft über alte Kolumnen, welche die Leser weiterhin nützlich finden. Aber manche Fakten und Empfehlungen sind stark zeitgebunden, etwa wenn ich empfehle, eine bestimmte Version eines Software-Pakets zwei weitere Jahre lang zu nutzen. Natürlich meine ich zwei Jahre vom Tag an, an dem der Artikel geschrieben wurde; wenn die Leser das Datum nicht sehen können, wissen sie nicht, wie sie der Empfehlung folgen sollen.

Einem ähnlichen Fehler ist ein Nutzer kürzlich in unserer Untersuchung begegnet, wie Investoren und Wirtschaftsjournalisten den Investor-Relations-Bereich von Unternehmens-Websites auswerten. Der Besucher hat über die Suchmaschine der Site eine Nachrichtenmeldung gefunden und sie dazu benutzt, die geschäftlichen Aussichten der Firma zu bewerten. Schön, ausser dass die Meldung schon ein paar Jahre alt war. Die Suchmaschine hatte den Artikel mit einem irreführenden Datum versehen - wahrscheinlich dem Datum, an dem die Datei verschoben oder ein Tippfehler beseitigt worden war.

Die Suchmaschine auf meiner eigenen Site hat das gleiche Problem: Sie orientiert sich am Dateiüberarbeitungsdatum des Betriebssystems anstatt an dem Datum, an dem der Inhalt geschrieben worden ist. Ich habe daraus die Konsequenz gezogen und die Datumsfunktion in den Suchergebnislisten abgeschaltet. Solche Daten können sehr nützlich sein, aber sie richten mehr Schaden an als Nutzen, wenn die Nutzer sich nicht auf sie verlassen können. Natürlich wäre die Ideallösung ein Content-Management-System, das die Suchmaschine mit dem Entstehungsdatum füttert. Jede große Site mit IT-Personal sollte das so handhaben.

4. Kleine Daumennagelbilder von großen, detailreichen Fotos

Es ist großartig, dass Websites jetzt kleinere Bilder verwenden. Die aufgeblasenen Designs der Vergangenheit zu vermeiden, reduziert die Ladezeiten und steigert den Informationsgehalt. Es ist ebenfalls gut, wenn kleine Bilder auf den Sites zu größeren Bildern verlinken, so dass die Nutzer die Möglichkeit haben, das Bild im Detail zu betrachten.

Das Hauptproblem dabei ist, dass die Websites normalerweise kleine Bilder produzieren, in dem sie die großen Bilder einfach verkleinern. Wenn ein Originalfoto eine Menge komplizierter Details enthält, ist das Daumennagelbild oft unverständlich.

zu kleines Bild zu kleines Bild

Das linke Foto stammt von der Site whitehouse.gov. Es zeigt den US-Präsidenten, den Innenminister und den Nationalparkdirektor in den Bergen von Santa Monica. Wenn ich Ihnen das nicht gesagt hätte, würden Sie es beim Anschauen des Daumennagelbildes nicht erkennen: Es ist bloß ein Foto von drei Personen. Sie können noch nicht einmal wirklich feststellen, dass sie in einem Park sind, geschweige denn, in welchem.

Das rechte Foto stammt von cnn.com, die gewöhnlich auf ihrer Homepage gut mit kleinen Bildern arbeiten. Das Foto hat eine Geschichte über Hochwasser illustriert; in diesem Fall können Sie klar erkennen, was vorgeht, obwohl das Bild bloß 65*49 Pixel groß ist.

Wenn Sie Fotos im Web nutzen:

  • Zeigen Sie weniger Leute und Objekte, und weniger komplizierte Settings als Sie für Fotos im Printbereich verwenden würden
  • Bevorzugen Sie Nahaufnahmen mit sauberem Hintergrund
  • Nutzen Sie Techniken der relevanzabhängigen Bildreduktion, wenn Sie ein kleines Foto aus einem großen herstellen. Verkleinern Sie es nicht einfach; schneiden Sie das Bild zuerst zurecht, um es auf ein hervorstechendes und einfaches Element zu fokussieren.

5. Zu detaillierte ALT-Texte

Viele Sites sind dazu übergegangen, auf behinderte Nutzer Rücksicht zu nehmen, und befolgen dabei Zugänglichkeitsrichtlinien wie jene der ALT-Texte für Bilder einzubauen.

Leider beachten manche Sites nicht, dass ALT-Text ein Bestandteil der Nutzeroberfläche ist und nicht ein Zeugnis politischer Korrektheit. ALT-Text soll blinden Nutzern (und anderen, die keine Bilder erkennen können) helfen, in der Site zu navigieren und mit ihr zu arbeiten. Der Text sollte die Bedeutung des Bildes für die Interaktion beschreiben und was Nutzer über das Bild wissen müssen, um die Site möglichst effektiv nutzen zu können. Es ist nicht nötig, irrelevante visuelle Details zu beschreiben.

Zum Beispiel bin ich auf eine Site gestossen, die folgenden ALT-Text für ihr Logo eingesetzt hat: "Link zur Homepage über das IDEAS-Logo: Zwei Wirbel umkreisen IDEAS und im Hintergrund geht die Sonne auf." Es mag sinnvoll sein, irgendwo in der Site eine Textbeschreibung des Logos einzubauen, für blinde Nutzer, die wissen wollen, wie es aussieht. Aber es macht keinen Sinn, wenn der Bildschirmleser jedes Nutzers auf jeder einzelnen Seite die Anzahl der Wirbel im Logo verkündet.

Es braucht einige Zeit, bis der Bildschirmleser neunzehn Wörter vorgelesen hat, und die ausführliche Beschreibung macht es schwerer, die entscheidende Information herauszufiltern: dass die Grafik ein Link auf die Homepage ist.

Kurz ist gut, wenn man fürs Web schreibt; es ist sogar noch besser, wenn man für Bildschirmleser schreibt.

6. Keine "Was-ist-wenn"-Hilfe

Alternativen zu vergleichen und auszuwählen ist die Basis für viele entscheidende Aufgaben im Web, doch die meisten Websites unterstützen die Besucher nicht, wenn sie Alternativen abwägen wollen.

Was ist, wenn ich nicht am Samstag, sondern am Sonntag verreisen will? Wie würde das den Preis meines Flugtickets beeinflussen? Bei den meisten Reisesites, ist der einzige Weg, diese Frage zu beantworten, nochmals beim ersten Formular anzufangen, einen völlig neuen Trip zu planen und dabei die ganze Arbeit zu verlieren, die man in das Erstellen der ersten Reiseroute gesteckt hat.

Was ist, wenn ich keinen Schwarz-Weiß-, sondern einen Farbkopierer haben will, aber mit allen anderen Attributen des Schwarz-Weiß-Kopierers zufrieden bin, den ich gerade anschaue? Kann ich nach Attributen navigieren und bloß einen der Parameter verändern? In der Regel nicht.

Manche Websites erlauben es den Nutzern, einige Produkte auszuwählen und eine Vergleichstabelle zu betrachten, aber normalerweise haben solche Tabellen eine geringe Usability und heben die wichtigsten Unterschiede zwischen den Produkten nicht hervor.

7. Lange Listen, die man nicht anhand von Attributen bereinigen kann

Früher haben Websites gewöhnlich ein oder zwei Dinge angeboten. Heutzutage findet man gewöhnlich Sites mit Tausenden oder Millionen von Artikeln. Wunderbar, aber das bedeutet, dass Artikellisten oft sehr lang werden und schwer zu nutzen sind.

Eine der Haupt-Usability-Richtlinien für kategorisierte Seiten besteht darin, die Nutzer anhand ihrer Interessen Artikel aussortieren zu lassen. Eine Liste zu bereinigen bedeutet im Grunde, Elemente herauszufiltern, auf die bestimmte Kriterien nicht zutreffen, so dass eine kürzere Liste entsteht, die einfacher zu handhaben und zu verstehen ist.

Eine nützliche Bereinigung erfordert vier Dinge:

  • Zunächst einmal muss die Site das Bereinigen unterstützen, und die meisten tun das nicht.
  • Die Bereinigungsattribute müssen für den Nutzer sinnvoll sein und nicht hochtechnisch oder betriebsintern (etwa Artikelnummern; allerdings sollte für Nutzer, die genau wissen, was sie brauchen, eine Suche nach Nummern angeboten werden).
  • Die Kriterien sollten interessante Produkte von solchen unterscheiden, die der Nutzer ausblenden möchte. Beispiele:

    • Nur Produkte zeigen, die am Heiligabend ausgeliefert werden können.
    • Nur Schuhe zeigen, die in Größe 10 extraweit erhältlich sind.

  • Schließlich muss natürlich die Nutzeroberfläche, die den Bereinigungsprozess steuert, einfach sein, damit sich der Nutzer auf die Attribute und Listen konzentrieren kann und nicht auf die Bedienungsmechanismen der Site.

8. Produkte, die nur nach Markennamen sortiert werden können

Sites, die viele Artikel anbieten, sollten es ermöglichen, zu bereinigen und zu sortieren. Dies ist sehr nützlich, wenn man mit Listen arbeitet, und ist zum Glück ziemlich weit verbreitet. Leider lassen sich auf vielen Sites die Produkte nur nach Markennamen sortieren. So kann man, sagen wir, alle Armani-Produkte finden, nicht aber alle roten Pullover. Um das Sortieren nach Nutzerinteressen möglich zu machen, ist offensichtlich die erste Frage: "Welche Attribute sind den Nutzern wichtig?" Die Antworten werden je nach Produktkategorie verschieden sein, aber Nutzerforschung kann Ihnen helfen, diese herauszufinden, so wie das auch ein guter Verkäufer kann.

9. Überrestriktive Formularfelder

Belasten Sie den Computer, nicht den Menschen: Lassen Sie die Nutzer ihre Daten so eingeben, wie sie es möchten. Zwei verbreitete Arten, die Nutzer unfair einschränken:

  • Ausgewählte, überspezifische Formulare. Auf mehrere Felder aufzuteilen, was die Nutzer als einzelnes Stück Information betrachten, führt dazu, dass die Nutzer Zeit verschwenden müssen, um den Cursor fortzubewegen. Ein typisches Beispiel ist, wenn Formulare vom Nutzer verlangen, Vornamen und Nachnamen als zwei getrennte Elemente einzugeben, anstelle ihm die Möglichkeit zu lassen, seinen ganzen Namen in ein einzelnes Feld zu schreiben, was viel schneller geht. Ein anderes Beispiel:

    Telefonnummer:
    Formularfeld für Telefonnummer
  • Gewohntes Formatieren verboten. Jedes Texteingabefeld, das vom Nutzer verlangt, die Information in einer bestimmten Art und Weise einzugeben und ihm die natürlichen Variationen, die von den Nutzern bevorzugt werden, nicht erlauben, kann irritierend sein. Viele Sites zwingen die Nutzer zum Beispiel, die Kreditkartennummer als 1234567890123456 einzugeben, und lassen es nicht zu, nach jeweils vier Ziffern einen Abstand einzugeben, was die Gefahr für Fehler signifikant verringern würde. Genauso lassen manche Sites die Besucher keine Telefonnummern mit Klammern um die Vorwahl eingeben, obwohl viele Besucher es gewohnt sind, solche Klammern zu setzen. Unsere Tests haben gezeigt, dass besonders ältere Bürger darunter leiden, wenn das Format in der Website anders ist als das Format, das sie seit vielen Jahren gewohnt sind.

Restriktive Dateneingabefelder verursachen auch Internationalisierungsprobleme, weil das eine, heilige Format, das der Computer akzeptiert, oft an den Grenzen endet und Kunden aus anderen Ländern ausschliesst.

10. Seiten, die auf sich selbst verlinken

Dieser Punkt wurde im Detail als Punkt #10 meiner Liste der meist-missachteten Homepage-Richtlinien ausgeführt, aber er ist für alle Seiten wichtig, nicht nur für Homepages.

Web-Usability: Zwei Schritte vorwärts, einen Schritt zurück

Viele der Top-Designfehler dieses Jahres sind bezeichnend für ein positives Phänomen: Wir machen Fortschritte bei der Web-Usability. Da die Sites jetzt bestimmte Dinge richtig machen, stossen wir auf Phänomene zweiter Ordnung, die erst dadurch Probleme machen, weil die Nutzer die Probleme erster Ordnung überwunden haben.

Zum Beispiel tritt die Frage nach guten oder schlechten ALT-Texten erst bei Sites auf, die sich um ihre Zugänglichkeit kümmern und deshalb überhaupt ALT-Texte einsetzen. Andere Top-Fehler dieses Jahres kommen von Sites, die kurze Ladezeiten erzielen möchten, indem sie die Größe der Bilder reduzieren, die gute Archive bereithalten oder eine breite Produktauswahl anbieten. Das sind alles positive Design-Entwicklungen, aber Aufmerksamkeit für Details ist erforderlich, um eine optimale Usability-Wirkung zu erzielen.

Fehler für 2004 vorrangig behandeln

Bis heute habe ich buchstäblich mehr als tausend Web-Usability-Richtlinien veröffentlicht. Welche Richtlinien sind die wichtigsten, unter der Annahme, dass nicht alle Sites alles machen können? Diese Frage ist Thema eines neuen Forschungsprojekts, bei dem wir das Verhalten von Webnutzern unter weit reichenden Bedingungen untersuchen werden, um zu sehen, welche Usability-Punkte den Nutzern am meisten schaden oder nutzen. Wir werden die Ergebnisse im April und Mai auf meinen Web-Usability-Seminaren in den USA, in Europa und Australien präsentieren.

 

© Deutsche Version von Jakob Nielsens Alertbox. Institut für Software-Ergonomie und Usability AG. Alle Rechte vorbehalten.

Kommentare auf diesen Beitrag

    Keine Kommentare

Kommentar hinzufügen

Die mit * gekenzeichneten Felder sind zwingend auszufüllen