Easy Homepage Navigation für Smartphones und PCs erstellen
Beim Erstellen deiner Homepage Navigation geht es darum für dein Unternehmen und deinen Kunden, die vorteilhafteste Lösung zu finden. Die Auswahl kann einen großen Unterschied machen.
Hast du noch kein Homepage Design ist deine Navigation gestaltbar. Andererseits wirst du sie gegebenenfalls den neuen Erkenntnissen anpassen. Um zu starten, schau dir zunächst deine (geplanten) Inhalte an. Achte insbesondere auf die Anzahl der Seiten oder Kategorien, deren Seitenzahl steigen wird.
Navigation mit wenigen Seiten
Bei unter 8 Seiten wird eine Navigation mit einer Ebene reichen. Sie muss sowohl für PCs und Smartphones funktionieren.
Klassische Homepage Navigation auf einer Ebene
Eine klassische Navigation ist heute noch gelegentlich auf langen Seiten zu finden.
Die Navigation wird nicht gestylt. Es handelt sich um eine Ansammlung von unterstrichenen Links. Sie werden am Anfang der Homepage/Seiten untereinander eingefügt.
Dieses Menü ist vom Prinzip her praktikabel. Sie macht Sinn für überwiegend textbasierte Homepage Architekturen (mit etwas mehr Styling) oder Seiten mit viel Inhalt.
Sie sieht auf Smartphones und PCs gleich aus.
Moderne Homepage Navigation auf einer Ebene
Diese moderne Navigation verwenden heute viele Unternehmen, die eine kleine Homepage mit wenigen Seiten einsetzen.
Sie wird für PCs und Smartphones (responsive Navigation) unterschiedlich gestylt (Abb.2).
Das Menü ist horizontal ausgerichtet, spart Platz und lenkt den Blick der Kunden auf die Inhalte.
Um eine solche Navigation für deine Homepage zu erstellen, bedarf es bestimmter Kenntnisse. Bei einer entsprechenden Anleitung ist das sogar für Anfänger möglich.
Mehr dazu später.
Navigation mit über 7 Seiten
Bei über fünf bis sieben Seiten wird es eng.
So springen im Browserfenster des PCs die Links auf die nächste Zeile. Beim Smartphone ist die vertikale Navigation nach einer gewissen Anzahl von Menü-Einträgen zu lang (Abb. 3).
Eine Lösung muss für beide Varianten der Navigation, gefunden werden.
Klassiker Navigation mit mehreren Ebenen
Wenn es eine Standard-Navigation für Unternehmen gibt, dann ist es die Dropdown Navigation. Der Inhalt wird nicht nur auf einer Ebene sondern gleich auf mehreren Ebenen verteilt.
Das Menü gliedert sich in Themen oder Hauptkategorien auf. Themen sind einzelne Seiten. Jede Hauptkategorie beinhaltet mindestens zwei oder mehr Seiten (Abb. 4). Beispielsweise unter einer Kategorie „Produkte“ wird pro Produkt eine Seite verlinkt (hier: Seitenlink1 und Sublinks 1a-1c).
Bei wenigen Links mag diese Navigation auf dem PC noch akzeptabel sein. Doch für das Smartphone kommen nun noch mehr vertikale Links durch jeweils ausgeklappte Sublinks hinzu. So würde die Navigation über die Seite hinausgehen (siehe Abb. 3).
Diese Navigation muss im Vergleich zur Navigation von Abb. 2 auch wesentlich komplexer konstruiert werden.
Daher stelle ich jetzt noch eine modernere Option vor, die viele Vorteile mit sich bringt.
Moderne Navigation mit mehreren Ebenen
Zusätzlich zur regulären, horizontalen Navigation mit maximal 7 Links wird eine weitere Navigation auf der Homepage verwendet.
Eine Navigation, die eigentlich eine Galerie ist, dient als die zweite Ebene. Sie hat attraktive, klickbare Grafiken/Fotos und/oder Beschreibungen mit Links, die zu weiteren Seiten führen (Abb. 5).
Die reguläre, horizontale Navigation der Homepage bleibt sowohl auf dem PC und Smartphone übersichtlich und leicht bedienbar (Abb. 2). Die Galerie enthält Links zu Seiten der Kategorien (Abb. 5). Sie passt sich dem Smartphone wie anderer Inhalt an.
Um diese Navigation umzusetzen, wird die Konstruktion der modernen Navigation verwendet (Abb. 2). Der Hauptinhalt einer Kategorie-Seite enthält die Galerie mit Links zu weiteren Seiten.
Navigationen schnell und flexibel erstellen
Um zu erfahren, wie du die Navigation erstellst, lies weiter.
Damit die Umsetzung schnell durchführbar wird, selbst für Anfänger, habe ich ein Video für ein modernes Flexbox Homepage Design inklusive moderner Navigation entwickelt.
Damit wirst du in der Lage sein, eine frei gestaltbare Homepage mit einer der beiden modernen Navigationen zu erstellen.
FAZIT: Eine easy Navigation gibt es für jede Homepage
Eine Homepage Navigation sollte vorteilhaft für dich und deine Kunden sein. Um eine passende Navigation zu erstellen, schau dir die Anzahl deiner Seiten an. Bei vielen Seiten stellt sich oftmals die moderne Homepage Navigation mit Galerie als gute Lösung heraus. Die Galerie sieht attraktiv auf dem Smartphone sowie PC aus.
Weiterführende Links
HTML Links auf deiner Homepage verstehen
Autor/in: Iris Mitlacher