Mehrwert und Grenzen von Heatmaps zur User Experience Analyse im B2B Umfeld

Lese­dau­er: ca. 6–7 Minuten

Was sind Heatmaps?

Heat­maps sind eine wirk­sa­me Metho­de, um zu ver­ste­hen, was Nutzer:innen auf Web­sei­ten tun — wo sie kli­cken, wie weit sie scrol­len, was sie sich anse­hen oder ignorieren.

Im All­ge­mei­nen ist eine Heat­map eine gra­fi­sche Dar­stel­lung von Daten, bei der die Werte durch Far­ben (auf einer Skala von rot bis blau) dar­ge­stellt werden. Auf diese Weise visua­li­sie­ren sie die belieb­tes­ten (“hei­ßen”) und unbe­lieb­tes­ten (“kal­ten”) Ele­men­te einer Web­sei­te. Durch die Aggre­ga­ti­on des Nut­zer­ver­hal­tens erleich­tern Heat­maps die Daten­ana­ly­se und ver­mit­teln auf einen Blick ein Ver­ständ­nis dafür, wie Nutzer:innen mit einer ein­zel­nen Web­sei­te inter­agie­ren, wodurch sich Trends erken­nen und die wei­te­re Nut­zung opti­mie­ren lassen. 

Arten von Heatmaps

Heat­map ist ein Ober­be­griff für ver­schie­de­ne Heat­map­ping-Tools: Scroll Maps, Click Maps und Move Maps. Da jeder Typ einen ande­ren Aspekt der Web­site-Usa­bi­li­ty unter­sucht, ist es wich­tig, den Unter­schied und die jewei­li­gen Mehr­wer­te zu kennen.

Scroll Maps

Anhand einer Scroll Map lässt sich erken­nen, wie weit ein:e Nutzer:in auf einer Seite nach unten scrollt. Sie erfas­sen den genau­en Pro­zent­satz der Besucher:innen, die bis zu einem belie­bi­gen Punkt auf der Seite scrol­len: Je tie­fer das Rot, desto mehr Besucher:innen haben die­sen Abschnitt wahr­ge­nom­men. Scroll Maps kön­nen ver­wen­det werden, um Inhal­te auf Sei­ten zu iden­ti­fi­zie­ren, die zu lang oder nicht attrak­tiv bzw. rele­vant genug sind, um den Nutzer zum “wei­ter­scrol­len” zu bewe­gen. Scroll Maps visua­li­sie­ren die erste Wahr­neh­mung und geben einen Ein­druck zur Sti­mu­lanz der Seite. 

Click Maps 

Click Maps zei­gen, wo Besucher:innen auf Desk­top-Gerä­ten mit der Maus kli­cken und auf mobi­len Gerä­ten mit dem Fin­ger tip­pen (in die­sem Fall werden sie als Touch Heat­maps bezeich­net). Die Karte ist farb­co­diert, um die Ele­men­te anzu­zei­gen, die am häu­figs­ten ange­klickt und ange­tippt wur­den (rot, oran­ge, gelb). Im Fokus steht hier die erste Inter­ak­ti­on des Nut­zers nach dem Scrollen. 

Move Maps

Move Maps ver­fol­gen, wohin Desktop-Benutzer:innen ihren Cur­sor beim Navi­gie­ren auf der Seite bewe­gen. Sie geben einen Hin­weis dar­auf, wohin die Nutzer:innen mög­li­cher­wei­se schau­en, wäh­rend sie durch Ihre Seite gehen. Move Maps kön­nen ver­wen­det werden, um ver­streu­te Cur­sor-Akti­vi­tä­ten zu fin­den, die eher auf Ablen­kung als auf Auf­merk­sam­keit hin­deu­ten könn­ten. Die Akti­vi­tät lässt sich zwi­schen ers­ter Auf­merk­sam­keit und ers­ter Inter­ak­ti­on einordnen.

Heatmaps für Desktop und Mobilgeräte

Mit Heat­maps für Desk­top- und Mobil­ge­rä­te lässt sich die Leis­tung einer Web­site auf ver­schie­de­nen End­ge­rä­ten ver­glei­chen. Inhal­te, die auf einer Desk­top-Seite im Vor­der­grund ste­hen, befin­den sich auf einem Mobil­te­le­fon mög­li­cher­wei­se viel wei­ter unten auf der Seite und haben damit eine ande­re Wir­kung auf den Nutzer. Die Unter­schei­dung hebt das häu­fig sehr unter­schied­li­che Nut­zer­ver­hal­ten abhän­gig vom Gerä­te­typ hervor.

Vorteile bei der Verwendung von Heatmaps auf Websites

Heat­maps hel­fen zu ver­ste­hen, wie Men­schen mit Web­sites inter­agie­ren, so dass Ant­wor­ten auf geschäfts­kri­ti­sche Fra­gen gefun­den werden kön­nen, z. B. “Warum kon­ver­tie­ren meine Nutzer:innen nicht?” oder “Wie brin­ge ich mehr Besucher:innen dazu, aktiv zu werden?”. Mit­hil­fe von Heat­maps lässt sich fest­stel­len, ob Besucher:innen:

