• Facebook
  • Google+
  • Twitter
  • XING
09.05.2004

Richtlinien für die Visualisierung von Links

Textlinks sollten farbig und unterstrichen dargestellt werden, damit sie intuitiv als "anklickbar" wahrgenommen werden können, allerdings gibt es ein paar Ausnahmen von diesen Richtlinien.

 

by Jakob Nielsen (deutsche Übersetzung) - 10.05.2004

 

Hier sind die gültigen Usability-Richtlinien für die Anzeige von Textlinks:

  • Färben Sie den Textlink ein und unterstreichen sie ihn, damit er intuitiv als "anklickbar" wahrgenommen werden kann. Die Nutzer sollen nicht raten oder die ganze Seite durchpflügen müssen, um herauszufinden, wo sie etwas anklicken können.
  • Wenn der Linktext farbig ist, ist es nicht immer absolut nötig, ihn zu unterstreichen. Es gibt hauptsächlich zwei Fälle, in denen Sie sicher auf Unterstreichungen verzichten können: Navigationsmenüs und andere Linklisten. Doch auch das trifft nur dann zu, wenn das Seitendesign eindeutig die Funktion des Bereichs anzeigt. (Denken Sie daran: Für Nutzer von aussen könnte Ihr Design weniger offensichtlich sein als für Ihre Teammitglieder.) Die Nutzer begreifen normalerweise eine linkerhand angebrachte Navigationsschiene mit einer Linkliste auf farbigen Hintergrund, vorausgesetzt, sie ähnelt den Navigationsbereichen der meisten anderen Sites.

    Ausnahme: Das Unterstreichen ist unabdingbar, wenn Sie Linkfarben wie rot und grün nutzen, die Nutzern mit verbreiteten Formen von Farbenblindheit Probleme bereiten.
    Ausnahme: Unterstrichene Links sind wichtig für die Barrierefreiheit für sehbehinderte Nutzer, also halten Sie an Unterstreichungen fest, wenn Barrierefreiheit eine Priorität Ihrer Site ist oder wenn Sie viele sehbehinderte Besucher haben.

  • Unterstreichen Sie keinen Text, der nicht verlinkt ist, auch dann nicht, wenn Ihre Links nicht unterstrichen sind. Reservieren Sie Unterstreichungen für Links. Weil Unterstreichungen eine stark empfundene Gewähr der Anklickbarkeit bieten, werden die Nutzer verwirrt und enttäuscht sein, wenn unterstrichener Text dieser Erwartung dann doch nicht entspricht.

  • Verwenden Sie unterschiedliche Farben für besuchte und nicht besuchte Links. Die Farbe für nicht besuchte Links sollte lebhafter, heller und satter sein als die Farbe für besuchte Links, die "benutzt" aussehen sollte (stumpf und ausgewaschen). Die beiden Farben sollten Varianten oder Schattierungen der gleichen Farbe sein, damit der Bezug zwischen ihnen klar ist. Wenn man drastisch verschiedene Farben verwendet (etwa orange und grün), wird es schwer für die Nutzer, die Beziehung zwischen den beiden Linktypen zu begreifen und zu identifizieren, welche Farbe die "benutzte" Version der anderen sein soll. Schattierungen von Blau erzeugen das stärkste Signal für Links, aber andere Farben tun es fast genauso gut. Wie immer, wenn Sie Farben als Signal-Information verwenden, sollten Sie redundante Signale für farbenblinde Nutzer anbieten. Wenn Sie die nicht besuchten Links heller und leuchtstärker machen als die besuchten, wird dieses Ziel gewöhnlich erreicht.

  • Zeigen Sie niemals Text in den gewählten Linkfarben, wenn er nicht verlinkt ist. Generell sollten Sie farbigen Text vermeiden, wo keine Links sind. Gleichwohl können Sie manchmal farbigen Text verwenden, ohne grössere Usability-Probleme zu verursachen, vorausgesetzt, er unterscheidet sich von der Linkfarbe. Zum Beispiel können Sie in der Zusammenfassung einer Checkliste das Wort "richtig" in grün und das Wort "falsch" in rot anzeigen. (Die Tatsache, dass die Bedeutungen der Wörter sich klar unterscheiden, liefert hier das redundante Signal für farbenblinde Nutzer.) Verwenden Sie kein Blau für unverlinkten Text, auch dann nicht, wenn Blau nicht Ihre Linkfarbe ist. Blau ist immer noch die Farbe mit der am stärksten empfundenen Gewähr der Anklickbarkeit.

  • Es ist nicht erforderlich, besondere Farben oder andere Visualisierungen zu verwenden, wenn der Cursor über einen Link fährt.
    Ausnahme: Wenn Sie sich entschieden haben, Links mit weniger als der maximal empfundenen Gewähr der Klickbarkeit zu präsentieren, können Sie einiges der verlorenen Usability zurückgewinnen, wenn Sie beim Überfahren der Links Klickbarkeit signalisieren. Wenn Ihre Links zum Beispiel nicht unterstrichen sind, können Sie beim Überfahren eine Unterstreichung erscheinen lassen. Ein nützlicher Mouse-over-Effekt ist die Verwendung von Linktiteln, die den Nutzern helfen vorauszusehen, wohin der Link führt, bevor sie ihn angeklickt haben.

  • Verwenden Sie keinen winzigen Text für Links. Platzieren Sie die Links nicht so dicht beieinander, dass Nutzer mit verminderter motorischer Geschicklichkeit Schwierigkeiten haben, einen davon auszuwählen. Diese Richtlinien sind besonders wichtig, um Usability für ältere Nutzer sicherzustellen.
    Ausnahme: Es ist okay, kleine Schriften für Links zu verwenden, die nur wenige Nutzer benötigen (etwa Copyright-Infos), sofern Sie solche Links an einem sekundären Ort platzieren (wie der Fusszeile), damit die Nutzer sich nicht verpflichtet fühlen, sie zu lesen. Wenn Sie Senioren als Zielgruppe oder aus anderen Gründen viele ältere Besucher haben, stellen Sie sicher, dass Ihre Links in grosser Schrift erscheinen (12 Punkt oder mehr), und dass die Links genug Text enthalten, damit man sie leicht anklicken kann.

Diese Richtlinien beziehen sich alle auf das Erscheinungsbild der Textlinks. Noch wichtiger ist es, dass Sie den Inhalt der Links (die tatsächlichen Wörter) sorgfältig wählen, aber das ist ein anderes Thema. (Ratschläge bei Homepage-Usability, sechs Richtlinien für Links, zwölf Richtlinien fürs Schreiben und sieben Richtlinien für Navigation). Grafische Links sind wieder eine andere Geschichte, aber es ist ohnehin gewöhnlich das Beste, für die meisten Links Text zu verwenden.

Wenn Sie die Usability-Richtlinien für das Erscheinungsbild von Links auf Ihrer Site befolgen, machen Sie es Ihren Besuchern leichter, unmittelbar festzustellen, was sie auf jeder Seite tun können, und Sie reduzieren die Wahrscheinlichkeit, dass sie wichtige Links übersehen.

 

© 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