Hallo! Hotjar gibt es jetzt auch auf DeutschÂ đŸ‡©đŸ‡Ș Jetzt gratis starten.

Lerne / LeitfÀden / Heatmaps-Leitfaden

ZurĂŒck zu LeitfĂ€den

Klick-Heatmaps: wie du damit deine Website optimierst

Menschen können eine Website nicht nutzen, ohne irgendwo mit der Maus zu klicken oder auf einem MobilgerĂ€t zu tippen. So können sie auf Seiten navigieren und gewĂŒnschte Produkte, Services oder Informationen finden.

Aber weißt du als Website-Designer:in, Marketing-Expert:in oder Unternehmer:in genau, wohin deine Besuchenden klicken und tippen? Und weißt du, wie du diese Informationen nutzen kannst, um eine bessere Website und User Experience zu schaffen?

Genau hier kommen Klick-Heatmaps ins Spiel.

Zuletzt aktualisiert

18 Jan 2024

Lesezeit

6 Min.

Teilen

Finde heraus, wohin Besuchende auf deiner Website klicken.

Finde heraus, wohin Besuchende auf deiner Website klicken

Fang noch heute an, Klick-Heatmaps auf deiner Website zu verwenden.

Was sind Click-Maps bzw. Klick-Heatmaps?

Eine Klick-Heatmap (oder Click-Map) ist eine Website-Heatmap, die anzeigt, wo Nutzende mit dem Mauszeiger klicken oder auf einem MobilgerĂ€t auf den Bildschirm tippen. Klick-Heatmaps helfen Website-Betreiber:innen, die Interaktionen von Nutzenden auf einer Website zu verfolgen, z. B. Klicks auf Buttons, Links, Bilder usw. Das wiederum hilft ihnen, ihre Seiten und CTAs fĂŒr bessere Conversions zu optimieren.

#Beispiel fĂŒr eine Klick-Heatmap auf der Hotjar-Homepage
Beispiel fĂŒr eine Klick-Heatmap auf der Hotjar-Homepage

Klick-Heatmaps werden von UX-Designer:innen und Marketing-Fachleuten verwendet, um NutzeraktivitĂ€ten zu tracken, Möglichkeiten zur Steigerung der Conversions zu erkennen, Bugs zu beheben und das Design der Website zu verbessern. Die Klick-PopularitĂ€t wird anhand einer Farbskala von rot bis blau angezeigt (wobei die beliebtesten Punkte „heiß“ sind und in rot dargestellt werden), zusammen mit quantitativen Daten ĂŒber die Anzahl der Klicks und den prozentualen Anteil der Klicks auf jedes Element.

Klick-Heatmap vs. Heatmaps

#Diese Klick-Heatmap von Hotjar zeigt die Verwirrung der Nutzenden auf der mobilen Version unserer alten Homepage
Diese Klick-Heatmap von Hotjar zeigt die Verwirrung der Nutzenden auf der mobilen Version unserer alten Homepage

Heatmaps ist ein Oberbegriff, der verschiedene Arten von visuellen Website-Analysen beschreibt. Klick-Heatmaps sind eine spezielle Art von Heatmap (Ă€hnlich wie Scroll-Maps/Scroll-Heatmaps und Move-Maps/Bewegungs-Heatmaps), bei denen die roten oder „heißen“ Punkte die am hĂ€ufigsten angeklickten Seitenelemente anzeigen, wĂ€hrend die blauen oder „kalten“ Punkte die am wenigsten angeklickten anzeigen. Bereiche, die nicht farbig sind, wurden ĂŒberhaupt nicht angeklickt.

💡Did you know? You can visualize click, move, and scroll data in a single view using Hotjar Heatmaps.

The Engagement Zones heatmap grid view lets you know which areas of the page your users most interact with, at one glance.

Warum Klick-Heatmaps fĂŒr Websites verwenden?

Mit Klick-Heatmaps kannst du:

  • Sehen, wo Besuchende auf deiner Website klicken und tippen

  • CTAs identifizieren, die schlecht abschneiden oder ignoriert werden

  • Bugs und Problemstellen finden, die verbessert werden können

  • Engagement-Daten visuell darstellen

Klick-Heatmaps sind ein wichtiges Tool zum Tracking von Klicks. Damit kannst du Elemente erkennen, mit denen Nutzende auf deinen Seiten interagieren (oder nicht), und Muster im Nutzerverhalten analysieren. 

Du siehst, auf welche CTAs (Calls-to-Action) oder unerwartete Elemente Nutzende klicken. So hast du einen soliden Ausgangspunkt, um die User Experience deiner Produkte zu verbessern und Conversions zu optimieren (Conversion Rate Optimization). Schau dir dieses kurze Beispiel an:

