Kategoriebilder: Best Practices für mehr Klicks

Kategoriebilder entscheiden darüber, ob ein Nutzer klickt oder weiterscrollt. Ein schwaches Bild killt die Conversion, egal wie gut der Text ist. Welche Bilder funktionieren – und wie du sie technisch sauber zuordnest – zeigt dieser Artikel.

Warum Kategoriebilder über Klickrate entscheiden (nicht nur Text)

Menschen scannen Webseiten in 0,05 Sekunden. Das Auge erfasst Bilder schneller als Text. Wenn dein Kategoriebild generisch ist (weißer Hintergrund, Freisteller ohne Kontext), fehlt der visuelle Anker. Nutzer springen ab, weil sie nicht sofort verstehen, was die Kategorie bietet.

Ein Beispiel aus der Praxis: Ein Outdoor-Shop mit Kategorie „Wanderschuhe Herren“ hatte ein Stock-Foto (ein einzelner Schuh auf weißem Hintergrund). Klickrate aus der Startseite auf die Kategorie: 3,2 Prozent. Nach Austausch durch ein Lifestyle-Bild (Mann auf Berggipfel, Schuhe im Fokus): 7,8 Prozent. Keine Textänderung, nur das Bild.

Kategoriebilder sind der erste Touchpoint. Sie müssen emotional triggern UND gleichzeitig klar machen, was die Kategorie zeigt. Wenn du „Gartenmöbel Holz“ hast, zeig eine Terrasse mit Holztisch – nicht nur den Tisch freigestellt. Kontext verkauft.

Format und Größe: Was funktioniert auf Desktop und Mobil

Die meisten Shops nutzen quadratische oder leicht breite Kategoriebilder (z. B. 16:9 oder 4:3). Warum? Weil sie auf beiden Viewports funktionieren. Ein hochkantiges Bild (9:16) wird mobil zu groß, ein extremes Querformat (21:9) schneidet mobil wichtige Bildelemente ab.

Empfohlene Formate:

Quadratisch (1:1): Funktioniert immer, platzsparend auf Mobil, wirkt aber manchmal statisch.
Leicht quer (4:3 oder 16:9): Moderner Look, mehr Platz für Kontext (z. B. mehrere Produkte in einer Szene).
Hochkant (3:4): Nur wenn dein Shop-Template explizit darauf ausgelegt ist – sonst Chaos mobil.

Größe:
Minimum 800 x 800 Pixel (für Retina-Displays), besser 1200 x 1200 oder 1600 x 900 (je nach Format). Zu kleine Bilder wirken pixelig, zu große bremsen die Ladezeit. Ein 3000 x 3000 Pixel Bild für eine Kategorie-Kachel ist Overkill – außer du nutzt Lazy Loading und moderne Bildformate (WebP, AVIF).

Dateiformat:
WebP ist Standard. JPG funktioniert, ist aber größer. PNG nur für Grafiken mit Transparenz (z. B. Icons). AVIF ist noch effizienter als WebP, aber nicht alle Browser unterstützen es (Stand 2026: ca. 85 Prozent). Faustregel: WebP mit Fallback auf JPG.

Motiv-Auswahl: Produkt-Collage vs. Lifestyle-Bild vs. Icon

Die Motivwahl hängt davon ab, was du verkaufst – und wen du ansprichst.

Produkt-Collage (mehrere Artikel nebeneinander):
Funktioniert gut bei Kategorien mit HOHER Produktvielfalt (z. B. „Werkzeug“, „Elektronik“). Der Nutzer sieht auf einen Blick: „Hier gibts viel Auswahl.“ Schwäche: Wirkt manchmal überladen, wenig emotional.

Lifestyle-Bild (Produkt in Nutzungskontext):
Funktioniert bei emotionalen Kaufentscheidungen (z. B. „Outdoor-Ausrüstung“, „Gartenmöbel“, „Sportbekleidung“). Der Nutzer sieht nicht nur das Produkt, sondern das GEFÜHL dahinter. Stärke: Hohe Klickrate. Schwäche: Schwerer zu produzieren (Stock-Fotos wirken oft generisch).

