Heatmaps til hjemmesider viser, hvordan besøgende bruger dit website. Du kan se, hvor de klikker, hvor langt de scroller, og hvilke områder på siden der får mest opmærksomhed.
Den viden kan du bruge til at forbedre din webshops design og brugeroplevelse, så kunderne nemmere kan finde det, de leder efter.
Det britiske modebrand Ted Baker brugte eksempelvis heatmaps og andre data om brugeradfærd til at forbedre navigationen og opbygningen af deres webshop. Ændringerne var en del af en større relancering af brandets Shopify-butik. Ifølge bureauet bag projektet steg konverteringsraten med 107 %, mens den gennemsnitlige ordreværdi (AOV) steg med 16 %.
Læs med, og bliv klogere på, hvordan heatmaps fungerer, hvilke typer der findes, og hvordan du kan bruge dem til at gøre din webshop bedre.
Hvad er et heat map, og hvordan fungerer det?
Et heatmap er en visuel oversigt over, hvordan besøgende bruger en bestemt side på din hjemmeside. Farverne viser, hvilke områder brugerne interagerer mest med, og hvor aktiviteten er lavere. Det gør det lettere at forstå deres adfærd og opdage, hvilke dele af siden der måske bør forbedres. Mange heatmap-værktøjer viser data for mobil og computer hver for sig.
Værktøjer som Contentsquare (som nu også omfatter Hotjar) og Heatmap registrerer blandt andet klik, musebevægelser og scrolling. Oplysningerne samles, så du hurtigt kan få øje på mønstre i, hvordan besøgende bruger din hjemmeside. Hvis du driver en dansk webshop, skal du også være opmærksom på reglerne for cookies og sporing, da denne type dataindsamling som udgangspunkt kræver samtykke, når der bruges cookies eller lignende teknologier.
Et heatmap viser resultaterne som farvede områder oven på hjemmesiden. Typisk markerer røde og orange farver områder med høj aktivitet, mens blå og grønne farver viser, hvor aktiviteten er lavere. Du kan derfor hurtigt se, hvor besøgende klikker og scroller mest, uden at skulle gennemgå store mængder tal.
Typer af heatmaps
Der findes flere typer heatmaps, som hver især viser forskellige sider af de besøgendes adfærd på din hjemmeside. Nogle registrerer klik, mens andre viser musebevægelser, eller hvor langt ned på siden folk scroller. Hvilken type du skal vælge, afhænger af, hvad du gerne vil undersøge og forbedre på din hjemmeside.
- Klikkort: Disse heatmaps viser, hvor besøgende klikker med musen eller trykker på skærmen på mobilen. Du kan se, hvilke knapper, links og andre elementer der bliver brugt mest, og hvilke der får færre klik. De kan også afsløre, om besøgende forsøger at klikke på noget, der ikke er klikbart. Det kan tyde på problemer med sidens design eller brugervenlighed.
- Heatmaps over musebevægelser: Denne type viser, hvor besøgende bevæger musen hen, og hvor de lader markøren hvile. Det kan give et fingerpeg om, hvilke områder der tiltrækker opmærksomhed, men musemarkørens placering fortæller ikke nødvendigvis, hvor brugeren kigger.
- Scrollkort: Scrollheatmaps viser, hvor langt ned på en side de besøgende scroller. Du kan se, hvor mange der når frem til forskellige dele af siden, og hvor folk typisk stopper med at scrolle. Det kan afsløre indhold, som mange besøgende aldrig når frem til.
- Opmærksomhedsheatmaps: Disse heatmaps kombinerer forskellige oplysninger om brugeradfærd, for eksempel klik, musebevægelser og scrolling. Det giver et mere samlet billede af, hvilke dele af siden de besøgende bruger mest tid på eller interagerer med.
- Segmenterede heatmaps: Her opdeles data efter eksempelvis enhedstype, geografisk placering eller nye og tilbagevendende besøgende. Det gør det muligt at sammenligne, hvordan forskellige grupper bruger din hjemmeside, og se, om de støder på forskellige problemer.
- Heatmaps baseret på eye tracking: I modsætning til almindelige heatmaps kræver eye tracking typisk særligt udstyr eller software og deltagere i en brugertest. Teknologien registrerer, hvor deltagerne kigger på en hjemmeside, så du kan se, hvilke elementer der fanger deres blik, og hvilke der bliver overset.
Måder at bruge heat maps til at forbedre dit website
- Forbedr sidens layout
- Find populære elementer
- Forbedr brugeroplevelsen
- Opdag tekniske problemer
- Brug heatmaps til A/B-tests
Heatmaps giver dig et bedre grundlag for at træffe beslutninger om din hjemmeside. I stedet for at gætte på, hvad der fungerer, kan du se, hvordan de besøgende faktisk bruger siden. Det kan hjælpe dig med at finde ændringer, der er værd at afprøve. Bagefter kan du måle, om ændringerne har forbedret brugeroplevelsen, øget antallet af køb eller haft andre positive resultater.
Her får du fem konkrete eksempler på, hvordan du kan bruge heatmaps til at forbedre din webshop:
Forbedr sidens layout
Heatmaps kan afsløre, om sidens layout gør det nemt for de besøgende at finde vigtig information. Især scrollkort er nyttige, fordi de viser, hvor langt folk scroller, og hvilke dele af siden mange aldrig når ned til.
Hvis en produktside for eksempel har en lavere konverteringsrate i webshoppen end forventet, kan et scrollkort hjælpe dig med at undersøge, om placeringen af indholdet kan være en del af forklaringen.
Hvis mange besøgende ikke scroller længere end til toppen af siden, ser de måske aldrig kundeanmeldelser eller brugergenereret indhold (UGC), som ellers kan skabe tillid til dine produkter. Her kan du teste, om det gør en forskel at flytte indholdet længere op eller tilføje links, der fører direkte til de relevante sektioner.
Find populære elementer
Med heatmaps kan du se, hvilke dele af en side de besøgende bruger mest tid på eller interagerer mest med. Den viden kan du bruge til at vurdere, om lignende indhold bør have mere plads andre steder på din hjemmeside.
Hvis din side med ofte stillede spørgsmål (FAQ) for eksempel har en længere gennemsnitlig engagementstid end andre sider, kan du bruge et opmærksomhedsheatmap til at undersøge, hvilke områder der får mest opmærksomhed.
Hvis dataene tyder på, at besøgende især interesserer sig for spørgsmål om produktspecifikationer, kan det være en god idé at tilføje flere detaljer på dine produktsider. Måske findes oplysningerne allerede, men er svære at få øje på. I så fald kan du ændre sidens opbygning, så de vigtigste oplysninger bliver mere synlige.
Forbedr brugeroplevelsen
Heatmaps kan afsløre, hvor besøgende har svært ved at bruge din hjemmeside, eller hvor noget ikke fungerer, som de forventer. Segmenterede heatmaps er især nyttige, hvis du vil sammenligne brugeroplevelsen på forskellige enheder, for eksempel mobil og computer.
Hvis besøgende på mobilen er mindre aktive end dem, der bruger en computer, kan du undersøge forskellene med segmenterede heatmaps. Måske viser dataene, at mobilbrugere gentagne gange trykker på et produktbillede, som ikke reagerer. Det kan være et tegn på, at de forventer at kunne forstørre billedet eller se flere billeder af produktet. Du kan derefter teste, om en sådan funktion forbedrer oplevelsen på din mobilside.
Mange klik efterfulgt af hurtige afvisninger kan også være tegn på problemer med din mobilside. Måske sidder dine CTA-knapper eller navigationslinks for tæt på hinanden, så kunderne kommer til at trykke forkert. Det kan skabe frustration og få dem til at forlade din webshop.
Tilgængelighed er også en vigtig del af god brugeroplevelse. Digitaliseringsstyrelsen fremhæver blandt andet betydningen af tydelige farvekontraster, så personer med nedsat syn lettere kan læse indholdet. Tænk derfor over både farvevalg, kontraster og tydelige knapper, når du arbejder med din webshops design.
Opdag tekniske problemer
Heatmaps kan også afsløre tegn på tekniske fejl, hvis de besøgende pludselig begynder at bruge din hjemmeside anderledes. Et klikkort kan for eksempel vise, om folk gentagne gange forsøger at trykke på et link eller en knap, som ikke reagerer.
Hvis færre kunder end normalt lægger varer i kurven, kan du bruge et klikkort til at undersøge, hvordan de bruger knappen "Læg i kurv". Hvis mobilbrugere trykker på knappen flere gange, uden at varen bliver lagt i kurven, kan det tyde på en teknisk fejl. Her bør du teste funktionen på forskellige mobilenheder for at finde ud af, hvad der går galt.
Brug heatmaps til A/B-tests
Med en A/B-test sammenligner du to versioner af en webside eller et bestemt element for at finde ud af, hvilken der fungerer bedst. Heatmaps kan ikke erstatte en A/B-test, men de kan vise dig, hvad der er værd at undersøge nærmere. Når testen er gennemført, kan du sammenligne heatmaps fra de to versioner for at se, hvordan de besøgende har brugt dem, og hvad der kan forklare forskellen i resultaterne.
Hvis et klikkort for eksempel viser, at besøgende oftere klikker på en knap med en kort opfordring til handling (CTA) end på en knap med en længere tekst, kan du undersøge, om tekstens længde har betydning for antallet af klik.
Du kan derefter A/B-teste to versioner af den samme knap med forskellige tekstlængder og sammenligne både klikrater og heatmaps. Det kan hjælpe dig med at forstå, hvilken version der fungerer bedst. Ved mere omfattende A/B-tests kan du også bruge eye tracking til at undersøge, hvor testpersonerne retter blikket hen på siden.
Shopify heat map-integrationer
Du kan føje heatmaps til din Shopify-webshop med apps fra Shopify App Store. De hjælper dig med at undersøge, hvordan besøgende bruger din webshop, mens Shopifys egne analyseværktøjer giver dig overblik over trafik og salg. Hvis du bruger apps til at spore kundernes adfærd, skal du også sørge for, at de overholder de danske regler om cookies og samtykke.
Her får du tre apps med heatmaps samt to af Shopifys egne værktøjer, der kan bruges sammen med dem.
Lucky Orange
Lucky Orange kombinerer heatmaps og sessionsoptagelser med funktioner, der hjælper dig med at finde ud af, hvor kunderne støder på problemer. Du kan se, hvor besøgende klikker og scroller, og undersøge, hvorfor de forlader deres indkøbskurv eller afbryder betalingen. Appen har også konverteringstragte, så du kan følge kundernes vej gennem webshoppen og se, hvor de falder fra.
Lucky Orange tilbyder også spørgeskemaer til besøgende og kan bruges sammen med AI-assistenten Shopify Sidekick. Her kan du stille spørgsmål om din webshops resultater og få svar baseret på dine besøgs- og salgsdata.
Infinite Microsoft Clarity
Infinite Microsoft Clarity er en tredjepartsapp, der gør det nemt at tilføje Microsoft Clarity til din Shopify-webshop uden at skrive kode. Appen bruger heatmaps til at vise, hvor besøgende klikker, scroller og bevæger musen, mens sessionsoptagelser giver dig mulighed for at se, hvordan de bruger siden under et besøg. Du kan også undersøge adfærden hos besøgende, der kommer fra Microsoft Shopping-annoncer.
Propel Replay
Propel Replay samler heatmaps, sessionsoptagelser, spørgeskemaer og AI-baseret analyse i én app. Med heatmaps kan du eksempelvis opdage, om kunderne overser vigtige knapper som "Læg i kurv". Sessionsoptagelserne viser, hvordan besøgende bevæger sig rundt i webshoppen, hvor de går i stå, og hvornår de forlader deres indkøbskurv.
Appen har også AI-funktioner, der kan opsummere sessionsoptagelser og hjælpe dig med at finde mulige årsager til, at kunderne ikke gennemfører deres køb. Nogle af disse funktioner kræver et betalt abonnement.
Shopify Analytics og temaeditor
Når du har indsamlet data med heatmaps, kan du sammenholde resultaterne med tallene fra Shopify Analytics. Her kan du blandt andet følge antallet af besøg, salg og konverteringsrater og undersøge, om kundernes adfærd hænger sammen med din webshops resultater.
Med Shopifys temaeditor kan du derefter ændre din webshops layout uden at skrive kode. Hvis et scrollkort eksempelvis viser, at få besøgende når ned til kundeanmeldelserne på en produktside, kan du flytte sektionen højere op, så flere får den at se.
Når du har foretaget ændringerne, kan du følge udviklingen i dine heatmaps og Shopify Analytics for at undersøge, om kunderne bruger siden anderledes, og om ændringerne påvirker salget.
Ofte stillede spørgsmål om heat maps
Hvad bruges et heatmap til?
Heatmaps viser, hvordan besøgende bruger din hjemmeside. Du kan se, hvor de klikker eller trykker, hvor langt de scroller, og hvilke områder på siden der får mest aktivitet. Den viden kan du bruge til at opdage problemer med sidens layout og forbedre brugeroplevelsen.
Har Google et heatmap-værktøj?
Google Analytics har ikke et indbygget heatmap, der viser klik og scrolling direkte på din hjemmeside. Til gengæld kan du bruge funktionen Stiudforskning til at se, hvilke sider brugerne besøger, og hvordan de bevæger sig rundt på dit website. Du kan også kombinere Google Analytics med et heatmap-værktøj som Contentsquare.
Hvordan laver jeg et heatmap?
Start med at vælge et heatmap-værktøj, og installer det på din hjemmeside. Sørg for, at sporingen er sat korrekt op, og lad værktøjet indsamle data fra tilstrækkeligt mange besøg. Derefter kan du analysere, hvor folk klikker og scroller, og bruge resultaterne til at forbedre din hjemmeside.
