Hover-Tracking: Nutzerinteresse sichtbar machen ohne Klick
Hover-Tracking ist eine Tracking-Methode, die es ermöglicht, das Verhalten der Maus auf einer Webseite zu analysieren – und das, ohne dass die Nutzer aktiv klicken müssen. Im Fokus steht die Erfassung von Mausbewegungen und das Verweilen (Hover) des Mauszeigers über bestimmten Elementen. Diese Methode liefert wichtige Informationen über die Interaktion der Nutzer mit der Website und zeigt auf, welche Inhalte besonders die Aufmerksamkeit der Besucher erregen.
Wie funktioniert Hover-Tracking technisch?
Technisch gesehen wird beim Hover-Tracking die Bewegung des Mauszeigers kontinuierlich überwacht. Dazu wird in der Regel JavaScript im Browser des Nutzers ausgeführt. Folgende Schritte sind typisch:
- Event-Listener einrichten
Für jedes Element, das überwacht werden soll (z. B. Buttons, Bilder, Menüs), wird einmouseover– odermouseenter-Event-Listener hinzugefügt. Dieser Event-Listener erkennt, wann die Maus das Element betritt. - Hover-Zeit messen
Sobald die Maus über das Element fährt, startet ein Timer. Der Timer misst, wie lange der Zeiger über dem Element verweilt. Dies gibt Aufschluss darüber, ob ein Nutzer nur „drüberfährt“ oder sich wirklich mit dem Element beschäftigt. - Daten erfassen und übertragen
Die erfassten Daten – wie das Element, die Hover-Dauer und die Position auf der Seite – werden in einem Data Layer (z. B. Google Tag Manager Data Layer) oder direkt an Analyse-Tools wie Google Analytics 4 (GA4) übermittelt. - Datenverarbeitung
Die gesammelten Daten können analysiert werden, um Rückschlüsse auf das Nutzerinteresse zu ziehen. Inhalte, die häufig „gehovert“ werden, sind möglicherweise besonders relevant oder ansprechend.
Technische Umsetzung in Google Tag Manager (GTM)
Um Hover-Tracking mit dem Google Tag Manager (GTM) umzusetzen, geht man wie folgt vor:
- Variable erstellen
- Eine benutzerdefinierte Variable, die das Ziel-Element identifiziert (z. B. durch CSS-Selektoren oder
data-attributes).
- Eine benutzerdefinierte Variable, die das Ziel-Element identifiziert (z. B. durch CSS-Selektoren oder
- Trigger erstellen
- Tag erstellen
- Ein GA4-Ereignis-Tag, das die Informationen wie das gehoverte Element (z. B.
elementId,className,data-attribute) und die Verweildauer an GA4 sendet.
- Ein GA4-Ereignis-Tag, das die Informationen wie das gehoverte Element (z. B.
Zwei Use Cases für Hover-Tracking
Case 1: Optimierung der Navigationselemente (Menüs, Filter, Drop-Downs)
Problem: Ein E-Commerce-Shop bietet eine große Anzahl von Produktkategorien, die in einem Mega-Menü dargestellt werden. Der Shop-Betreiber möchte verstehen, welche Menüpunkte die Aufmerksamkeit der Nutzer auf sich ziehen, auch wenn diese keinen Klick ausführen.
Lösung mit Hover-Tracking:
- Überwachung der Hover-Bewegungen im Menü.
- Erfassung, wie lange Nutzer mit der Maus über bestimmten Menüpunkten verweilen (z. B. „Sale“, „Neue Produkte“, „Damen“, „Herren“).
- Die erhobenen Daten werden in GA4 ausgewertet, um festzustellen, welche Kategorien die meiste Aufmerksamkeit auf sich ziehen.
Erkenntnisse:
- Kategorien, die häufig „gehovert“, aber nicht geklickt werden, könnten durch bessere Beschriftungen, Symbole oder Vorschauen (z. B. Teaser-Bilder) optimiert werden.
- Menüpunkte, die keine oder nur geringe Aufmerksamkeit erhalten, könnten umbenannt, umgestaltet oder entfernt werden, um die Menüstruktur klarer zu gestalten.
Case 2: Optimierung von Call-to-Action (CTA) Buttons auf Landingpages
Problem: Eine Landingpage mit einem Call-to-Action-Button (CTA) „Jetzt kostenlos testen“ generiert nicht genug Klicks. Der Marketing-Manager möchte herausfinden, ob die Besucher den CTA überhaupt wahrnehmen.
Lösung mit Hover-Tracking:
- Tracking der Mausbewegung und Hover-Dauer über dem Call-to-Action-Button.
- Messung der Verweildauer (z. B. >1 Sekunde) und Überprüfung, ob Nutzer den Button nur „streifen“ oder tatsächlich auf ihm verweilen.
- Die Daten werden an GA4 gesendet, um zu analysieren, wie viele Nutzer den Button „sehen“, ohne zu klicken.
Erkenntnisse:
- Wenn viele Nutzer den Button „hovern“, aber nicht klicken, könnte dies ein Zeichen sein, dass das Wording, die Farbe oder die Platzierung des Buttons verbessert werden muss.
- Wenn der Button kaum „gehovert“ wird, deutet dies darauf hin, dass der Button möglicherweise schlecht sichtbar ist. Hier könnten A/B-Tests zur Button-Farbe oder -Platzierung Abhilfe schaffen.
Technische Herausforderungen beim Hover-Tracking
- Datenschutz: Da Mausbewegungen Nutzersignale sind, könnte dies datenschutzrechtlich als „Nutzerdaten“ gelten. Es ist ratsam, die Zustimmung über einen Consent Management Provider (CMP) einzuholen.
- Browser-Kompatibilität: Manche Browser schränken das Tracking von Mausbewegungen in iFrames oder strenger konfigurierten Datenschutzumgebungen ein.
- Datenmenge: Wenn Hover-Daten ständig übertragen werden, kann dies die Performance beeinträchtigen. Hier ist es sinnvoll, nur bestimmte Elemente zu überwachen und den Trigger so einzurichten, dass er nur bei längerer Verweildauer feuert.
Fazit
Hover-Tracking ist eine wertvolle Methode, um das Nutzerinteresse auf einer Website zu messen, ohne dass ein Klick erforderlich ist. Es kann als Frühwarnsystem dienen, um Probleme in der Usability zu erkennen und das Design zu optimieren. Die technische Umsetzung ist mit Tools wie Google Tag Manager leicht möglich, wenn man weiß, welche Elemente wichtig sind. Für E-Commerce-Websites und Landingpages bietet es die Chance, verborgene Nutzerinteressen sichtbar zu machen und datengestützte Entscheidungen zu treffen.