Wissenswertes / Leitfäden / Heatmaps-Leitfaden
So optimierst du mit Engagement-Zonen deine Website und sorgst für einen Boost bei deinen Conversions
Die verschiedenen Arten von Heatmaps – wie Klick-, Move- und Scroll-Heatmaps – sind für die Visualisierung komplexer Interaktionsdaten einfach unerlässlich. Aber mal ganz ehrlich: Wenn du dann mehrere Minuten oder sogar Stunden zwischen den verschiedenen Heatmaps hin- und herklickst, um die Nutzeraktivität auf deiner Website zu verstehen, dann hast du dir sicher schon oft gewünscht, effizienter arbeiten zu können, oder?
Wir sind zwar keine Märchenfeen, aber wir haben dir diesen Wunsch trotzdem erfüllt! Unsere Lösung ist kein magischer Knopf, sondern eine ganz neue Art von Heatmap – wir präsentieren: die Engagement-Zonen-Map. 👋
Die Engagement-Zonen-Map von Hotjar kombiniert alle verfügbaren Interaktionsdaten – Klicks, Bewegungen und Scrollen für Desktop, sowie Taps und Scrollen für Smartphone und Tablet. In Form eines farbcodierten Rasters zeigt die Map die Bereiche, die mittlere bis hohe Nutzeraktivität aufweisen.
Diese Heatmap eignet sich für alle, die einen einfachen, aber umfassenden Überblick über das Nutzerengagement brauchen. Analysiere deine Website in Sekundenschnelle, teile deine Erkenntnisse diskret mit deinen Teammitgliedern und Vorgesetzten und bekomme schnell Antworten auf grundlegende Fragen zu den Bereichen deiner Website mit der höchsten Aktivität.
Hier erfährst du, wie dieser brandneue Heatmap-Typ dir hilft, das Nutzerverhalten auf deiner Website zu verstehen, Bereiche mit einem entscheidenden Einfluss auf deine Conversions auszumachen und mithilfe von Daten zu bestimmen, wo genau deine Website Verbesserungen nötig hat.
Interaktionsdaten in Sekundenschnelle visualisieren
Hotjar präsentiert: Engagement-Zonen-Maps, eine schnellere und effizientere Methode, um beliebte und weniger beliebte Bereiche deiner Website zu identifizieren. Analysiere die Seiten und Inhalte deiner Website in Sekundenschnelle und nutze die Erkenntnisse, um dein Nutzererlebnis zu verbessern.
So verbesserst du mit Engagement-Zonen Layout, Inhalt und Nutzerfreundlichkeit deiner Website
Schauen wir uns nun genauer an, wie Engagement-Zonen-Maps funktionieren und welche Vorteile sie bieten. Hier kommen die drei wichtigsten Zwecke, für die du Engagement-Zonen-Maps einsetzen kannst.
1. Ermittle die attraktivsten Bereiche deiner Website
Wie der Name schon sagt, unterteilt eine Engagement-Zonen-Map eine Seite in „Zonen“ und bewertet diese nach folgendem Farbschema*:
Mäßig – Stufe 1 (hellrot): Interaktionen mit diesem Bereich sind eher sporadisch oder umfassen nur einfache Aufgaben
Hoch – Stufe 2 (rot): Die Interaktion mit diesem Bereich ist wiederkehrend, was darauf hindeutet, dass die Nutzenden hier nützliche Informationen finden.
Sehr hoch – Stufe 3 (dunkelrot): Die Interaktionen mit diesem Bereich sind beträchtlich, was zeigt, dass er für Nutzende von besonderem Interesse ist.
Dadurch, dass du Bereiche mit niedrigem und hohem Engagement auf einen Blick siehst, kannst du dir das Hin und Her zwischen den verschiedenen Heatmaps sparen.Du musst nicht erst die Click-Heatmaps anschauen, um die Dichte der Klicks auf jedes Element zu ermitteln, und dann zu den Scroll-Heatmaps wechseln, um zu schauen, wie viel Prozent der Nutzenden zum jeweiligen Teil der Website herunterscrollen. Stattdessen siehst du alle visualisierten Daten, die normalerweise in drei separaten Heatmaps angezeigt werden, in einer einzigen Ansicht.
Bist du z. B. Designer:in in einem E-Commerce-Unternehmen, kannst du das Layout der Website leichter optimieren, indem du Websitebereiche mit der höchsten Nutzeraktivität identifizierst. Sorge dafür, dass wichtige Elemente wie eine Call-to-Action-(CTA)-Schaltfläche, die Nutzende in der Mitte der Seite anklicken, möglichst früh auftauchen. Die Erkenntnisse aus den Engagement-Zonen-Maps können dir dann helfen, eine Neugestaltung der Website vorzunehmen.
* Engagement wird auf der Grundlage einer Kombination aus verfügbaren Interaktionsdaten berechnet.
2. Erkenne Verhaltensmuster auf deiner Website
Egal, ob du Dutzende oder Hunderte von Seiten analysieren musst – mit den Engagement-Zonen-Maps erkennst du die Verhaltensmuster deiner Nutzenden kinderleicht. Vor allem für die Optimierung der Nutzerfreundlichkeit ist dies ein immenser Gewinn.
Angenommen, du bist Produktmanager:in eines mittelständischen SaaS-Unternehmens und möchtest auswerten, wie nutzerfreundlich der Bereich für die Nutzereinstellungen ist. Dabei stellst du fest, dass die Nutzenden häufig mit den Elementen am oberen Rand der Seite interagieren, während einige weitere am unteren Rand der Seite herumdümpeln. Das könnte ein Hinweis darauf sein, dass du die unteren Menüpunkte neu anordnen oder überflüssige Elemente komplett entfernen musst.
In diesem Fall solltest du unbedingt auch unsere anderen Tools und Funktionen zur Verhaltensanalyse nutzen – wie zum Beispiel Recordings, Surveys und Feedback–, um die Gründe für das Verhalten deiner Nutzenden in der Tiefe zu verstehen. (Dazu später noch mehr.)
💡 Pro-Tipp: Sobald du mit deinen Ergebnissen zufrieden bist, teile Highlights der relevanten Engagement-Zonen-Maps sowie Session-Aufnahmen mit deinem Team. So habt ihr schon die perfekte Grundlage für euer Brainstorming bei der Planung eurer nächsten Design-Iteration!
Beispiele für Engagement-Zonen-Maps auf einer Website, vor und nach der Iteration
3. Überblicke alle wichtige Interaktionsdaten in einer einzigen Ansicht
Wie bereits erwähnt, zeigen andere Heatmaps, wo Nutzende klicken, sich bewegen oder scrollen. Eine Engagement-Zonen-Map ist in dieser Hinsicht etwas Besonderes, weil sie alle Interaktionsdaten in einer einzigen grafischen Darstellung zusammenfasst. So hast du das große Ganze im Blick und kannst gleichzeitig wichtige Details erkennen.
Stell dir folgendes Szenario vor: Ein Marketingspezialist möchte die Nutzerinteraktion mit den wichtigsten Seiten der Website analysieren, um die Website dementsprechend optimieren zu können: Die Heatmap zeigt ihm, welche Teile der einzelnen Inhalte (z. B. Blog, Leitfaden oder Landing Page) am meisten und am wenigsten Interaktion aufweisen.
„Das beste Beispiel hierfür ist eine Seite mit Text oder einem CTA – mit Engagement-Zonen-Maps kann ich sehen, wie viele Aktionen die CTA erhält“, so Karissa Van Baulen, Customer Education Lead bei Hotjar. „Anstatt alle drei Heatmaps aufzurufen, sehe ich direkt, wie viele Leute den CTA ohne nach unten zu scrollen sehen, ob sie darauf klicken und ob er zu Conversions führt“.
Van Baulen fügt hinzu: „Wenn die Metriken keinen großen Effekt zeigen, muss man auch schon mal wieder bei null anfangen und alles von Grund auf neu gestalten. Auf jeden Fall sollten die Erkenntnisse aus der Engagement-Zonen-Map als Grundlage für Änderungen an der CTA-Schaltfläche dienen“.
Engagement-Zonen-Maps: ein smarter Einstieg in die Welt der Heatmaps
Stell dir vor, du bist Projektmanagerin und sollst Layout und Funktionalität des digitalen Produkts deines Unternehmens bewerten. Oder auch ein Marketingspezialist, der Website-Inhalte optimiert. Ohne Engagement-Zonen müsstest du zwischen drei Datenansichten hin- und herwechseln:
Click-Heatmaps (Desktop) oder Tap-Heatmaps (Smartphone und Tablet): zeigen an, wo Nutzende auf deine Website klicken
Move-Heatmaps (Desktop): zeigen an, wo Nutzende ihre Maus auf dem Bildschirm bewegen
Scroll-Heatmaps: zeigen an, wie viele Nutzende zu den verschiedenen Bereichen einer Seite hinuntergescrollt haben
Mit Engagement-Zonen-Maps, die alle verfügbaren Interaktionsdaten kombinieren, hast du all diese Informationen auf einen Blick. Und das Beste daran: Du kannst diese Heatmap-Daten (zusammen mit Aufnahmen, auf die wir gleich noch näher eingehen) nutzen, um Hypothesen zu validieren, die auf Google Analytics-Metriken und anderen quantitativen Daten basieren.
So verwendest du Engagement-Zonen-Maps in Hotjar
Die Engagement-Zonen-Maps kannst du nur mit dem Plan Observe oder Business nutzen. Um loszulegen, gehe auf Heatmaps und öffne eine gespeicherte Heatmap. Wähle im Seitenmenü „Heatmap-Typen“ und aktiviere „Engagement-Zonen“.
Es erscheint eine Rasterkarte, die mittlere, hohe und sehr hohe Nutzeraktivität auf deiner Website anzeigt. In dieser Ansicht siehst du auf den ersten Blick, welche Bereiche die höchste und welche die niedrigste Aktivität aufweisen.
Vertiefe deine Einblicke mit Session-Aufnahmen
Bei Hotjar steht dir für jede deiner gespeicherten Heatmaps eine Reihe von relevanten Aufnahmen zur Verfügung. Schau dir diese Aufnahmen von Besuchen einzelner Nutzender auf den verschiedenen Seiten deiner Website an. Dies erlaubt es dir, nachzuvollziehen, wie die Customer-Journey abläuft, was jemand auf einer Seite getan hat und warum ein Element angeklickt wurde.
Um eine Session-Aufnahme anzusehen, klicke oben in deiner Heatmap auf „Aufnahmen anzeigen“.
Füge Filter hinzu, um die Anzahl der Aufnahmen sinnvoll einzugrenzen. Wähle z. B. „Angeklicktes Element“ und stelle die restlichen Parameter entsprechend ein, um nur Aufnahmen von Nutzenden anzuzeigen, die auf eine bestimmte Schaltfläche oder einen Textlink geklickt haben.
Beispiele für Session-Aufnahmen
Wähle zum Ansehen eine Aufnahme aus.
Sieh dir die Aufnahmen von Nutzenden an, die auf die Anmelde-Schaltfläche geklickt haben
Speichere und teile deine Erkenntnisse mit Highlights
Du kannst jeden beliebigen Teil deiner Engagement-Zones-Map (oder jeder anderen Heatmap, wie z. B. Click-, Move- und Scroll-Heatmap) hervorheben.
Aktiviere im Heatmaps-Seitenmenü die Option „Highlights“. Dadurch werden bereits erstellte Highlights angezeigt und du kannst neue erstellen. Wähle den Teil der Heatmap aus, der erfasst werden soll, und klicke dann auf „Speichern“.
Jetzt kannst du dein Highlight zu einer Sammlung hinzufügen und entsprechend labeln, um es später leichter wiederzufinden und teilen zu können.
Finde deine Highlights leichter wieder, indem du sie labelst und zu einer Sammlung hinzufügst
Stelle sicher, dass es sich tatsächlich um eine positive Interaktion handelt, und nicht um einen Wutklick
Angenommen, deine Engagement-Zonen-Map zeigt ein hohes Nutzerengagement für die Anmelde-Schaltfläche, aber die tatsächlichen Anmeldungen bleiben unglaublich niedrig: In einem solchen Fall solltest du überprüfen, ob die Nutzenden möglicherweise einfach nur wütend auf die Schaltfläche klicken.
Aktiviere dazu die Option „Wutklicks“, um die Wutklick-Map anzuzeigen. Dieser neue Heatmap-Typ zeigt wiederholte Klicks auf ein Element oder innerhalb desselben Bereichs an – ein Anzeichen für Frustration. Wutklicks können sich negativ auf die Conversion Rates und das Nutzererlebnis auswirken. Sie treten außerdem oft auf, wenn Nutzende für einfache Aufgaben mehrfach klicken müssen, z. B. bei der Auswahl eines Datums oder bei der Verwendung von Carousels.
Verschaffe dir einen Überblick, bevor du Entscheidungen zu Design und Inhalt triffst
Durch die Kombination verschiedener Interaktionsdaten bieten Engagement-Zonen-Maps eine einfache, aber leistungsstarke Möglichkeit, die Nutzeraktivität auf deiner Website zu verstehen. Mit nur einem Klick erkennst du sofort, welche Bereiche und Elemente der Website gut bei deinen Nutzenden ankommen – und wo Handlungsbedarf besteht.
Mit Hotjar Heatmaps erhältst du smarter und effizienter Erkenntnisse, die du direkt umsetzen kannst. Entdecke die bahnbrechenden Möglichkeiten von Heatmaps und identifiziere Muster im Nutzerverhalten, die sich für dich als äußerst wertvoll erweisen. Auf dieser Grundlage kannst du deine Website dann sinnvoll verbessern. Leg am besten gleich los!
Interaktionsdaten in Sekundenschnelle visualisieren
Hotjar präsentiert: Engagement-Zonen-Maps, eine schnellere und effizientere Methode, um beliebte und weniger beliebte Bereiche deiner Website zu identifizieren. Analysiere die Seiten und Inhalte deiner Website in Sekundenschnelle und nutze die Erkenntnisse, um dein Nutzererlebnis zu verbessern.