• wich­ti­ge Inhal­te errei­chen oder nicht sehen,
• die wich­tigs­ten Links, Drop­downs, Slider (oder allg. Schalt­flä­chen) und CTAs auf einer Seite fin­den und verwenden,
• durch nicht anklick­ba­re Ele­men­te abge­lenkt werden
• oder Sei­ten­struk­tu­ren ein anders­ar­ti­ges Nut­zer­ver­hal­ten abhän­gig vom End­ge­rät zur Folge haben.

Als visu­el­les Tool unter­stüt­zen Heat­maps fun­dier­te, daten­ge­stütz­te Ent­schei­dun­gen für A/B‑Tests, Aktua­li­sie­run­gen oder die (Neu-)Gestaltung von Web­sites. Außer­dem kön­nen Heat­maps hilf­reich sein, wenn es darum geht, Teammitglieder:innen und Stake­hol­der davon zu über­zeu­gen, dass eine Ände­rung not­wen­dig ist, oder ihre Zustim­mung dafür ein­zu­ho­len. Die visu­el­le Bot­schaft der Ana­ly­se­me­tho­de ist sehr ein­fach zu erfas­sen und bedarf weni­ger Vor­kennt­nis­se. Ideal für die inter­ne Über­zeu­gung zur Wich­tig­keit von Usa­bi­li­ty Gedanken. 

Grenzen bei der Verwendung von Heatmaps

Aller­dings hat die Ver­wen­dung von Heat­maps nicht nur viele Vor­tei­le, son­dern auch ihre Schwä­chen bzw. Gren­zen: Klicks allein sind nicht die ganze Wahr­heit. Nur weil viele Besucher:innen auf einen But­ton, einen Link oder der­glei­chen kli­cken, heißt das nicht, dass alles in bes­ter Ord­nung ist. Eine Heat­map zeigt zum Bei­spiel nicht, was nach dem Klick pas­siert; ob die Besucher:innen auf der Seite fin­den, wonach sie suchen, oder ob sie die Seite direkt wie­der ver­las­sen. Daher emp­fiehlt es sich, eine Heat­map mit ande­ren Daten zu ver­knüp­fen (z.B. mit der Absprungra­te oder der Ver­weil­dau­er auf der ver­link­ten Seite). Es emp­fiehlt sich die Kom­bi­na­ti­on mit ande­ren Ana­ly­se Tools, die das User­ver­hal­ten ganz­heit­li­cher betrach­ten, um eine Cus­to­mer Jour­ney des Nut­zers zu iden­ti­fi­zie­ren. Kon­kret bie­ten sich dazu Detail­re­ports aus z.B. Goog­le Ana­ly­tics an: Das User Flow Dia­gramm zeigt die Abfol­ge von Klicks eines Nut­zers über die Seite ver­teilt — von Sei­ten­ein- bis ‑aus­stieg. Die Fun­nel-Dar­stel­lung lässt indi­vi­du­el­le Sei­ten­ab­fol­gen fest­le­gen und die Effi­zi­enz des ent­spre­chen­den Klick­wegs über große Daten erfor­schen. So erhält man tie­fe­re Insights über einen gesam­ten Sei­ten­be­such. Die Heat­map Metho­de kann einen wich­ti­gen Impuls für die zu unter­su­chen­den Bereich lie­fern und ergänzt somit die quan­ti­ta­ti­ven Methoden.

Fazit

Heat­maps sind ein sehr nütz­li­ches Ana­ly­se­tool, das einen ers­ten punk­tu­el­len Ein­blick in das Ver­hal­ten der Website-Besucher:innen bie­tet. Die beson­de­re Strahl­kraft der Metho­de besteht durch sehr anschau­li­che Ergeb­nis­dar­stel­lung. Aller­dings sind Heat­maps kei­nes­wegs “Selbst­läu­fer” oder gar hin­rei­chen­des Ana­ly­se­instru­ment zur Ablei­tung umfas­sen­der Sei­ten­an­pas­sun­gen. Die schnel­le Anwen­dung der Metho­de erlaubt jedoch schnel­le Ver­glei­che zwi­schen his­to­ri­schen Daten und damit eine Trans­pa­renz über User Reak­tio­nen auf unter­schied­li­che Umset­zun­gen — dies kann wei­te­re Ana­ly­se­tools unter­stüt­zen und tie­fer­ge­hen­de Ana­ly­sen anstoßen. 

Quel­len:

• https://www.hotjar.com/heatmaps/
• https://think.design/user-design-research/heat-map-analysis/
• https://www.selbstaendig-im-netz.de/usability/was-sind-heatmaps-und-was-bringen-sie-teil-1-der-heatmap-serie/