Icon/Grafik:
Funktioniert bei abstrakten oder technischen Kategorien (z. B. „Software“, „Dienstleistungen“, „Ersatzteile“). Schwäche: Null Emotion, nur wenn Text stark ist.

Meine Empfehlung:
Misch es. Hauptkategorien mit Lifestyle-Bildern (emotional), Sub-Kategorien mit Produkt-Collagen (informativ). Und bitte: KEINE Stock-Fotos von lachenden Menschen mit Headset. Das killt jede Glaubwürdigkeit.

Kategoriebilder und -texte arbeiten zusammen – lies hier, warum Kategorietexte die Basis sind: Kategorietexte als SEO-Werkzeug.

Technische Umsetzung: Bilder zu Kategorien zuordnen in JTL-Wawi

JTL-Wawi hat ein eigenes Feld für Kategoriebilder – aber die Zuordnung ist umständlich. Du musst das Bild hochladen, in der Medienverwaltung suchen, dann manuell der Kategorie zuweisen. Bei 100 Kategorien ist das Stunden-Arbeit.

Das Bilder-zu-Kategorien-Modul der WawiCreatorSuite vereinfacht das radikal: 3-Spalten-Ansicht. Links suchst du den Artikel (oder die Kategorie), in der Mitte bearbeitest du das Bild (zuschneiden, Hintergrund entfernen, skalieren), rechts ordnest du es der Kategorie zu. Du ziehst das Bild per Drag-and-Drop in die Kategorie – fertig. Direkte Rückschreibung in die JTL-Datenbank, kein Export/Import.

Auch die Platzierung von Text und Bild auf der Kategorieseite beeinflusst die Wirkung – mehr dazu: Kategorieseite Text oben oder unten.

Wichtig: Das Bild muss zum Sortiment passen. Wenn deine Kategorie „Wanderschuhe Herren“ zeigt, aber das Kategoriebild Damenschuhe abbildet, verwirrt das. Google Image Search crawlt Kategoriebilder – wenn das Bild nicht zur Kategorie passt, schadet das auch der Bildersuche.

Automatisierung: 100 Kategoriebilder in einem Nachmittag

Die manuelle Variante: Du suchst Stock-Fotos, lädst sie runter, schneidest sie zu, lädst sie in JTL hoch, ordnest sie zu. Pro Kategorie 10 Minuten. Bei 100 Kategorien: 16 Stunden.

Die smarte Variante: Batch-Verarbeitung. Das Bilder-zu-Kategorien-Modul der WawiCreatorSuite erlaubt dir, mehrere Bilder GLEICHZEITIG zu bearbeiten – Hintergrund entfernen, zuschneiden, skalieren – und dann per Drag-and-Drop den Kategorien zuzuordnen. Du markierst 10 Bilder, bearbeitest sie in einem Rutsch, ordnest sie zu. Aus 16 Stunden werden 2 Stunden.

Der Workflow:

Bilder vorbereiten: Lade deine Bilder in ein Verzeichnis (oder nutze bestehende Produktbilder aus JTL).
Batch-Bearbeitung: Wähle alle Bilder aus, die denselben Schnitt/dieselbe Größe brauchen – einmal bearbeiten, auf alle anwenden.
Zuordnung: Zieh jedes Bild per Drag-and-Drop auf die Zielkategorie. Direktes Feedback: Bild wird in der JTL-Wawi sofort angezeigt.
Check: Öffne deine Kategorieseite im Shop-Frontend, prüf ob das Bild korrekt angezeigt wird.

Bei 100 Kategorien brauchst du einen Workflow, der schneller ist als Screenshot, Photoshop, Upload, Zuordnung. Mehr zur Gesamtstrategie im Onlineshop-SEO-Leitfaden.

Checkliste: Ist mein Kategoriebild klick-optimiert?

Bevor du ein Kategoriebild veröffentlichst, lauf diese Checks durch:

