Ein Link ist ein Link ist ein Link...?
- Zusammenfassung

Hier sind nur die Erklärungen und Vertiefungen der optimalen Linkgestaltung zusammengefaßt. Die Übungen müssen Sie leider - hypertexttypisch - durch ein Erkunden des virtuellen Raumes absolvieren.

Lexikalische Aspekte der Linkgestaltung

Leser im WWW scannen den Text eher, als daß sie Wort für Wort lesen. Zu den scannbaren Schlüsselreizen gehören auch durch Farbe und Unterstreichung hervorgehobene Worte (i.e. Links). Im Falle des Browsens (das Ziel einer Suche ist nicht genau bekannt, ein Dokument wird deshalb nach relevanten Informationen durchsucht) sind Verweise also besonders hilfreich. Links sollten aus diesem Grunde unabhängig vom umgebenen Text, d.h. selbstbeschreibend, sein.
Das Ausweisen eines ganzen Satzes oder Textabschnittes als Link führt zu Unübersichtlichkeit, vor allem, wenn er über mehrere Zeilen führt. Besser ist es, nur ein Schlüsselwort oder eine aussagekräftige Wortgruppe als Link zu kennzeichnen.

Typografische Aspekte

Um Hierarchieebenen zu verdeutlichen, können Links z.B. in der Schriftgröße, Fettdruck, Einrückung etc. unterschieden werden. Auch vorangestellte Buttons können durch Größe oder Farbsättigung verschiedene Ebenen symbolisieren. Auf unterschiedliche Farben sollte hier verzichtet werden, es gibt keine natürlichen und allgemein anerkannten Farbhierarchien!

Verweise, die überhaupt nicht als solche erkannt werden, werden natürlich nur mit geringer Wahrscheinlichkeit bemerkt und verfolgt. Deshalb ist die Darstellung eines Links im WWW quasi standardisiert:
Ein textueller Link soll sich durch Farbe und Unterstreichung vom umgebenden Text abheben. Abweichungen von dieser Regel sollten sehr überlegt geschehen. Wichtig ist dann v.a., für die noch nicht verfolgten Links eine auffälligere Farbe zu verwenden als für die schon besuchten Links.

Noch eine Anmerkung von Jakob Nielsen (1995), Seite ...:

It is possible to use the Guide method of providing feedback by changing the shape of the cursor when it is over an anchor. But that method should still be supplemented with some visual indication of the location of the anchor since users will otherwise be reduced to playing mine sweeper with the mouse to discover the active areas of the screen.
Unfortunately the highlighting of anchors conflicts with the use of emphasis in the running text. Traditionally writers have used typographical notation like italic or boldfaced to indicate various forms for emphasis or special purposes text like quotations, and we would like to keep these capabilities for hypertext authors.

Nur im Falle eines spielerischen Erkundens eines Hypertextes sind nicht erkennbare Links erlaubt und sogar gefordert. Wenn Hypertext aber zur Informationsvermittlung oder -gewinnung eingesetzt wird, sollte das Erreichen eines Zieles mit dem geringsten Aufwand verbunden sein.

Räumliche Anordnung von Links

Wichtige Links werden an den Beginn der Seite gesetzt. Nur 10% aller WWW-Anwender scrollen. Da die Suche nach dem richtigen Link vermutlich als selbstabbrechender Suchprozeß funktioniert, werden weiter oben stehende Links mit größerer Wahrscheinlichkeit verfolgt.
Darüber hinaus sollten Links, die der Navigation in einer website dienen oder Kontakt ermöglichen, am Beginn der Seite, z.B. in einem "Linkkasten", erscheinen. Dies erhöht die Kontrollmöglichkeiten des Lesers.
Um auch innerhalb eines längeren Dokuments Kontrolle zu geben, können Links wie
zum Beginn des Dokuments,
zum Beginn des Kapitels
usw. im Text eingesetzt werden. Hierzu kann auch ein an den Beginn gestelltes Inhaltsverzeichnis zählen.

Links, die auf weiterführende, erläuternde Dokumente verweisen, sind mitten im Text am besten aufgehoben. Dabei sollten mit Links überfrachtete Texte möglichst vermieden werden.

Jakob Nielsen [1995], Seite ... schreibt:

...the next issue is whether or not to make the anchors especially prominent on the screen compared with the rest of the node. In a sparse hypertext, where maybe less than 10% of the information serves as anchors, it is probably a good idea to visualy emphasize the anchors. This is just a special case of the general user interface guideline of letting the user know what options are available in a dialog. In a rich hypertext, where almost everything is linked to something, the best advice would be to remove any special emphasis on the anchors. After all, if everything is highlighted, then nothing is really highlighted anyway.

Einsatz von Piktogrammen

Piktogramme sind beliebt, können aber häufig zu Fehlinterpretationen führen. Ein Piktogramm oder Icon symbolisiert einen Begriff, eine Kategorie (z.B. eine Verkehrsanbindung) oder einen Vorgang (z.B. das Verschicken einer e-mail). Aber nur wenige Piktogramme gehören zum common sense. Viele Symbole müssen erst "erfunden" werden, dazu bedarf es meist des Findens einer Metapher. User müssen diese Metapher allerdings auch nachvollziehen können. Da aber die Begriffswelt des Web-Designers wohl nur in wenigen Fällen der des Anwendes entspricht, können sehr wohldurchdachte Piktogramme auf der Seite des Lesers falsch interpretiert werden.

