
Czym jest mapa cieplna strony?
Mapa cieplna to zbiorczy obraz wielu sesji, który pokazuje wzorce zachowań na jednej podstronie zamiast pojedynczych wizyt. Według przewodnika Contentsquare czerwień i pomarańcz oznaczają największą aktywność, żółty i zielony umiarkowaną, a niebieski niewielką lub zerową. Google Analytics mówi, ile osób weszło i ile dokonało konwersji, a heatmapa pokazuje, w którym miejscu strony działali. Dlatego jest podstawowym narzędziem optymalizacji współczynnika konwersji (CRO).
Jak działa heatmapa?
Heatmapa działa dzięki skryptowi, który zapisuje współrzędne interakcji i nanosi ich zagęszczenie na układ strony. Proces wygląda tak:
- Instalacja skryptu, np. Microsoft Clarity lub Hotjar.
- Zbieranie kliknięć, dotknięć, ruchów kursora i głębokości przewijania.
- Agregacja danych dla każdej podstrony i typu urządzenia.
- Nałożenie warstwy kolorów na zrzut strony.
Osobne mapy dla komputerów, tabletów i smartfonów są konieczne, bo układ strony się różni, a przycisk dobrze widoczny na desktopie bywa na telefonie poniżej pierwszego ekranu.
Rodzaje map cieplnych
Narzędzia do heatmap oferują 5 głównych rodzajów map, a każdy odpowiada na inne pytanie.
Mapa kliknięć
Mapa kliknięć pokazuje, gdzie użytkownicy klikają na komputerze lub dotykają ekranu na telefonie. Ujawnia kliknięcia w elementy, które nie są linkami, i przyciski, z których nikt nie korzysta.
Mapa przewijania
Mapa przewijania pokazuje, jaki odsetek odwiedzających dociera do każdego miejsca strony. Od razu widać, czy formularz lub cennik nie są schowane zbyt nisko.
Mapa ruchu kursora
Mapa ruchu pokazuje, gdzie przesuwa się kursor na komputerze, co w przybliżeniu oddaje uwagę. Na urządzeniach dotykowych nie występuje.
Mapy rage clicków i martwych kliknięć
Te mapy pokazują serie nerwowych kliknięć i kliknięcia, które niczego nie uruchamiają. Microsoft Clarity wykrywa takie wzorce automatycznie, za pomocą uczenia maszynowego.
Heatmapa z eye trackingu
Heatmapa z eye trackingu pokazuje, gdzie ludzie faktycznie patrzą, mierzone specjalnym sprzętem w badaniach laboratoryjnych. Nielsen Norman Group opisał na tej podstawie wzorzec czytania w kształcie litery F w 2006 roku i potwierdził go w 2017 roku dla desktopu i urządzeń mobilnych.
Mapy cieplne w marketingu i SEO
Mapy cieplne pomagają zamieniać ruch w leady, bo pokazują problemy z układem strony, które liczby w analityce tylko sugerują. W projektach SEO sięgam po nie, gdy podstrona zaczyna zbierać ruch, bo pozycja daje wizyty, ale konwersję musi zapewnić sama strona. Najczęstsze odkrycia w polskich sklepach:
- Klikanie w zdjęcia produktów, które nie są linkami.
- Połowa osób nie dociera do tabeli z cenami.
- Przycisk „Do koszyka” zasłonięty na telefonie przez baner cookies.
- Pomijanie wstępu i przeskakiwanie do pierwszej tabeli.
Na stronach z ruchem organicznym heatmapa pokazuje też, czy odpowiedź na zapytanie jest tam, gdzie użytkownik patrzy najpierw, co jest podstawą SXO. Zestaw dane z heatmapy z CTR z Google Search Console, a zobaczysz pełną ścieżkę od wyniku wyszukiwania do zakupu.
Heatmapa a nagrania sesji
| Cecha | Heatmapa | Nagranie sesji |
|---|---|---|
| Dane | Zbiorcze z wielu wizyt | Jedna wizyta |
| Odpowiada na pytanie | Gdzie użytkownicy działają | Dlaczego ktoś utknął |
| Czas analizy | Minuty | Godziny oglądania |
| Zastosowanie | Układ strony i CTA | Błędy i problemy z formularzami |
Obie metody najlepiej działają razem: heatmapa wskazuje strefę problemu, a nagrania ją wyjaśniają. Obie funkcje znajdziesz w Microsoft Clarity i w Hotjarze, który Contentsquare przejął 1 września 2021 roku.
Najczęstsze pytania: Mapa cieplna
Co oznaczają kolory na mapie cieplnej?
Czerwień i pomarańcz oznaczają największą aktywność, żółty i zielony umiarkowaną, a niebieski niewielką lub żadną. Skala jest względna dla danej strony, a nie bezwzględna.
Jakie jest darmowe narzędzie do heatmap?
Microsoft Clarity jest bezpłatny i nie ma limitów ruchu. Oferuje mapy kliknięć i przewijania, nagrania sesji oraz wykrywanie rage clicków i martwych kliknięć.
Czym różni się mapa kliknięć od mapy przewijania?
Mapa kliknięć pokazuje, gdzie użytkownicy klikają lub dotykają ekranu, a mapa przewijania, jaki odsetek osób dociera do każdej części strony. Razem pokazują, czy ważne elementy są widoczne i używane.
Czy heatmapa jest zgodna z RODO?
Narzędzia do heatmap zbierają dane o zachowaniu użytkowników, więc trzeba je uwzględnić w polityce prywatności i banerze zgód. Microsoft Clarity deklaruje gotowość do RODO, ale konfiguracja zgód zależy od właściciela strony.
Powiązane pojęcia
- Heatmaps: the complete guide · Contentsquare
- F-Shaped Pattern of Reading on the Web: Misunderstood, But Still Relevant · Nielsen Norman Group
- Microsoft Clarity is now Generally Available · Microsoft Bing Blogs
- Microsoft Clarity: free heatmaps and session recordings for website optimization · Martech Zone
- Contentsquare acquires Hotjar · Contentsquare