Erkennbarkeits-Test: Zeig das Bild jemandem für 2 Sekunden. Kann die Person sagen, was die Kategorie zeigt? Wenn nicht, ist das Bild zu abstrakt.
Mobil-Test: Öffne die Kategorie auf dem Smartphone. Ist das Bild zu groß, zu klein, schneidet es wichtige Elemente ab? Wenn ja, Bildausschnitt anpassen.
Ladezeit-Test: Lade die Kategorieseite und miss die Ladezeit (z. B. mit Lighthouse). Lädt das Bild länger als 1 Sekunde? Dann komprimieren oder auf WebP umstellen.
Kontext-Test: Passt das Bild zum Sortiment? Wenn du Herrenschuhe zeigst, aber das Bild Damenschuhe abbildet, verwirrt das.
Emotionale-Wirkung-Test: Löst das Bild ein Gefühl aus (Wunsch, Neugier, Vertrauen)? Wenn es nur „irgendein Produkt“ zeigt, fehlt der Hook.

Häufige Fragen zu Kategoriebildern

Kann ich Produktbilder als Kategoriebilder wiederverwenden?

Ja, wenn sie passen. Ein freigestelltes Produktbild funktioniert als Kategoriebild, wenn die Kategorie NUR dieses Produkt zeigt (z. B. „iPhone 15 Pro“). Aber für breite Kategorien (z. B. „Smartphones“) ist ein einzelnes Produktbild zu eng – da brauchst du eine Collage oder ein Lifestyle-Bild. Faustregel: Je breiter die Kategorie, desto abstrakter/szenen-orientierter das Bild.

Sollte ich Text ins Kategoriebild einbrennen (z. B. „Sale“ oder Kategorie-Namen)?

Nur bei befristeten Aktionen (z. B. „-20% nur heute“). Text-Overlays altern schlecht – wenn du den Kategorie-Namen ins Bild brennst und später die Kategorie umbenennst, stimmt das Bild nicht mehr. Besser: Text im HTML (als <h1> oder Overlay per CSS). Dann kannst du ihn jederzeit ändern, ohne das Bild neu zu erstellen. Ausnahme: Saisonale Kampagnen (z. B. „Sommer-Sale“) – da ist ein Text-Overlay ok, weil das Bild eh nach der Saison ausgetauscht wird.

Wie optimiere ich Kategoriebilder für die Google Bildersuche?

Gib dem Bild einen beschreibenden Dateinamen (z. B. wanderschuhe-herren-kategorie.webp statt IMG_1234.webp) und füll das Alt-Attribut aus (z. B. „Herrenwanderschuhe – robuste Trekkingschuhe für Alpentouren“). Google liest beides aus. Zusätzlich: Lade das Bild in angemessener Größe hoch (nicht 5000 x 5000 Pixel für eine 400 x 400 Pixel Kachel) – Google bevorzugt schnelle Seiten. Und nutz strukturierte Daten (ImageObject-Schema) im JSON-LD – das erhöht die Chance auf Rich Results.

Braucht jede Kategorie ein eigenes Bild oder reicht ein Platzhalter?

Jede Kategorie sollte ein eigenes Bild haben – WENN sie im Shop sichtbar ist. Interne Kategorien (z. B. für Filterzwecke, die nie direkt angezeigt werden) brauchen kein Bild. Aber jede Kategorie, die Nutzer sehen, MUSS ein Bild haben – sonst wirkt sie unfertig. Ein generischer Platzhalter (z. B. dein Shop-Logo) ist besser als kein Bild, aber schlechter als ein passendes Bild. Die Klickrate sinkt um ca. 40 Prozent, wenn Kategorien ohne Bild angezeigt werden.

Kann ich KI-generierte Bilder als Kategoriebilder nutzen?

Technisch ja, rechtlich: Grauzone. KI-generierte Bilder (z. B. Midjourney, DALL-E) haben oft unklare Nutzungsrechte – manche Plattformen erlauben kommerzielle Nutzung, andere nicht. Zusätzlich: KI-Bilder wirken oft „zu perfekt“ oder haben merkwürdige Details (z. B. sechs Finger, unrealistische Schatten). Wenn du sie nutzt, check die Lizenz UND prüf das Bild auf Fehler. Besser: Eigene Produktfotos in Szene gesetzt (Smartphone reicht, Tageslicht + stabiler Untergrund) oder lizenzfreie Stock-Fotos von Unsplash/Pexels.