Auch Primärbegriffe spielen eine große Rolle. Auf einem bestimmten hierarchischen Niveau sind Begriffe am deutlichsten mit entsprechenden Bildern verknüpft. Man kann Begriffe in kategoriale (Begriffe haben eine gemeinsame Funktion), Objektbegriffe (z.B. Obst oder Banane, je nach Hierarchieebene) oder Ereignisbegriffe (z.B. Fahrradfahren) einteilen.
Dabei sind v.a. Objektbegriffe kognitiv gut mit einem Bild verknüpfbar, besonders auf unterem, konkreten Niveau. Ereignisbegriffe sind nicht direkt anschaulich, sondern nur über das dazugehörige Objekt zu erschließen (also z.B. Fahrradfahren über ein Fahrrad-Icon).
Es empfiehlt sich, verschiedene Piktogramme an einer kleinen Gruppe von Usern zu testen. Wenn dabei den Icons die geplanten Begriffe zugeordnet werden, kann von einer guten Selbstbeschreibung der Piktogramme ausgegangen werden.

Als Sonderbeispiel erwähne ich noch Flaggen, die für die jeweilige Version des Textes in der Landessprache stehen. Diese sind auch ohne zusätzliche textuelle Erläuterung zu verstehen, trotz des eher abstrakten Inhalts. Zu beachten ist hierbei allerdings der Umfang der Versionen. Eine Liste von mehr als 8-10 Sprachversionen wird zu unübersichtlich, hier empfiehlt sich eine alphabetische Liste, nach Anfangsbuchstaben geordnet.

Unterschiede zu textuellen Links:

Anwendung von Piktogrammen als Link:

Kombination von Bildern und Texten

Interpretationsprobleme ("Wohin führt dieser Link?") werden durch die gleichzeitige Darbietung von Bild und Text drastisch reduziert. Alleinstehende Piktogramme sind nur in einigen Fällen selbstbeschreibend. Durch eine konkrete wörtliche Beschreibung des Links findet eine Entkodierung auf zwei Ebenen statt, der verbalen und der bildlichen Ebene.

Eine interessante Lösung des oben erwähnten Problems sind die Qbullets. Dabei wird an die Text-Links ein winziges Symbol angefügt. Es existieren ausreichend viele Symbole. Nicht ganz gesichert ist jedoch die eindeutige Identifizierung der Symbole.

Erklärung zu begrifflichen Merkmalen von Links

Jeder Link muß als einzigartig betrachtet werden. Wohin führt er, warum soll ein Anwender diesem Link folgen, was unterscheidet ihn von seinen "Linkkonkurrenten"?
Diese Fragen müssen Sie sich stellen, jedesmal, wenn sie einen Verweis setzen.

Links müssen sich von ihren Nachbar-Links unterscheiden.
V.a. in Texten mit mehreren konkurrierenden Verweisen ist es wichtig, wenige begriffliche Überschneidungen einzusetzen. Als Beispiel soll meine Übung dienen.

Ein Link soll seinem Ziel ähneln.
Benennen Sie, wenn möglich, den Link analog zur Überschrift des Zieltextes/der Zielgrafik. Mindestens Schlüsselwörter der Überschrift sollten im Link enthalten sein. So vermeiden Sie Konfusion beim Leser.
Beispiel:
Märchenfigur Rumpelstilzchen

Ein Link sollte auch alleinstehend aussagekräftig sein.
Vermeiden Sie Sätze wie: Für weitere Informationen klicken Sie hier.
Besser ist in diesem Fall: Weitere Informationen stehen Ihnen zur Verfügung.

Kontextfaktoren

Mit Hilfe von Kontexten können Icons oder Textlinks leichter unterschieden werden. Dadurch fällt auch die Wahl des relevanten Links leichter.

Kontexte können als parallel dargebotene:

Als Beispiel dienen parallel dargebotene Icons:

{short description of image}

Hier dienen die in einem Kontext stehenden graphischen Links der Navigation. Durch den direkten Vergleich der Alternativen kann der Leser gut abschätzen, ob ihn ein Link zurück, vorwärts oder nach oben führen wird.

Was bringt die Zukunft?

Eine Antwort auf das Problem "Visualisieren von Zusammenhängen zwischen Dokumenten/ wohin führt dieser Link?" könnte u.a. das Plug-In Hotsauce von Apple bringen. Es erlaubt das Darstellen der HTML-Dokumente einer gesamten website im 3D-Raum. Dabei erscheinen Links/Seitentitel als zusammengehörige Gruppen, dem Bildschirm das Erscheinungsbild einer Galaxie mit Sternenhaufen gebend. Hierarchisch höherstehende Dokumente werden näher, größer und mit kräftigeren Farben dargestellt, die untergeordneten Dokumente weiter entfernt und mit blasseren Farben, aber noch sichtbar. Der Leser kann sich "fliegend" einer Dokumentengruppe nähern, um sie zu "erforschen" und eventuell auf dem gewünschten Dokument zu landen. Eine Abbildung des Bildschirms mit Hotsauce:

Kritisch an diesem Projekt ist der Transport der großen Datenmengen, die für die 3D-Darstellung notwendig sind. Die bisher verwendeten, zweidimensionalen Piktogramme und Textlinks scheinen, wenn ergonomisch korrekt angewendet, z.Z. ausreichend zu sein. Mit dem Anwachsen der Bandweite des Internets könnten aber solche dreidimensionalen virtuellen Räume an praktischer Nutzbarkeit und damit an Attraktivität gewinnen.

Literatur und andere Quellen

Wie auch bei anderen Themen zum WWW sind wissenschaftliche Informationen zur ergonomischen Linkgestaltung dünn gesät. Die folgende Aufstellung gibt einen Überblick über die von mir benutzten Quellen.

zurück zum Inhaltsverzeichnis

Marian Gunkel, geschrieben: 27.4.1998, zuletzt geändert: 16.8.1998