Fünf neue Labels für Navi

Die Hauptnavigation von Navi bestand zunächst aus den fünf Bereichen Organisation, Labeling, Design, Umsetzung und Barrierefreiheit. Die inhaltliche Aufteilung des Guides stand somit bereits weitgehend fest. Offen war aber, ob die verwendeten Begriffe verständlich genug vermitteln, welche sich hinter ihnen befinden. Das ist bei einem Leitfaden über Navigation eine durchaus relevante Frage. Wenn Navi selbst verständliche Labels behandelt, sollte die eigene Navigation diesen Anspruch ebenfalls erfüllen.

Deshalb haben wir die fünf Hauptbereiche noch einmal genauer betrachtet, alternative Begriffe entwickelt und diese anschließend in einem qualitativen Test mit fünf Personen geprüft.

Was waren die Hürden der Labels?

Die ursprünglichen Begriffe waren nicht grundsätzlich falsch, aber bei genauerer Beobachtung zeigten sich Schwächen.

Organisation beschreibt zwar das Ordnen und Strukturieren von Inhalten, könnte aber ohne weiteren Kontext ebenso eine Institution oder einen organisatorischen Prozess bezeichnen. Das ist besonders als erster Menüpunkt sehr anfällig für Missverständnisse.

Labeling ist der fachlich passende Begriff für die Bezeichnung von Inhalten und Navigationsmöglichkeiten. Im Vergleich zu den anderen Menüpunkten setzt er allerdings mehr Vorwissen voraus und fällt zudem durch die englische Bezeichnung aus dem Raster der ansonsten deutschsprachigen Navigation.

Design erwies sich als besonders weit gefasst, denn der Begriff kann praktisch die gesamte visuelle Gestaltung einer Website umfassen, von Farben und Typografie bis zu Abständen und Layout. Der entsprechende Bereich des Guides behandelt dagegen gezielt Navigationssysteme und Orientierung.

Auch Umsetzung ist zunächst nicht spezifisch: Ohne den Kontext der übrigen Bereiche könnte damit nahezu jeder Schritt bei der Entwicklung der Website gemeint sein.

Lediglich Barrierefreiheit erschien bereits ausreichend konkret und verständlich.

Wer soll die Labels verstehen können?

Navi richtet sich nicht ausschließlich an Personen, die bereits mit Informationsarchitektur oder Navigationsdesign vertraut sind. Zur Zielgruppe gehören Menschen mit wenig bis mittlerem Vorwissen im gleichen Maße wie Webdesigner*innen, Webentwickler*innen, Studierende und Personen, die beispielsweise im Rahmen eines Unternehmens oder Start-ups an einer Website arbeiten. Daraus ergab sich eine wichtige Anforderung für die Hauptnavigation:

Die fünf Begriffe sollten mit möglichst wenig Vorwissen verständlich sein.

Innerhalb der Untermenüs kann hingegen stärker mit Fachsprache gearbeitet werden, da die zusätzlichen Beschreibungen genügend Kontext geben, um Begriffe wie Informationsarchitektur oder Labeling-Konventionen einzuordnen.

Was beschreiben die Bereiche?

