Lerne / Leitfäden / Heatmaps-Leitfaden
Heatmap-Fallstudien
Heatmaps sind ein leistungsfähiges Tool, aber am besten überzeugst du dich selbst: Hier findest du eine Auswahl von Fallstudien und Erfolgsgeschichten mit Hotjar, die dich inspirieren werden.
Registriere dich für ein kostenloses Hotjar-Konto, füge den Tracking-Code zu deiner Website hinzu und beginne noch heute mit der Nutzung von Heatmaps.
Eine 5-Minuten-Korrektur steigert die Conversion Rate um 40 %
Der Kontext: Taskworld ist eine Projektmanagement-Lösung, die hauptsächlich ihre Anmeldeseite nutzt, um Leads in User und Kund:innen zu konvertieren. Das Team wollte wissen, wie die User mit der Seite interagieren, und Verbesserungsmöglichkeiten finden. Deshalb wurde eine Heatmap erstellt:
Was die Heatmap-Analyse ergab: Die Clickmap deutete auf drei Probleme hin. Kannst du sie erkennen?
Ungenutzte CTA: Obwohl sich die Seite speziell an neue User richtet, wurde die Haupt-CTA „Registrieren“ weniger oft angeklickt als der Link „Anmelden“ (wo sich der rote Klecks unten befindet)
Abbruch: Mit jedem der fünf obligatorischen Anmeldefelder wurden die Interaktionen immer weniger, jedes Feld bot den Usern also eine potenzielle Abbruchgelegenheit, bevor sie den Prozess abschließen konnten
Zeitzone als Blocker: Das obligatorische Feld "„Zeitzone wählen“ wurde umgangen
Das Ergebnis: In nur 5 Minuten entfernte Taskworld die Option „Anmelden“, ordnete die Seite neu an (um einen CTA herum) und reduzierte die Anzahl der Felder von fünf auf nur EINES: die E-Mail-Adresse.
Allein dadurch stieg die Conversion Rate um 40 % und die Abbrüche wurden um 4,5 % reduziert.
... ziemlich gut für einen Arbeitsaufwand von fünf Minuten!
→ Lies die vollständige Fallstudie
Eine Homepage wird so optimiert, dass sie für mehr Anmeldungen sorgt
Der Kontext: Das Team von Bannersnack, einem Online-Bannerhersteller und Design-Tool, verwendete Webanalyse-Tools (wie Google Analytics), um den Web-Traffic auf ihrer Website zu tracken und zu messen, hatte aber kein klares Bild davon, wie die Besuchenden tatsächlich mit der Website interagierten – sie wussten also nicht, wo sie ansetzen sollten, um die Conversion Rate zu verbessern.
Was die Heatmap-Analyse ergab: Eine Reihe von Heatmaps auf der Homepage zeigte, dass die Besuchenden mehr mit anderen Seitenelementen interagierten als mit dem Haupt-CTA:
CCV Shop generiert Leads über Landing Pages, daher wollte das UX-Team seine potenziellen Kund:innen besser verstehen und datengestützte Änderungen vornehmen, um die Conversion Rate zu erhöhen.
Was die Analyse ergab: CCV Shop nutzte Heatmaps, um sich einen Überblick über das Verhalten der Kund:innen auf den wichtigsten Landing Pages zu verschaffen – wohin sie insgesamt klickten, wie weit sie scrollen und wie die Interaktion mit den verschiedenen Seitenelementen aussah:
Sie kombinierten Heatmaps mit anderen Verhaltenstools, insbesondere session recordings, um das individuelle Verhalten auf den Landing Pages im Detail zu betrachten und den Kontext für das in den Heatmaps beobachtete Verhalten klarer zu erkennen ,. Auf diese Weise konnten sie außerdem kleine Fehler und Probleme erkennen, die behoben werden mussten.
Das Ergebnis: Durch die Kombination der Daten aus den Heatmaps und den anderen Webanalyse-Tools, konnte CCV Shop testbare Hypothesen formulieren, A/B-Tests durchführen und erfolgreiche Änderungen umsetzen. Dadurch wurde die Conversion Rate auf ihrer Marketing-Website um 38 % von 1,3 % auf 1,8 % gesteigert, wodurch CCV Shop seinem Konversionsziel von 2 % sehr nahe kam.
→ Lies die ganze Geschichte
Steigerung der Conversion Rate auf Mobile um 63 %
Der Kontext: Die in Großbritannien ansässige Digitalagentur Epiphany wurde mit der Verbesserung der Website ihres Kunden Time4sleep beauftragt, einem Online-Händler für Betten und Schlafzimmermöbel mit mehr als 200.000 Sessions pro Monat und einem großen Publikum auf Mobile.
Was die Analyse ergab: Das Team verwendete Heatmaps in Kombination mit anderen Tools wie Google Analytics, Aufzeichnungen und Umfragen (mehr dazu weiter unten), um ein vollständiges Bild davon zu erhalten, wie die Besuchenden mit der Website interagierten. Die aus diesen Quellen gesammelten Daten halfen ihnen, eine klare Diagnose zu formulieren: Die bestehenden Kategorieseiten halfen den Leuten nicht, das zu finden, was sie brauchten – eine neue Seitenstruktur war erforderlich.
Die Heatmap auf der linken Seite zeigt, wie die mobile Kategorieseite früher aussah. Siehst du die allmähliche Veränderung im Farbverlauf? Das bedeutet, dass die User dazu neigten, auf der Seite sehr weit nach unten zu scrollen, aber das war leider kein gutes Zeichen: Sie scrollten nicht deshalb so weit, weil ihnen der Inhalt gefiel, sondern weil sie das Gesuchte nicht finden konnten.
Die Heatmap bestätigte Epiphany, was auch die Daten aus anderen Quellen nahelegten, daraufhin organisierte das Team die Seite neu und ergänzte ein neues Filtersystem am oberen Rand. Das Ergebnis zeigt die Heatmap auf der rechten Seite: Im Vergleich zu vorher scrollen jetzt viel weniger Leute nach unten, weil sie das, was sie brauchen, sehr schnell oben auf der Seite finden.
Das Ergebnis: Mit dieser und anderen Änderungen, an denen SEO-, CRO-, Design-, Content- und PR-Teams beteiligt waren, testete Epiphany verschiedene Versionen der Seite und erzielte eine Gesamtsteigerung der Conversion Rate um 19,7 %. Doch der eigentliche Schwerpunkt lag auf der mobilen Nutzung: Hier bescherte Epiphany Time4Sleep einen beeindruckenden Anstieg der mobilen Conversion Rate um 63 %.
→ Lies die vollständige Geschichte auf dem Blog von Hotjar
