Was ist Microsoft Clarity und wie du damit Usability Probleme findest
Clarity ist kostenloses Microsoft-Tool, mit dem du Usability Problemen auf deiner Website aufspüren kannst.
Manche bezeichnen Clarity als einen Google Analytics Mitbewerber. Das sehe ich nicht ganz so. Clarity ist eher wie Hotjar oder MouseFlow und nicht wie Google Analytics, aber es ist eine nützliche Ergänzung für Google Analytics.
In diesem Beitrag stelle ich dir Microsoft Clarity vor und gebe dir einen Überblick über die verschiedenen Funktionen, mit denen du Usability Problemen auf deiner Website auf die Spur kommen kannst.
Inhaltsverzeichnis
- Was ist Microsoft Clarity?
- Antworten auf häufige Fragen rund um Microsoft Clarity
- Funktionen von Microsoft Clarity
- Weitere Clarity Funktionen
Was ist Microsoft Clarity?
Wie oben erwähnt, ist Clarity eher Usability-Tool als ein Marketing-Analytics Tool. Microsoft Clarity zeichnet, genau wie Hotjar oder ähnliche Tools, Daten von Sitzungen und Seitenaufrufen auf - natürlich unter Berücksichtigung der Privatsphäre. Dazu weiter unten mehr.
Diese Daten kannst du mit Heatmaps visualisieren und dir ganze Sitzungen wie einen Film abspielen und ansehen, wie Besucher und Besucherinnen mit deiner Website interagieren. Wie das genau funktioniert, siehst du beispielsweise in meinem mehr als 3-stündigen Microsoft Clarity Kurs auf Udemy.
Startseite von Microsoft Clarity
Ferner erfasst Clarity einige Messwerte, die GA4 beispielsweise standardmäßig nicht erfasst und die dir Hinweise liefern, auf welchen Seiten Usability Probleme aufgetreten sind. Bevor wir uns diese Messwerte und die Funktionen von Microsoft Clarity ansehen, sind hier noch einige Antworten auf Fragen rund um Microsoft Clarity.
Microsoft Clarity findest du unter https://clarity.microsoft.com
Antworten auf häufige Fragen rund um Microsoft Clarity
Was kostet Microsoft Clarity?
Microsoft Clarity ist kostenlos. Laut Microsoft wird Clarity auch kostenlos bleiben. Da es aber einige Einschränkungen in der Datenerfassung hat, die vor allem große Sites mit mehreren 100.000 Sitzungen pro Tag betreffen, würde es mich aber nicht wundern, wenn es irgendwann ein Microsoft Clarity Pro geben wird. Mit Stand Juni 2024 ist dazu aber noch nichts bekannt.
Welche lange bewahrt Microsoft Clarity Daten auf?
Es gab einmal einen Hinweis auf der Website, dass Clarity Daten für 30 Tage aufbewahrt. Dieser Hinweis hat sich aber insofern geändert, als die 30 Tage-Aufbewahrung nur für Sitzungsaufzeichnungen gilt, sofern eine Aufzeichnung nicht als Favorit markiert ist. Dann wird sie 13 Monate aufbewahrt.
Ich würde zur Sicherheit aber davon ausgehen, dass auch die Daten für Heatmaps nur 30 Tage aufbewahrt werden. Ich konnte bisher keine Heatmaps aufrufen, die weitere als 2 Monate zurückliegen.
Ist Clarity DSGVO-konform?
Microsoft sagt, dass Clarity sensible Daten maskiert, bevor sie an Clarity geschickt werden. Das siehst du in den Screen-Recordings daran, dass der Text einer Website inklusive aller Eingaben in einem Formular durch ein "X" ersetzt werden.
Um auf Nummer Sicher zu gehen, kannst du für bestimmte HTML Elemente, wie Eingabefelder zusätzlich festlegen, dass Clarity diese unbedingt maskieren soll. Dazu fügst du das HTML-Attribut data-clarity-mask="true" in ein beliebiges HTML-Tag ein.
Laut Microsoft ist Clarity auch DSGVO-konform. Mehr Information über die DSGVO und Clarity gibt es in der - nur in englischer Sprache - verfügbaren FAQ zu Clarity.
Clarity setzt allerdings auch ein Cookie. Damit solltest du Microsoft Clarity in dein Consent-Management-Tool integrieren.
Kann ich Microsoft Clarity mit Google Analytics 4 verknüpfen?
Theoretisch kannst du Clarity mit Google Analytics verknüpfen. Praktisch hat Microsoft die Verknüpfung Ende 2023 aufgrund von technischen Problemen vorübergehend deaktiviert. Sobald die Verknüpfung wieder funktioniert, siehst du einige GA4 Daten in Clarity und Clarity sollte Daten an GA4 senden, mit denen du direkt zu Heatmaps oder Sitzungsaufzeichnungen springen kannst.
Funktionen von Microsoft Clarity
Die Filterleiste
Die Filterleiste ist quasi die Basis von Clarity. Damit legst du fest, welche Daten im Clarity Dashboard angezeigt werden, für die Heatmaps, die Sitzungsaufzeichnungen und die Usability-Metriken herangezogen werden sollen.
Filterleiste in Microsoft Clarity
In der Filterleiste, die im Screenshot markiert ist, legst du etwa den Zeitraum fest, wie 3, 7 oder 30 Tage. Du kannst die Daten aber auch nach Besucherquellen, wie Facebook oder der organische Google Suche, filtern. Ferner gibt es noch dutzende weitere Filter wie Sitzungsdauer, Eintiegs- oder Ausstiegsseite, Browser, Betriebssystem oder Endgerätekategorie, um nur einige zu nennen.
Hinweis: Die deutsche Übersetzung ist an ein paar Stellen in Microsoft Clarity noch etwas holprig. So wird der aus Google Analytics bekannte Parameter Medium als Mittel übersetzt.
Einen einmal definierten Filter kannst du als Segment speichern und so jederzeit wieder aufrufen und aktivieren.
3 Arten von Heatmaps
In Clarity gibt es 3 Arten von Heatmaps: nämlich für das Klicken, das Scrollen und für Bereiche. Jede dieser drei Heatmaps kannst du dir für drei Arten von Gerätekategorien ansehen: für den Desktop, für ein Tablet und für mobile Endgeräte.
Die Scroll-Heatmaps
Mit einer Scroll-Heatmap siehst du, bei wie viel Prozent der Seitenaufrufe bis zu welchem Bereich der Seite gescrollt wurde. Das zeigt dir Clarity einerseits anhand der Farbgebung an, die von warmen Farben wie rot und orange bis zu kühlen Farben wie Hell- und Dunkelblau reichen. Andererseits siehst du auch die Scrolltiefe in %, die sowohl in der Seitenleiste angezeigt wird aber auch, wenn du den Mauszeiger über die Heatmap bewegst.
Beispiel einer Scroll-Heatmap in Microsoft Clarity
In einer Scroll-Heatmap siehst du für jedes Endgerät den durchschnittlichen Fold (oder wie Clarity es nennt: die Faltung). Das ist der Bereich, der nach dem Laden einer Seite oder scrollen sichtbar ist.
Hinweis: Dieser Bereich sollte den Besuchern und Besucherinnen sagen, was sie auf dieser Seite erwartet beziehungsweise, ob sie auf dieser das Finden, wonach sie gesucht haben.
Nutze die Scroll-Heatmaps, um die Fragen zu einzelnen Seiten zu beantworten wie etwa:
- Wird bis zu für die Customer Journey wichtigen Elementen wie Links, Formularen, Videos oder Teaser-Listen gescrollt?
- Wie oft wird in Relation zu den Seitenaufrufen zu den für die Customer Journey wichtigen Elementen gescrollt?
Die Klick-Heatmaps
In einer Klick-Heatmap siehst du, ob die Besucher und Besucherinnen auf die Elemente einer Seite klicken, auf die sie im Sinne deiner Customer Journey klicken sollen. Das können etwa Links zu weiterführenden Seiten und Informationen sein.
Beispiel einer Klick-Heatmap in Microsoft Clarity
Verwendest du auf einer Seite etwa ein Inhaltsverzeichnis, können dir die Klicks auf die Links im Inhaltsverzeichnis einen wertvollen Hinweis darauf geben, welche Themen auf dieser Seite besonders interessant sind.
Verwende die Klick-Heatmaps, um dir noch weitere Fragen zu beantworten, wie:
- Wird auf für die Customer Journey wichtige Elemente geklickt?
- Wird auf Elemente geklickt, die Besucher oder Besucherinnen von der Customer Journey abbringen?
- Gibt es Unterschiede im Klick-Verhalten zwischen z.B. Desktop oder Mobile?
- Wie ist das Klick-Verhalten in Relation zum Scroll-Verhalten?
Hinweis: Die letzten beiden Fragen kannst du dir beantworten, indem du eine Scroll-Heatmap und eine Klick-Heatmap parallel anzeigst.
Die Bereichs-Heatmaps
Mit Bereichs-Heatmaps bekommst du in MS Clarity einen Überblick darüber, auf welche Bereiche geklickt wurde. Das ist insbesondere für Übersichtsseiten interessant, auf denen du etwa Teaser-Blöcke platziert hast und wenn es im ersten Schritt einer Analyse egal ist, auf welchen Link eines Teaser-Blocks geklickt wurde, sondern nur, ob überhaupt darauf geklickt wurde.
Beispiel einer Bereichs-Heatmap in Microsoft Clarity
Bestimmte Bereiche in Bereichs-Heatmaps erkennt Microsoft Clarity von selbst, wie etwa den 4,35 % Textblock im oberen Screenshot. Du kannst allerdings auch Bereiche selbst festlegen, wie ich es etwa für die drei bläulich gefärbten Bereiche gemacht habe.
Hinweis: Benutzerdefinierte Bereiche speichert Clarity nur für das jeweilige Endgerät (Desktop, Tablet oder Mobile). Gegebenenfalls musst du ein- und denselben benutzerdefinierten Bereich einmal für Desktop und einmal für Mobile festlegen
Definiere dir in Clarity für wichtige Bereiche, wie etwa Teaser-Listen Bereiche und prüfe, ob damit gemäß deiner Customer-Journey interagiert wird.
Mit Bereichs-Heatmaps kannst du dir folgende Fragen beantworten:
- Mit welchen Bereichen einer Seite interagieren Besucher oder Besucherinnen?
- Auf welche Bereiche, etwa eines Teaser-Blocks, wird am häugisten geklickt?
Screen-Recordings (Sitzungsaufzeichnungen)
Zusätzlich zu den Heatmaps zeichnet Clarity pro Tag bis zu 100.000 Sitzungen von Besuchern und Besucherinnen auf, die du dir dann wie einen Film oder eine Serie ansehen kannst.
Beispiel einer Sitzungs-Aufzeichnung in Microsoft Clarity
Das Analysieren von Sitzungsaufzeichnungen kann allerdings sehr langwierig sein. Denn durch das bloße Ansehen von 1 oder 2 Sitzungen, kommst du nur in wenigen Fällen Usability-Problemen auf die Spur; da solltest du die eher 10 bis 20 oder sogar noch mehr Sitzungen ansehen.
Durch Sitzungs-Aufzeichnungen kannst du folgende Erkenntnisse gewinnen:
- Wie schnell scrollen Besucher oder Besucherinnen durch eine Seite?
- Scrollen sie nur nach unten oder danach auch wieder nach oben, also ob sie etwas suchen würden?
Das Dashboard
Vom Dashboard aus kannst du dann für Seiten, Ereignisse oder Besucherquellen mit einem Klick zu den Sitzungsaufzeichnungen oder Heatmaps springen, in dem du auf das entsprechende Symbol klickst.
Clarity Dashboard mit Links zu Heatmaps und Aufzeichnungen
Dadurch wird etwa eine Besucherquelle (Referrer) oder eine Gerätekategorie in die Filterleiste übernommen, die Daten danach gefiltert und angezeigt.
Usability-Metriken in Microsoft Clarity
Neben den Heatmaps und Sitzungsaufzeichnungen erfasst MS Clarity noch ein paar eigene Usability-Messwerte. Die sind beispielsweise über das Dashboard zugänglich.
Was sind tote Klicks (Dead Clicks)?
Ein Dead Click tritt auf, wenn Besucher oder Besucherinnen auf ein Element deiner Website klicken und daraufhin nichts passiert; etwa auf einen Link.Typische Gründe für einen Dead Click sind:
- Ein Besucher klickt auf ein Bild, dass daraufhin nicht in einer Großansicht (Lightbox) geöffnet wird
- Ein Menü wird nicht ausgeklappt
- Beim Klick auf einen Link wird keine neue Seite oder ein Pop-up geöffnet
Die technischen Gründe für Dead Clicks reichen von fehlerhaftem Javascript bis zur nicht erwartungskonformen Darstellung von Interaktions-Elementen wie Bilder oder Links.
Tote Klicks im Clarity Dashboard
Um dir Aufzeichnungen mit Dead Klicks anzusehen, klicke im Dashboard in der Karte Einblicke auf den Bereich tote Klicks.
Was sind Rage Klicks oder übermäßige Klicks?
Rage-Klicks, auch als übermäßige Klicks bezeichnet, sind häufige Klicks innerhalb einer kurzen Zeit auf einen kleinen Bereich der Website.
Übermäßige Klicks im Clarity Dashboard
Ein häufiger Grund für Rage-Klicks sind Dead-Klicks. Nachdem sich die Website nicht erwartungskonform verhält, wird wiederholt auf ein Element geklickt, in der Hoffnung, dass doch noch etwas passiert.
Um herauszufinden, auf welchen Seiten und bei welchen Elementen Rage-Klicks aufgetreten sind, klicke im Clarity Dashboard in der Karte Einblicke auf die Schaltfläche übermäßige Clicks.
Damit gelangst du zu den nach übermäßigen Klicks gefilterten Session-Recordings. Sieh dir die Aufnahmen an und versuche herauszufinden, bei welchen Elementen die übermäßigen Clicks auftreten.
Übermäßige Klicks (Rage Clicks) deuten auf sehr unzufriedene Nutzer hin. Die Probleme solltest du unbedingt beheben.
Was ist mit übermäßiges Scrolling gemeint?
Übermäßiges Scrolling im Kontext von Microsoft Clarity bedeutet, dass Besucher häufiger und schneller auf einer Seite runter und wieder rauf scrollen als der Durchschnitt.
Übermäßiges Scrollen unter Einblicke
Übermäßiges Scrolling kann ein Hinweis darauf sein, dass Nutzer etwas auf der Seite suchen, aber nicht finden.
Um die Sitzungsaufzeichnungen mit übermäßigem Scrollen zu finden, klicke bitte im Dashboard in der Karte Einblicke auf den entsprechenden Link.
Was ist eine schnelle Rückkehr (Quickback)?
Bei einer schnellen Rückkehr klickt ein Benutzer oder eine Benutzerin auf einen Link und wechselt innerhalb kurzer Zeit zurück zur vorherigen Seite. Wie kurz diese Zeitspanne ist, lässt sich allerdings nicht konfigurieren. Microsoft sagt, dass sich diese Zeitspanne in zukünftigen Releases nach der durchschnittlichen Verweildauer auf der Seite richten wird.
Anzeige der schnellen Rückkehr in Clarity
Eine schnelle Rückkehr tritt häufig bei mobilen Endgeräten auf. Beispielsweise, wenn zwei Links zu nah beieinander liegen und Besucher Schwierigkeiten haben, den gewünschten Link anzutippen. Ein anderer, häufiger, Grund für einen Quickback (schnelle Rückkehr) ist, wenn eine verlinkte Seite nicht das hält, was der Link-Text verspricht.
JavaScript Fehler
Auch JavaScript Fehlern, die oft der eigentliche Grund für übermäßiges Klicken sind, kommst du mit Clarity auf die Spur. Dazu gibt es im Dashboard eine eigene Karte, auf der die häufigsten JS Fehler aufgeführt sind.
Weitere Clarity Funktionen
Neben den Heatmaps, Sitzungsaufzeichnungen und den spezifischen Clarity Metriken kannst du in Clarity auch Ereignisse definieren und aufzeichnen sowie Trichter (Funnels) anlegen.
Intelligente Ereignisse in Microsoft Clarity
Intelligente Ereignisse legst du in den Einstellungen in Clarity fest. Bestimmte Ereignisse, wie das Absenden eines Formulars oder das Klicken auf einen mailto Link erkennt Clarity automatisch als intelligentes Ereignis.
Du kannst aber auch eigene Ereignisse als benutzerdefinierte Ereignisse festlegen.
Intelligentes Ereignis in Clarity anlegen
Dazu kannst du eine Kombination von Schaltflächenklicks, API-Ereignissen, automatischen Ereignissen und Seitenaufrufen verwenden. Dadurch kannst du beispielsweise festlegen, dass ein Klick auf eine Schaltfläche (die Clarity erkannt hat) auf einer bestimmten Seite oder einer Gruppe von Seiten als ein individuelles Ereignis erfasst wird.
Hinweis: API-Ereignisse sind Ereignisse, die du mit JavaScript (etwa mit dem Google Tag Manager) an Clarity sendest.
Diese Ereignisse werden dann auf der Startseite in einer eigenen Karte angezeigt und du kannst dir Heatmaps oder Sitzungs-Aufzeichnungen für Seiten ansehen, auf denen dieser Ereignisse aufgetreten sind.
Intelligente Ereignisse im Clarity Dashboard
Funnel in MS Clarity
Ähnlich wie in Google Analytics kannst du dir in Clarity auch Trichter (Funnels) anlegen. Dafür verwendest du eine Kombination von intelligenten Ereignissen und bzw. oder Seitenaufrufen. Diese definierten Funnel werden dir dann in einer Zusammenfassungskarte im Dashboard angezeigt.
Funnel im Clarity Dashboard
Hinweis: Die Funnel in Microsoft Clarity sind immer geschlossen; das bedeutet, dass eine Conversion nur dann als erfolgreich gewertet wird, wenn Besucher und Besucherinnen alle Schritte des Funnels durchlaufen haben. Steigen sie etwa erst im zweiten Schritt des Funnels ein und schließen in ab, wird das nicht als Erfolg gewertet.
Somit eignen sich Funnels in Clarity aktuell nur für echte Funnels, die vollständig durchlaufen werden müssen; etwa einen Checkout-Funnel.
Zusammenfassung
Ich verwende Microsoft Clarity für meine eigenen Websites und die Websites meiner Kunden und Kundinnen, seitdem Microsoft das Tool gelauncht hat. Es ist eine praktische Ergänzung für die Daten, die ich aus Google Analytics 4 bekomme. Sehe ich in den GA4 Daten ein potenzielles Problem, kann ich mir die Interaktionen mit den problematischen Seiten visuell in Heatmaps oder Sitzungsaufzeichnungen ansehen. Dadurch komme ich potenziellen Problemen schneller auf die Spur.
Zusätzlich dazu sind die Clarity-spezifischen Metriken, die Google Analytics 4 nicht erfasst, besonders nützlich, um Probleme zu finden, die man in reinen Analytics-Daten nicht auf den ersten Blick sehen würde.
In meinem Microsoft Clarity Kurs auf Udemy findest du über 3 Stunden Videomaterial, mit dem du in deinem Tempo lernen kannst, wie du Clarity verwenden kannst.