Bevor neue Begriffe gesucht werden konnten, musste zunächst möglichst eindeutig definiert werden, wofür diese fünf Bereiche eigentlich stehen.

  1. Die Inhalte organisieren
    Am Anfang steht die strukturelle Grundlage einer Website, noch bevor die eigentliche Navigation gestaltet wird. Inhalte müssen geordnet, gruppiert und miteinander in Beziehung gesetzt werden. Dazu gehören die Grundlagen der Informationsarchitektur, unterschiedliche Organisationssysteme und der Aufbau von Hierarchien. Ziel ist eine nachvollziehbare Struktur, auf der die spätere Navigation aufbauen kann.
  2. Die Inhalte benennen
    Anschließend stellt sich die Frage, wie Inhalte, Kategorien und Navigationsmöglichkeiten bezeichnet werden. Links, Menüpunkte, Überschriften oder Icons sollen möglichst zuverlässig vermitteln, was Nutzer*innen dahinter erwartet. Dabei spielen unter anderem Konventionen, Verständlichkeit, Konsistenz und das Vokabular der Zielgruppe eine Rolle.
  3. Wege durch die Struktur schaffen
    Aus Informationsarchitektur und Labeling-System entsteht schließlich ein konkretes Navigationssystem. Globale, lokale, kontextuelle und ergänzende Navigation sowie Breadcrumbs bieten unterschiedliche Wege durch die Inhalte. Sie sollen Nutzer*innen dabei unterstützen, ihre eigene Position zu ermitteln und zu verstehen, welche Möglichkeiten ihnen zur Verfügung stehen und wie sie ihr Ziel erreichen.
  4. Das Konzept technisch umsetzen
    Das entwickelte Navigationskonzept muss anschließend zu einem funktionierenden Webinterface werden. Dieser Bereich behandelt unter anderem den semantischen Aufbau, Zustände und Interaktionen sowie Darstellungsformen wie Mega- und Flyout-Menüs oder die Anpassung der Navigation an unterschiedliche Bildschirmgrößen.
  5. Die Navigation zugänglich machen
    Navigation sollte von möglichst vielen Menschen unabhängig von ihren Fähigkeiten, Hilfsmitteln oder Eingabemethoden genutzt werden können. Dazu gehören beispielsweise die Bedienung mit der Tastatur, sichtbare Fokuszustände, eine sinnvolle Fokusreihenfolge, die Nutzung mit Screenreadern sowie ausreichende Kontraste und geeignete Zielgrößen.

Von den Definitionen zu Begriffen

Aus diesen fünf Definitionen ließen sich unterschiedliche mögliche Labels ableiten:

Organisation: Struktur, Architektur

Labeling: Benennung, Bezeichnung, Sprache, Begriffe

Design: Navigation, Gestaltung, Orientierung

Umsetzung: Entwicklung, Implementierung, Funktion, Frontend

Barrierefreiheit

Für die ersten drei Bereiche zeichneten sich mit Struktur, Benennung und Navigation relativ schnell verständliche Alternativen ab. Beim vierten Bereich war die Entscheidung schwieriger. Entwicklung erschien zunächst als mögliche Alternative zu Umsetzung in Frage zu kommen, denn der Begriff beschreibt schließlich den Schritt vom Konzept zum funktionierenden Webinterface. Ob diese Bedeutung auch ohne weitere Erklärung verstanden wird, sollte der anschließende Test zeigen.

Sind die Labels verständlich?

Um einen ersten Eindruck davon zu bekommen, welche Erwartungen die Begriffe auslösen, haben wir fünf Personen mit unterschiedlichen Kenntnisständen gefragt, welche Inhalte sie hinter den einzelnen Menüpunkten vermuten würden. Dabei ging es nicht darum, die Qualität der Labels statistisch zu untersuchen, sondern lediglich einen qualitativen Verständlichkeitstest durchzuführen. Interessant war vor allem, welche spontanen Assoziationen die Begriffe hervorrufen. Zusätzlich zu den fünf Labels kannten die fünf Personen außerdem den Namen und Untertitel des Leitfadens.

Bei Struktur gingen die Antworten bereits deutlich in die gewünschte Richtung. Genannt wurden beispielsweise:

„Wie strukturiere ich eine Website am besten?“

Auch Benennung wurde sehr nah an der Bedeutung interpretiert:

„Wie benenne ich die einzelnen Strukturpunkte am sinnvollsten?“

Bei Navigation wurde erwartungsgemäß das Navigieren durch eine Website erkannt. Die konkreten Vorstellungen unterschieden sich aber etwas: Eine Person dachte beispielsweise an sinnvolle Navigationspunkte wie Impressum oder Kontakt, eine andere beschrieb die verschiedenen Wege durch eine Website.

Barrierefreiheit wurde ebenfalls grundsätzlich in der vorgesehenen Richtung verstanden. Genannt wurden unter anderem verständliche Sprache, Screenreader und die Frage, welche Barrieren bei der Nutzung einer Website auftreten können.

Entwicklung oder Umsetzung?

Am auffälligsten waren die Reaktionen auf Entwicklung: Eine Person konnte mit dem Begriff im Zusammenhang mit den anderen Menüpunkten nichts Konkretes verbinden. Andere Antworten gingen zwar in Richtung der praktischen Realisierung, bleiben aber ebenfalls sehr weit gefasst. Somit löste “Entwicklung” genau das Problem nicht, das durch das Relabeling eigentlich reduziert werden sollte.

