Das Problem
Öffnen Sie eine beliebige große E-Commerce-App — Amazon, Zalando, Otto oder ASOS — was sehen Sie als Erstes? Eine fixierte Navigationsleiste am unteren Bildschirmrand. Startseite, Kategorien, Suche, Warenkorb, Konto — alles in Reichweite des Daumens, ständig sichtbar egal wo man sich in der App befindet.
Ihr Shop sieht anders aus. Zur Startseite zurück: Scrollen bis ganz oben und auf das Logo tippen. Zum Warenkorb: das Icon im Header suchen. Zu einer anderen Kategorie: das Hamburger-Menü öffnen. Jede Aktion ein extra Schritt — und auf dem Handy ist jeder extra Schritt eine weitere Gelegenheit, dass der Kunde aufgibt.
Das ist kein ästhetisches Problem. Es ist ein Nutzungsverhaltensproblem. Mobile Kunden sind Bottom Navigation aus Dutzenden von Apps gewohnt, die sie täglich nutzen — fehlt sie im Shop, fühlt sich das Erlebnis lückenhaft und unprofessionell an.
„Kunden schreiben mir: ‚Ich finde nicht zurück zur Startseite.' Da habe ich gemerkt: mein Shop sieht auf dem Handy aus wie eine Website von 2015, während jede App eine praktische Leiste unten hat."
— Ein Navi+ Kunde
Warum ist Bottom Navigation so wichtig?
Mit wachsenden Displaygrößen (6–6,7 Zoll sind heute Standard) wird der obere Bildschirmbereich zunehmend schwerer mit dem Daumen zu erreichen. UX-Studien zeigen, dass der obere Bereich für mobile Nutzer eine „tote Zone" darstellt — schwer zu erreichen, häufig versehentlich getippt.
Bottom Navigation löst dieses Problem: die wichtigsten Aktionen werden genau dort platziert, wo der Daumen auf natürlichste Weise hintippt. Deshalb folgen alle Super-Apps diesem Muster — nicht aus Trend, sondern weil es funktioniert.
- Weniger Navigationsschritte — von 3–4 Schritten auf 1 Tap
- Kunden wissen, wo sie sind — der aktive Tab ist klar hervorgehoben
- Mehr Seiten pro Session — einfachere Navigation, mehr Stöbern
- Professioneller Eindruck — der Shop sieht und verhält sich wie eine richtige App
Navi+ Tab Bar und FAB Button
Navi+ bietet eine Tab Bar — fixierte Navigationsleiste am unteren Bildschirmrand — und einen FAB Button (Floating Action Button) für schnellen Zugriff auf Prioritätsaktionen. Beide sind vollständig über das Dashboard anpassbar, ohne Code-Eingriff.
Die Tab Bar unterstützt bis zu 5 Einträge mit wählbaren Icons. Der FAB Button kann den Warenkorb öffnen, das Menü aufrufen oder direkt auf eine beliebige Seite verlinken — mit einem einzigen Tap. Kombiniert bieten beide ein Navigationserlebnis auf Augenhöhe mit nativen Apps.
| Mobile Navigationsfunktion | Standard-Shop | Navi+ Tab Bar + FAB |
|---|---|---|
| Fixierter Bottom Navigation Bar | ✗ | ✓ Immer sichtbar, auf jeder Seite |
| Floating Action Button | ✗ | ✓ Aktion frei konfigurierbar |
| Icons für jeden Tab frei wählbar | ✗ | ✓ Icon-Bibliothek vorhanden |
| Aktiver Tab deutlich hervorgehoben | ✗ | ✓ Klar, Farbe anpassbar |
| Warenkorb-Badge mit Anzahl | Nur im Header | ✓ Direkt auf dem Tab |
| Anpassen ohne Code | Entwickler nötig | ✓ Drag & Drop im Dashboard |
Einrichtung
Navi+ Dashboard → Tab Bar → Anzahl der Tabs wählen (3–5) → Icon und Zielseite für jeden Tab festlegen. FAB Button aktivieren, falls gewünscht. Speichern — die Tab Bar erscheint sofort im Shop, ohne Reload oder Deploy.
Empfohlene Tab-Reihenfolge: Startseite → Kategorien → Suche → Warenkorb → Konto. Passen Sie das nach dem tatsächlichen Nutzungsverhalten Ihrer Kunden an.
Bottom Navigation für Ihren Shop einrichten
Kostenlos installieren — keine Kreditkarte, in wenigen Minuten aktiv, kein Code nötig.
Bottom Navigation für Ihren Shop einrichten