#Hotjar-Klick-Heatmap-Beispiele fĂŒr verschiedene GerĂ€te
Hotjar-Klick-Heatmap-Beispiele fĂŒr verschiedene GerĂ€te

Diese Klick-Heatmap wurde auf einer alten Version unserer Homepage platziert, die ein Video above the fold enthielt. Sowohl die Klick-Heatmap fĂŒr MobilgerĂ€te als auch die fĂŒr den Desktop zeigt, dass sich niemand das Video wirklich angesehen hat: Die GesamtaktivitĂ€t liegt bei 0,04 %. Das bedeutet, dass von 7.000 Besuchenden nur etwa drei (!) auf den Play-Button geklickt haben. HĂ€tte das Video besonders wichtige Informationen ĂŒber das Produkt enthalten, die nirgendwo anders auf der Seite zu finden waren, hĂ€tten wir ein Problem gehabt – und diese Klick-Heatmap allein hĂ€tte uns auf ein Problem aufmerksam gemacht, das behoben werden musste.

DarĂŒber hinaus können Klick-Heatmaps als visuelles Hilfsmittel eingesetzt werden, um Stakeholder:innen und Kund:innen Probleme und Optimierungen von Websites und Produkten zu veranschaulichen. Das ist besonders hilfreich, wenn du dich an ein technisch weniger versiertes Publikum wendest.

#Ein Hotjar-Nutzer teilt eine Heatmap mit einem Teammitglied, um einen Business Case zu erstellen und die Akzeptanz zu erhöhen
Ein Hotjar-Nutzer teilt eine Heatmap mit einem Teammitglied, um einen Business Case zu erstellen und die Akzeptanz zu erhöhen

Wie du Klick-Heatmaps auf deiner Website verwendest

Du kannst Klick-Heatmaps fĂŒr jede Art von Website verwenden – fĂŒr E-Commerce-Websites und Online-Shops, Product-Pages, Blogs, Landing-Pages und vieles mehr.

So funktioniert’s: Richte Klick-Heatmaps mit dem Heatmap-Analytics-Tool von Hotjar ein und beginne direkt, Daten ĂŒber User Clicks auf deiner Website zu sammeln. Jede Hotjar-Heatmap erstellt automatisch alle drei Arten von Heatmaps (Klicken, Bewegen und Scrollen), du musst also nichts Besonderes tun, um eine Klick-Heatmap einzurichten.

Logge dich in das Hotjar-Dashboard ein (melde dich zuerst fĂŒr ein kostenloses Konto an, wenn du neu bist) und navigiere zum Abschnitt „Heatmaps“, um zu beginnen.

Hier sind sechs einfache Schritte, um eine Klick-Heatmap zu erstellen:

Schritt 1: Installiere den Tracking-Code von Hotjar auf deiner Website

Du hast verschiedene Optionen, um den Tracking-Code von Hotjar zu installieren, unter anderem ĂŒber den Google Tag Manager und das WordPress-Plugin.

Schritt 2: Session-Erfassung aktivieren

Kontinuierliche Heatmaps werden aus Sessions erstellt. Wenn die „Session-Erfassung“ aktiviert ist, sind Heatmaps automatisch verfĂŒgbar und sammeln Daten zum Nutzerverhalten. Du musst also zuerst ĂŒberprĂŒfen, ob sie aktiviert ist.

Das machst du, indem du Heatmaps in deinem Hotjar-Konto aufrufst und das Widget fĂŒr die Traffic-Abdeckung in der oberen rechten Ecke der Seite kontrollierst.

Wenn du mit dem Mauszeiger ĂŒber dieses Widget fĂ€hrst, siehst du weitere Informationen ĂŒber die Einstellungen deiner tĂ€glichen Session-Erfassungen, die sowohl fĂŒr Hotjar Recordings als auch fĂŒr kontinuierliche Heatmaps gelten.

Wenn die Session-Erfassung nicht aktiviert ist, siehst du oben auf der Seite einen orangefarbenen Button „Session-Erfassung deaktiviert“, der dich zur entsprechenden Konfigurationsseite fĂŒhrt.

Schritt 3: Starte mit kontinuierlichen Heatmaps

Klicke im linken NavigationsmenĂŒ auf „Heatmaps“:

Schritt 4: Gib die URL deiner Heatmap ein oder wÀhle sie aus der Liste der beliebten Seiten

Über die Suchleiste oben auf der Seite der kontinuierlichen Heatmaps findest du eine Heatmap fĂŒr jede Seite, die du getrackt hast, indem du die URL hier eingibst.