Wir fragten alle fünf Personen, ob sie die Bezeichnung “Umsetzung” in dem Kontext treffender fänden und diese Frage wurde einstimmig bejaht. Letztendlich sind wir dann wieder zum Label Umsetzung zurückgekehrt.

Auch dieser Begriff ist isoliert betrachtet nicht eindeutig, denn er könnte sich theoretisch auf nahezu alle Bereiche des Projekts beziehungsweise sogar auf den gesamten Leitfaden beziehen. Im Kontext der anderen Menüpunkte erhält er jedoch eine konkretere Bedeutung: Nachdem Inhalte strukturiert und benannt wurden und daraus eine Navigation entstanden ist, folgt deren Umsetzung als funktionierendes Webinterface.

Die Entscheidung zeigt gleichzeitig eine Grenze des Labelings: Ein einzelnes Label muss nicht jede Bedeutung vollständig erklären können. Es steht innerhalb eines Systems und wird auch durch die Begriffe um sich herum verständlich.

Das Ergebnis

Aus der ursprünglichen Navigation

Organisation · Labeling · Design · Umsetzung · Barrierefreiheit

wurde schließlich:

Struktur · Benennung · Navigation · Umsetzung · Barrierefreiheit

Struktur beschreibt die Organisation und Hierarchie der Inhalte konkreter als “Organisation”. Benennung ersetzt den Fachbegriff “Labeling” durch einen Begriff, der auch ohne entsprechendes Vorwissen verständlich ist. Navigation grenzt den Inhalt des Bereichs wesentlich stärker ein als der allgemeine Begriff “Design”. Umsetzung bleibt zwar ein relativ breiter Begriff, funktioniert aber innerhalb der Abfolge besser als die getestete “Entwicklung”. Barrierefreiheit wurde beibehalten, da der Begriff bereits verständlich und inhaltlich passend war.

Die Labels sind nicht zwangsläufig die einzig möglichen Bezeichnungen, bilden aber einen Kompromiss aus fachlicher Präzision, Verständlichkeit und ihrem jeweiligen Kontext innerhalb des Leitfadens.

Grundriss und zugängliche Wege

Vereinfacht lässt sich die neue Struktur mit einem Haus vergleichen:

Struktur ist der Grundriss: Sie legt fest, welche Räume vorhanden sind und wie sie miteinander zusammenhängen.

Benennung sind die Türschilder: Sie vermitteln, was sich hinter den einzelnen Türen verbirgt.

Navigation sind die Türen: Sie ermöglichen es, sich zwischen den Räumen zu bewegen und das gewünschte Ziel zu erreichen.

Umsetzung ist der Bau: Aus dem zuvor entwickelten Plan entsteht etwas, das tatsächlich funktioniert und benutzt werden kann.

Barrierefreiheit sorgt für zugängliche Wege: Das Haus sollte nicht nur theoretisch erreichbar sein, sondern von möglichst vielen Menschen genutzt werden können.

Die Analogie ist natürlich eine starke Vereinfachung, zeigt aber gut, warum die fünf Bereiche aufeinander aufbauen und weshalb ihre Bezeichnungen nicht unabhängig voneinander betrachtet werden können.

Fazit des Relabelings

Der Prozess hat vor allem gezeigt, dass ein fachlich korrekter Begriff nicht automatisch ein gutes Label ist. Entscheidend ist, welche Vorstellung er bei den Menschen hervorruft, die ihn benutzen sollen. Gleichzeitig muss ein Label nicht für sich allein sämtliche Inhalte eines Bereichs erklären. Seine Position innerhalb der Informationsarchitektur, benachbarte Begriffe und zusätzliche Beschreibungen tragen ebenfalls zu seiner Bedeutung bei.

Die Entwicklung des Labeling-Systems endet nicht mit der Suche nach passenden: Die Begriffe müssen im Zusammenhang betrachtet und mit Menschen überprüft werden, für die sie später Orientierung schaffen sollen. Für Navi kommt noch eine weitere Ebene hinzu: Ein Leitfaden über verständliche Navigation sollte seinen eigenen Empfehlungen auch auf sich selbst anwenden.