Ein Icon-Menü – ein Kachelraster aus Bildern oder Symbolen, das Kategorien visuell darstellt und zum intuitiven Scannen einlädt – ist der Standard in fast allen modernen Shopping-Apps. Es unterscheidet sich grundlegend von klassischen Text-Dropdowns: Es wurde für den Moment geschaffen, in dem Käufer nach dem Aussehen der Produkte stöbern wollen, statt gezielt nach einem Wort zu suchen.
- Ein visuelles Raster funktioniert am besten bei optisch unterscheidbaren Sortimenten (Mode, Kosmetik, Wohnen).
- Kacheln müssen echte Touch-Ziele sein: Mindestens 44×44px gemäß WCAG und Apple HIG.
- Das Raster ist eine Layout-Entscheidung für die Einstiegsebene, keine bloße Icon-Beschriftung.
Unterschied zwischen „Icon-Raster“ und „Text vs. Icon“
Hier werden oft zwei Konzepte verwechselt: Die Frage, ob ein Menüpunkt ein Icon oder Text tragen soll, betrifft die Beschriftung. Ein Icon-Menü ist dagegen ein eigenständiges Stöber-Layout für Hauptkategorien, bei dem Produktfotos oder Symbole mit kurzen Titeln kombiniert werden, um schnelles Erfassen zu ermöglichen.
Weiterführender ArtikelIcons vs. Text in Navigationsmenüs – Das sagen wissenschaftliche Usability-Studien →
Wann ein Bildraster die Textliste schlägt
Ein Textmenü verlangt Lesen. Ein Bildraster setzt auf Wiedererkennung – und das menschliche Gehirn verarbeitet Bilder bis zu 60.000-mal schneller als Text. In Branchen wie Fashion, Deko oder Sport erkennen Käufer „Kleider“, „Schuhe“ oder „Accessoires“ auf einen Blick anhand von Vorschaubildern.
Bei technischen B2B-Katalogen oder Ersatzteilen, die sich optisch kaum unterscheiden, ist eine gut gegliederte Textliste dagegen nach wie vor die bessere Wahl.
Touch-Ziele: Ergonomie vor reiner Bildästhetik
Vermeiden Sie zu winzige Kacheln auf Smartphones: WCAG 2.5.5 schreibt eine Mindestgröße von 44×44 CSS-Pixeln vor. Empfohlene Best Practices:
- 2 bis 3 Spalten auf Mobilgeräten
- Einheitliches Seitenverhältnis der Bilder
- Klare Textbeschriftung unter oder über jedem Bild
Visuelle Navigation für Shopify mit Navi+
Erstellen Sie visuelle Mega Menüs, mobile Tab Bars und Icon-Raster in unter 5 Minuten ohne Theme-Code.