Seltsamer Titel, nicht wahr? Was haben die beiden mit Webdesign bzw. barrierefreiem Webdesign zu tun … sehr viel sogar. Ich hoffe, dass alle das Märchen kennen. Wenn nicht, dann sollten Sie die nächste Kinderbücherei aufsuchen und sich das Märchen zu Gemüte führen. Es lohnt sich!

Also, die beiden Kinder haben ja – um wieder nach Hause zu finden – Brotkrumen gestreut. Im Web gibt es eine ähnliche Art, wie man zusätzliche Orientierungshilfen zur Verfügung stellen kann. Aber: Unsere sind etwas langlebiger und schimmeln nicht :-).

Es ist immer praktisch, wenn man als Besucher jederzeit weiß, wo man sich befindet. Das ist ein Leitsystem, dass zum Einem dem User den aktuellen Standort zeigt und zum Anderen kann er aufgrund des Leitsystems einen Weg, den er gegangen ist, zurückverfolgen. Er weiß daher immer, was sich vor und hinter ihm befindet. Dieses Leitsystem nennen wir „Brotkrumennavigation“ oder auch liebevoll „Hänsel-und-Gretel-Navigation“. Es ist ein sehr einfaches Hilfsmittel mit enormer Wirkung.

Wann ist so ein Leitsystem notwendig? Sobald eine Webseite mehr als zwei Ebenen hat, wird ein Leitsystem notwendig. So kann ein gutes Leitsystem aussehen:

Standort: Startseite > Über mich
Oder
Sie befinden sich auf der Seite Startseite
Im Untermenü Über mich > Ausbildung

Es steht daher jedem Eigentümer frei, sich unterschiedliche Möglichkeiten auszusuchen. Experimentieren Sie damit und lassen Sie Freunde und Bekannte das Leitsystem testen.

Fazit

Zusammenfassend kann man sagen, eine Navigation sollte stets klar strukturiert sein. Bedenken Sie bei der Entwicklung Ihrer eigenen Webseite, dass Ihre Seite nicht die Einzige ist, die sich User ansehen. Überfordern Sie Ihren Besucher nicht, sondern bieten Sie ihm einen Platz mit leichter Orientierung und einem guten Leitsystem. Dann steht dem Erfolg Ihrer Webseite nichts mehr im Wege.

Ich wünsche Ihnen viel Vergnügen beim Herumexperimentieren.

In Geschichte in der Hauptschule erklärte uns der Lehrer, dass die frühen Schifffahrer mittels Kompass ihre Route navigierten und sie hielten sich an die Sterne. Ich fand das sehr spannend – sich an Sterne zu halten? Für mich als 12jährige ein undenkbares Navigationsmittel, aber es schien zu funktionieren, denn viele von den Seemännern kehrten mehr oder minder heil wieder nach Hause zurück, wenn sie nicht an den Folgeerscheinungen von Skorbut starben. Ja, so war das damals.

Heute navigieren unsere “Kapitäne” nach ausgeklügelten computergesteuerten Navigationssystemen, das ihnen in jeder Straße zeigt, wo der nächste zu erreichende Punkt ist. Einige dieser Geräte sprechen sogar. Der Mensch benötigt also Hilfsmittel zur Navigation, egal ob mit Karten, computergesteuerten Navigationssystemen oder den Sternen. Viele Tiere brauchen das nicht. Fledermäuse orientieren sich nach dem Schall.

Also ist das Mittel der Navigation auch ein Mittel zur Orientierung. Wir brauchen es, ohne Navigation würden wir uns in fremden Städten verlaufen, würden geografische Grenzen nicht erkennen und könnten uns einfach nicht orientieren. Die Navigation des alltäglichen Lebens kann sehr vielfältig sein. Eine Straßenkarte, Straßenschilder, Leitsysteme, Ampeln, Wegweiser etc.

Im Web gibt es ähnlich viele Möglichkeiten, Navigation und Orientierungshilfen anzubieten. Egal, wie gut eine Seite aufgebaut ist oder grafisch sämtliche Rekorde brechen würde – sie wäre Mist, wenn man sich nicht gut orientieren kann. Davon hängt letztendlich auch der Erfolg einer Seite ab.

Navigationsleisten sind optisch der kleinste Teil einer Webseite – sie sollten es zumindest sein, aber auch der wichtigste. Hierbei rate ich allen Gründerinnen und Gründern sich ausgiebigst Zeit dafür zu nehmen. Sie müssen ihre Kunden kennen, sie müssen ihre Bedürfnisse kennen und sie müssen auch ihre Webumwelt kennen. Warum betone ich das? Da leider viel zu wenig Webseitenneulingen bewusst ist, wie ihre Kunden sich im Web bewegen und daher völlig außer acht lassen, deren Bedürfnisse über den eigenen Geschmack zu stellen. Das sind Grundfehler, die man nicht machen sollte.

Gut, wieder zurück zur Navigation. Es gibt unterschiedliche Möglichkeiten, Navigation anzubieten – ob links oben oder rechts – unten sollte niemals eine Navigation stehen, die für den Kunden relevant ist, außer sie ist nur sekundär bedeutend wie z.B. Navigation im Fußbereich (Footer): Impressum, AGB oder Datenschutzerklärung etc. Daher überlegen Sie sich gut, wie bedeutend welche Navigation für Ihren User sein kann.

