Czym jest heatmapa? Mapy kliknięć i przewijania strony | We.Inc
Czym jest mapa ciepła strony, jak zbiera się mapy kliknięć, przewijania i uwagi, co zrobić z prywatnością i zgodą, oraz demo na żywo, które rysuje heatmapę z Twoich własnych kliknięć.
Mapa ciepła (heatmapa) strony to obraz Twojej strony z nałożonymi kolorami, które pokazują, gdzie odwiedzający klikali, jak daleko przewijali lub gdzie spędzali czas. Ciepłe kolory oznaczają wielu odwiedzających, zimne niewielu. Mały skrypt na stronie rejestruje interakcje, a narzędzie sumuje je z wielu wizyt.
Popularne rodzaje heatmap
Rodzaj
Co pokazuje
Na jakie pytanie odpowiada
Mapa kliknięć
Gdzie ludzie klikali lub dotykali
Czy ktoś w ogóle naciska mój główny przycisk?
Mapa przewijania
Odsetek odwiedzających, którzy dotarli do każdej głębokości strony
Czy ludzie w ogóle widzą moje ceny?
Mapa obszarów
Łączna liczba kliknięć w wybranym obszarze
Jak często używane jest całe menu?
Mapa uwagi
Czas spędzony na każdej części strony
Która sekcja zatrzymuje ludzi?
Mapa ruchu
Gdzie przesuwał się kursor myszy, w niektórych narzędziach
Co przyciąga odwiedzających na komputerach?
Analityka mówi, ile osób odwiedziło stronę. Heatmapa pokazuje, co robiły, gdy już na niej były. Na stronie małej firmy często wyjaśnia to zagadkę jednym spojrzeniem: przycisk, którego nikt nie klika, zdjęcie, w które wszyscy stukają, oczekując linku, oferta ukryta poniżej miejsca, w którym większość odwiedzających przestaje przewijać. Wypróbuj demo, aby zobaczyć, jak powstaje taka mapa.
Wybierz narzędzie do heatmap i utwórz projekt dla swojej strony.
Dodaj skrypt śledzący narzędzia na każdej podstronie albo zainstaluj jego wtyczkę do swojego kreatora stron.
Skonfiguruj zgodę, jeśli masz odwiedzających z regionów, które jej wymagają, i wybierz, ile tekstu ze strony narzędzie może zapisywać.
Zanim wyciągniesz wnioski, poczekaj na kilkaset wizyt na interesującej Cię podstronie.
Otwórz heatmapę tej podstrony, sprawdź osobno telefony i komputery i zapisz jedną zmianę do przetestowania.
Oglądaj telefony i komputery osobno. Ta sama strona ma inny układ, więc mieszane mapy się rozmywają.
Kliknięcia w elementy, które nie są linkami, na przykład zdjęcia lub pogrubiony tekst, oznaczają, że ludzie oczekują od nich działania.
Jeśli większość odwiedzających przestaje przewijać przed wezwaniem do działania, przesuń je wyżej, zamiast je powiększać.
Wściekłe kliknięcia (rage clicks), gdy ktoś stuka raz po raz w to samo miejsce, często wskazują na zepsuty lub wolny element.
Traktuj heatmapę jako źródło pomysłów, a zmianę potwierdzaj testem A/B lub danymi o konwersjach.
Najczęściej zadawane pytania
Czy istnieją darmowe narzędzia do heatmap?
Tak. Dokumentacja Microsoft opisuje Clarity jako usługę darmową na zawsze, z mapami kliknięć, przewijania, obszarów, konwersji i uwagi oraz nagraniami sesji. Heatmapy oferują też inne narzędzia, takie jak Hotjar; aktualne plany sprawdź na ich stronach.
Ilu odwiedzających potrzebuję do przydatnej heatmapy?
Nie ma oficjalnej liczby. Niektóre narzędzia rysują mapę z bardzo małego ruchu, ale kilka wizyt pokazuje głównie indywidualne nawyki. Zanim cokolwiek przeprojektujesz, poczekaj, aż wzorzec przestanie się zmieniać wraz z kolejnymi wizytami.
Czy heatmapy wymagają zgody na cookies?
To zależy od narzędzia i prawa w miejscu, gdzie są Twoi odwiedzający. Clarity na przykład zaczęło egzekwować sygnały zgody dla wizyt z EOG, Wielkiej Brytanii i Szwajcarii 31 października 2025 roku. To nie jest porada prawna; sprawdź zasady, które Cię dotyczą.
Czy narzędzia do heatmap zapisują to, co ludzie wpisują?
Dobre narzędzia to ukrywają. Dokumentacja Clarity mówi, że zawartość pól tekstowych i list rozwijanych jest maskowana w każdym trybie, a domyślny tryb Balanced maskuje także liczby i adresy e-mail.
Czym różni się heatmapa od nagrania sesji?
Heatmapa sumuje wiele wizyt w jeden obraz strony. Nagranie sesji odtwarza drogę jednego odwiedzającego przez kolejne podstrony. Heatmapy pokazują wzorce; nagrania pomagają wyjaśnić pojedynczy dziwny przypadek.
Jak zbierane są dane
Skrypt na stronie nasłuchuje kliknięć, dotknięć i przewijania i wysyła do narzędzia małe rekordy: który element został naciśnięty, jaka jest szerokość strony, jak daleko dotarł odwiedzający. Narzędzie grupuje potem rekordy według podstrony i urządzenia i koloruje stronę.
Lepsze narzędzia wiążą kliknięcia z elementami strony, a nie z surowymi pozycjami na ekranie. Dokumentacja Clarity mówi, że jego mapy kliknięć opierają się na elementach, a nie na bezwzględnej pozycji myszy, więc pozostają dokładne przy różnych rozmiarach ekranu i responsywnych układach.
Ustawienia prywatności do wyboru od pierwszego dnia
Zdecyduj, ile tekstu strony narzędzie może przechowywać. Clarity oferuje tryb Strict, który maskuje całą treść, Balanced, który maskuje dane wrażliwe, takie jak liczby i adresy e-mail, oraz Relaxed, który maskuje tylko pola formularzy i listy rozwijane.
Możesz też oznaczyć pojedyncze części strony jako prywatne. W Clarity służy do tego atrybut data-clarity-mask, pokazany w kodzie poniżej. Clarity podaje też, że nie powinno być używane na stronach skierowanych do użytkowników poniżej 18 lat.
Kod, który może Ci się przydać
Dwa krótkie fragmenty dla stron korzystających z Clarity. Oba są zgodne z opublikowanym API Microsoft; wartości są przykładowe.
Ukrycie jednej części strony przed nagraniami
Dodanie data-clarity-mask z wartością True maskuje ten element i wszystko w jego wnętrzu, niezależnie od ustawienia dla całej strony.
Przekazanie Clarity, że odwiedzający się zgodził
Wywołaj to z banera cookies po akceptacji przez odwiedzającego. Jeśli odmówi, Clarity działa bez cookies, więc żadne wywołanie nie jest potrzebne.
Jak demo rysuje ciepło
Każde kliknięcie staje się miękkim kołem z createRadialGradient. Nakładające się koła sumują się, więc ruchliwe miejsca ciemnieją.
Zrób heatmapę z własnych kliknięć
Kliknij lub dotknij dowolnego miejsca na przykładowej stronie poniżej. Każde kliknięcie dodaje ciepła. Nic nie jest nigdzie wysyłane: kliknięcia zostają w tej karcie przeglądarki.
Przykładowa strona. Kliknij, aby dodać ciepła w tym miejscu.
Zarejestrowane kliknięcia: {n}
Wyczyść kliknięcia
Pokaż stronę pod mapą ciepła
Menu
Zamów
Odwiedź nas
Świeży chleb na zakwasie, pieczony o 5 rano
Zamów do 10 wieczorem, odbiór następnego ranka.
Zamów chleb
Otwarte od wtorku do niedzieli, od 7 rano do 2 po południu