Mehr dazu erfĂ€hrst du in unserem Artikel ĂŒber URL-Filterung fĂŒr kontinuierliche Heatmaps.

Du kannst auch eine Seite aus der Liste „Beliebte Seiten“ auswĂ€hlen. Sie zeigt die Seiten deiner Website, die in den letzten 30 Tagen die meisten Sitzungsdaten gesammelt haben.

Schritt 5: Klicke auf „Heatmap anzeigen“

Deine Heatmap sollte innerhalb von 90 Sekunden oder weniger erscheinen.

Um diese Seiten-URL schnell wieder in den kontinuierlichen Heatmaps aufzurufen, kannst du sie anheften, indem du auf das kleine Pin-Symbol rechts neben der URL klickst:

Schritt 6: WĂ€hle „Klick“-Heatmap aus

 So sehen die Ergebnisse der Klick-Heatmap im Hotjar-Dashboard aus:

#Beispiel fĂŒr eine Hotjar-Klick-Heatmap
Beispiel fĂŒr eine Hotjar-Klick-Heatmap

Du kannst dir fĂŒr jede Heatmap die Sessions auf Desktop, Tablet oder Handy anzeigen lassen. Um die Klick-Heatmap-Daten aufzurufen, wĂ€hlst du den Tab „Klick“ in den Heatmap-Optionen. Du kannst auch die Rohdaten herunterladen.

Hinweis: Um sicherzustellen, dass Hotjar genau abbildet, wo deine Besuchenden geklickt haben, erfassen wir die Klicks relativ zu den Elementen auf einer Seite. Wenn eine Person zum Beispiel auf einen Button klickt, erfassen wir die Position des Cursors relativ zu diesem Button und nicht zur gesamten Seite – mit anderen Worten: Hotjar Heatmaps bieten dir eine Gesamt-Visualisierung des Nutzerverhaltens.

Finde heraus, „warum Menschen klicken“, indem du Heatmaps mit anderen Product-Experience-Tools kombinierst

#Tool-Auswahl von Hotjar
Tool-Auswahl von Hotjar

Klick-Heatmaps zeigen dir zwar, was die Nutzenden anklicken und antippen, aber das ist nur ein Teil deiner Analyse. Du musst auch verstehen, warum die Nutzenden klicken (oder was vielleicht noch dringender ist: warum sie es nicht tun).

Dazu kannst du die quantitativen Erkenntnisse der Klick-Heatmap mit den qualitativen Erkenntnissen aus Nutzerfeedback-Umfragen und Session Recordings kombinieren. Mit Hotjar kannst du schnell Aufnahmen und On-Page-Umfragen zusammen mit Heatmaps auf deiner Website oder Produktseite einrichten. So erhĂ€ltst du alle Insights ĂŒber die Product Experience (PX, Produkterlebnis), die du brauchst, um Optimierungen vorzunehmen und die User Experience zu verbessern.

Mehr lesen: Hier lernst du, wie du Heatmaps und andere Tools (wie Google Analytics oder A/B-Tests) kombinieren kannst, um zusĂ€tzliche Erkenntnisse zu gewinnen. Außerdem erfĂ€hrst du, wie das SaaS-Unternehmen CCV Shop Klick-Heatmaps in Kombination mit Session Recordings eingesetzt hat, um die Conversion-Rates und Kundenzufriedenheit zu steigern.

Erstelle eine kostenlose Klick-Heatmap und steigere noch heute deine Conversions

Klick-Heatmaps sind eine schnelle und einfache Methode, um zu sehen, was die Leute wirklich auf einer Website tun. Sie sind ein wichtiges Tool fĂŒr Marketing- und CRO-Expert:innen und UX-Designer:innen, um Erkenntnisse ĂŒber die Product Experience zu gewinnen. Sie sind besonders nĂŒtzlich, wenn du ein Online-Business betreibst und das Verhalten deiner Kund:innen verstehen willst: was sie antreibt, was sie interessiert, womit sie interagieren oder was sie auf deiner Seite ĂŒbersehen.

📚 Further reading: check out how to combine heatmaps and other tools for extra insight, and learn how SaaS company CCV Shop used click maps in combination with session recordings to increase conversion rates and customer satisfaction.

Create a free click map and increase conversions today

Click maps are a quick and easy way to see what people are really doing on your site. They are a key product experience insights tool in the UX and optimization tech stack of marketers, UX designers, and conversion rate optimizers—and they are especially useful if you have an online business, looking to deeply understand the behavior of your customers: what drives them, what interests them, what they interact with, or what they fail to notice on your site.

FAQ zu Klick-Heatmaps