Die Navigation sollte stets ohne zu scrollen sichtbar sein. Das heißt, dass alle wichtigen Menüpunkte gleich beim Öffnen der Seite ersichtlich sein sollten. Wenn die Anzahl der Menüpunkte den Höhen- oder Breitenbereich Ihrer Webseite überragt, strukturieren Sie die Menüpunkte neu. Überlegen Sie sich dabei, welche Bereiche sich so sehr ähneln, dass man sie zu einem Menüpunkt zusammenfassen kann. Auch in der Navigation gilt: Weniger ist mehr!

Eines sei noch erwähnt: Das Impressum muss laut Gesetz unmittelbar und direkt erreichbar sein. Das bedeutet, dass dieser Punkt nicht in einem Untermenü verschwinden darf. Bei vielen Webseiten ist das zwar so, aber nicht alles, was andere tun, ist auch beispielhaft. Hierbei kann man das Impressum in den Footer stellen, der ohnehin bei den meisten Webseiten vorhanden ist. In einem anderen Artikel werde ich genauer auf das Impressum eingehen.

Auch der Menüpunkt "Kontakt" sollte immer in sichtbare Nähe gebracht werden. Das ist praktisch, denn der User sucht nicht gerne und wenn er erst suchen muss, damit er Sie kontaktieren kann, dann wird er es nicht tun. Der Mensch geht stets den Weg des geringsten Widerstandes. Das ist Fakt. Daher, lassen Sie Ihre Kunden Sie nicht suchen. Auch auf den Aufbau eines Kontaktformulars gehe ich in einem späteren Artikel noch ein.

Wie letztendlich die einzelnen Menüpunkte gereiht oder bezeichnet werden sollen, ist abhängig vom Projekt selbst. Dabei sollten Sie aber darauf achten, englische und deutsche Begriffe nicht zu vermischen. Das wird sehr gerne gemacht, dass z.B. “Home” und dann “Über mich” steht. Das ist schlecht und erzeugt kein guten Eindruck. Entscheiden Sie sich für eine Sprache im Menü. Man spricht hier auch oft vom berühmten “roten Faden”.

Beispiel für ein englischsprachiges Menü:

Home | About | Company | Contact | Impress
etc.

Oder ein deutschsprachiges Menü:

Startseite | Über uns | Das Unternehmen | Kontakt | Impressum
etc.

Bei dem Begriff “Team” haben Sie Glück, denn dafür einen deutschen Begriff zu finden, der sowohl sprachlich gut klingt und auch zum Unternehmen passt, ist sehr schwer. Der Begriff ist schon so “eingedeutscht”, dass man ihn problemlos verwenden kann.

Eine Menüleiste sollte sich immer optisch vom Inhalt abheben. Daher wählen Sie als Schriftgröße niemals eine Größe, die kleiner als der Fließtext ist – und wenn doch, sorgen Sie dafür, dass der Bereich klar abgegrenzt wird. Der Besucher muss stets wissen, dass die Navigation die Navigation ist und der Inhalt Inhalt ist.

Meine Empfehlung ist, die Schriftgröße ab 1em (relative Größenangabe bei Schriften) zu wählen – natürlich ist es immer abhängig vom aktuellen Projekt. Sollten Sie vielleicht sogar Piktogramme (Symbole) oder ähnliche grafische Elemente verwenden, denken Sie daran, der IE6 und Safari können nur die Schrift selbst vergrößern, Grafiken nicht. Alle anderen neueren Browser sind durchaus in der Lage die Grafiken proportionell mit zu vergrößern.

Mit einer guten Navigation leiten Sie Ihre Besucher durch die Inhalte Ihrer Seite, daher sind Sie daran interessiert, dass zum Einen die Besucher lange bleiben, zum Anderen auch wiederkehren – Ihre gute Webseite sogar weiterempfehlen, Sie kontaktieren etc. Nehmen Sie sich also nicht die Chance eine breite Öffentlichkeit zu erreichen, in dem Sie eine unübersichtliche, unstrukturierte und planlose Navigation anbieten.

Ein weiterer Punkt zum Thema Navigation betrifft das optimale Beschriften (title) der einzelnen Menüpunkte. Warum ist das notwendig, wenn der Menüpunkt schon eine Bezeichnung hat?

Stellen Sie sich folgende Situation vor: Sie "betreten" eine Webseite, auf der Sie noch nie waren. Sie haben einen guten Eindruck. Nun möchten Sie mehr wissen und suchen die Navigation. Sie hat folgende Menüpunkte:

Start | Team | Leistung | Angebote | Kontakt | Impressum

Schaut schon mal recht nett aus und wirkt auch logisch.

Nun hat der Eigentümer der Seite folgende Beschriftungen hinterlegt
Start = Nehmen Sie im Wartezimmer Platz
Team = Das Herz des Unternehmens
Leistung = Unsere Produkte und Dienstleistungen auf einem Blick
Angebote = Saisonale Angebote und Specials für jeden Anlass
Kontakt = Per Mail, Telefon oder Formular
Impressum = Rechtliche Informationen und Quellennachweise

Diese Zusatzinformationen kann der User erhalten, wenn er mit der Maus über dem betreffenden Menüpunkt steht.

Ich finde derartige Infos sehr einladend und hilfreich. Sie wissen somit genau, was sich in den besagten Unterseiten befindet. Sie wissen schon, bevor Sie die Seite öffnen, dass sich auf der Kontaktseite ein Formular befindet und können – ohne gleich all Ihre Daten zur Verfügung zu stellen – Kontakt aufnehmen.

Nur bitte keine Romane! Die Beschriftung sollte maximal 40 Zeichen enthalten, damit der gesamte Inhalt des „titles“ dargestellt werden kann und auch optisch schön ist.

Je mehr Sie Ihren Kunden Information und Orientierungshilfen anbieten, um so verständlicher und einfacher wird es für sie.