Heatmapa je vizuální nástroj, který v jediném obrázku ukáže to, co byste z čísel v Google Analytics hledali celé hodiny — kam lidé klikají, kde přestávají scrollovat a co je na vaší stránce mate.
V tomhle průvodci si vysvětlíme, jak teplotní mapy fungují, jaké typy se v roce 2026 používají a které nástroje vám dají nejlepší poměr ceny a hodnoty.
Co je heatmapa a proč ji potřebujete
Heatmapa (česky teplotní nebo tepelná mapa) je grafické zobrazení interakce uživatelů s webovou stránkou. Pomocí barevné škály od studené modré po horkou červenou ukazuje, kde se na stránce děje nejvíc — kam lidé klikají, kam se posouvají kurzorem nebo kam dojíždějí scrollem.
Princip je jednoduchý: čím teplejší barva, tím víc interakcí v dané oblasti proběhlo. Červená a oranžová znamená horké zóny, kam míří většina pozornosti. Modrá a zelená naopak označuje místa, která uživatelé přehlížejí.
Zatímco klasická webová analytika vám řekne, co se na webu děje (kolik máte návštěv, jaký je bounce rate, kolik konverzí), heatmapa odpovídá na otázku kde se to děje. Společně se záznamy relací (session recordings) pak ukáže i proč.
Proč heatmapy fungují i v éře AI
V roce 2026 dominují CRO trendy AI nástroje, prediktivní personalizace a autonomní A/B testování. Heatmapa ale zůstává základním stavebním kamenem každé optimalizační strategie z jednoho prostého důvodu — generuje hypotézy, které pak můžete testovat.
Podle průvodce CRO platformy Apexure z března 2026 je instalace Hotjaru nebo Crazy Egg na každou optimalizovanou stránku standardní první krok. Heatmapy ukážou kde lidé klikají; nahrávky relací ukážou, kde se trápí. Bez tohoto vstupu jsou A/B testy jen organizovaným hádáním.
Hlavní typy heatmap a co každá ukáže
Heatmapa není jeden nástroj, ale celá rodina vizualizací. Každý typ odpovídá na jinou otázku a v praxi se vyplatí kombinovat alespoň tři základní.
Click heatmapa (mapa kliknutí)
Nejznámější a nejpoužívanější typ. Zobrazuje, na která místa stránky uživatelé klikají (na desktopu) nebo ťukají (na mobilu). Odhalí, jestli se kliká na vaše hlavní CTA tlačítko, nebo jestli pozornost krade nějaký jiný prvek.
- Hot zone — místo s vysokou koncentrací kliknutí, typicky tlačítko nebo důležitý odkaz
- Cold zone — oblast bez aktivity, často zbytečné nebo přehlížené části stránky
- Random clicks — rozptýlená kliknutí na nečekaných místech, signál zmatení uživatele
Scroll heatmapa (mapa scrollování)
Ukazuje, jak daleko dolů uživatelé na stránce dojíždějí. Z dat z UX auditů různých nástrojů obvykle vyplývá pokles pozornosti po prvních 50–70 % výšky stránky, takže pokud máte hlavní benefit nebo CTA až dole, většina lidí ho nikdy neuvidí.
Toto je často nejhodnotnější typ heatmapy pro blogové články a landing pages — zjistíte, kde se nachází takzvaný „scroll cliff”, tedy místo, kde nadpoloviční většina návštěvníků odpadne.
Move heatmapa (mapa pohybu kurzoru)
Sleduje pohyb myši po obrazovce. Hotjar například zaznamenává pozici kurzoru každých 100 milisekund. Pohyb kurzoru zhruba koreluje s tím, kam se člověk dívá — ale je to proxy ukazatel, nikoli přesný eye-tracking.
Move heatmapy fungují jen na desktopu. Na mobilu nemá smysl — tam neexistuje kurzor, ale pouze prst.
Rage clicks a dead clicks
Tyto dva typy jsou výjimečně cenné pro hledání chyb. Rage click je opakované zuřivé kliknutí na stejné místo — Hotjar ho definuje jako pět kliknutí během 500 milisekund, PostHog jako tři kliknutí v jedné vteřině. Jasný signál, že něco nefunguje, jak by mělo.
Dead click je kliknutí na prvek, který sice vypadá klikatelně (obrázek, ikona, podtržený text), ale ve skutečnosti není. Microsoft Clarity má pro detekci obou typů samostatné mapy a podle dokumentace Microsoftu jsou nejrychlejším způsobem, jak najít rozbité odkazy nebo matoucí design.
Attention a engagement heatmapy
Modernější typ map, který kombinuje data o klikání, scrollování a době strávené v dané oblasti. Místo holého počtu interakcí ukazuje, kde uživatelé skutečně tráví pozornost. V Hotjaru je k dispozici jako engagement zóna, v Microsoft Clarity jako area map.
Nejlepší heatmap nástroje pro rok 2026
Trh se za poslední dva roky výrazně proměnil. Microsoft Clarity zůstává zdarma s neomezenými relacemi a stal se de facto standardem pro menší a střední weby. Hotjar přepracoval cenovou strukturu a Smartlook se profiluje jako silná volba pro mobilní aplikace.
Microsoft Clarity (zdarma, bez limitů)
Kompletně zdarma, bez omezení počtu relací nebo stránek. Nabízí click heatmapy, scroll heatmapy, area mapy, dead/rage click detekci a session recordings. V roce 2025 přibyly first/last click heatmapy, které pomáhají sledovat vstupní a výstupní body uživatelské cesty.
Háček: Microsoft využívá data Clarity k trénování svých machine learning modelů a vylepšování reklamních služeb. Pro většinu projektů je to akceptovatelný kompromis — pro zdravotnické nebo finanční weby ale Clarity podle podmínek služby používat nesmíte.
Pro koho: startupy, malé a střední weby, projekty s omezeným rozpočtem, mobilní aplikace (Clarity nově podporuje i ty).
Hotjar (od $32–$39 měsíčně, free tier 35 sessions denně)
Veterán trhu a stále nejzralejší řešení pro UX a CRO týmy. Free tier nabízí 35 relací denně. Placený plán Plus startuje od $32 / $39 měsíčně podle aktuálního ceníku, Business od $99 měsíčně.
Silnou stránkou Hotjaru jsou kvalitativní nástroje navíc — surveys, feedback widgety a možnost objednat si moderované user interviews přes Hotjar Engage. Žádný jiný heatmap nástroj nenabízí podobnou hloubku zpětné vazby.
Pro koho: produktové a UX týmy, které chtějí kombinovat heatmapy s dotazníky a interview. Firmy citlivé na soukromí (Hotjar je privacy-first a data nepoužívá k vlastním účelům).
Smartlook (od $55 měsíčně)
Český původ a silná pozice v segmentu mobilních aplikací. Nativní iOS a Android session recordings, touch heatmapy a crash reporty. Free tier nabízí 3 000 relací měsíčně.
Smartlook má pokročilé eventy a funnels, takže funguje i jako lehčí varianta product analytics. V kategorii Microsoft Clarity vs Smartlook obvykle vyhrává Smartlook všude tam, kde potřebujete mobilní aplikace nebo detailnější segmentaci.
Crazy Egg, Mouseflow, FullStory a další
Crazy Egg je klasika z roku 2005, dnes spíše pro menší e-shopy a marketingové týmy, které ocení snadnou instalaci. Mouseflow má silnou analýzu formulářů a friction scoring (od cca $31 měsíčně). FullStory cílí na enterprise s pokročilým autocapture a debugem.
Pro většinu českých webů jsou ale tři top volby Microsoft Clarity, Hotjar a Smartlook. Zbytek trhu vyplňuje specifické niky.
Jak číst data z heatmapy a převést je na akci
Hlavní chyba začátečníků: dívají se na heatmapu, řeknou „aha, hezké” a pak nic neudělají. Heatmapa sama o sobě nezvyšuje konverze. Hodnotu má až ve chvíli, kdy z ní odvodíte konkrétní hypotézu a tu otestujete.
5 konkrétních patternů, které stojí za pozornost
- Hlavní CTA má málo kliknutí, ale vedlejší prvek hodně — vaše tlačítko nemá dostatečnou vizuální váhu, nebo ho přebíjí jiný prvek (často náhodou).
- Rage clicks na konkrétním elementu — UX poplach. Něco je rozbité, pomalé, nebo vypadá klikatelně, ale není.
- Scroll končí před klíčovým obsahem — pokud 70 % lidí nedojíždí k vašemu nejsilnějšímu testimonialu, přesuňte ho výš.
- Kliky rozprostřené bez koncentrace — hierarchie stránky není jasná. Lidé skenují bez pochopení, co mají dělat.
- Dead clicks na obrázku nebo ikoně — uživatelé si myslí, že to je odkaz. Buď to klikatelné udělejte, nebo vizuálně odlište.
Kombinujte heatmapu s dalšími daty
Heatmapa ukazuje co se stalo. Aby měla skutečnou hodnotu, propojte ji s:
- Funnel analýzou v GA4 — funnels ukážou, kde lidé odpadávají; heatmapa proč právě tam.
- Session recordings — video celé návštěvy odhalí kontext, který heatmapa nezachytí.
- On-site dotazníky — když pattern v heatmapě pochopíte jen napůl, zeptejte se uživatelů přímo.
- A/B testem — heatmapa generuje hypotézu, A/B test ji validuje.
Pozor na rozdíly mezi mobilem a desktopem
Patterny chování se na mobilu a desktopu výrazně liší. Mobilní uživatelé scrollují déle a hlouběji (scroll je na dotykovém displeji nízkofrikční pohyb), ale tapy mají horší přesnost — prst má větší dopadovou plochu než kurzor.
Vždy si zobrazujte heatmapy zvlášť pro mobil a zvlášť pro desktop. Agregovaná data zakrývají problémy specifické pro jedno z těchto zařízení.
Praktický postup: jak začít s heatmapou krok za krokem
- Vyberte nástroj podle rozpočtu a typu webu. Pro start zdarma volte Microsoft Clarity. Pokud potřebujete dotazníky, jděte do Hotjaru. Pro mobilní aplikace Smartlook.
- Nainstalujte tracking kód. Vložte JS snippet do hlavičky webu nebo přes Google Tag Manager. U WordPressu většinou stačí oficiální plugin.
- Počkejte na dostatečný vzorek dat. Pro statisticky relevantní heatmapu potřebujete obvykle 1 000–2 000 relací na stránku. U malých webů to může trvat několik týdnů.
- Zaměřte se na kritické stránky. Začněte u homepage, pricing page, hlavních landing pages a checkoutu. Tam má každá optimalizace největší dopad.
- Sepište 3–5 hypotéz z dat. Co konkrétně budete měnit a proč si myslíte, že to zvedne konverzi?
- Spusťte A/B test (pokud máte dost trafficu) nebo udělejte přímou změnu a měřte dopad přes 2–4 týdny.
- Iterujte. CRO není jednorázová akce, ale kontinuální cyklus testování, měření a vylepšování.
Časté chyby při práci s heatmapami
Vyhodnocování dat z příliš malého vzorku. Patterny ze 50 relací neplatí v 500. Počkejte si na dostatečný objem dat — orientačně alespoň 1 000 zobrazení stránky.
Zaměření jen na hot zones. Studené zóny ukazují promarněné příležitosti stejně jasně jako teplé ukazují zájem. Ptejte se i: proč se na tohle nikdo nedívá?
Spoléhání jen na jeden typ heatmapy. Click mapa bez scroll mapy je jako vidět jen půlku obrázku. Kombinujte alespoň tři typy.
Ignorování segmentace. Chování nového a vracejícího se návštěvníka je úplně jiné. Stejně tak desktop a mobil. Vždy filtrujte.
Optimalizace bez hypotézy. Pokud nedokážete před změnou napsat „věřím, že tahle úprava zvedne konverzi o X %, protože Y”, měníte naslepo.
Nejčastější otázky
Co je heatmapa a k čemu slouží?
Heatmapa je vizuální zobrazení uživatelského chování na webu — barevně ukazuje, kam lidé klikají, jak daleko scrollují a co je zaujme. Slouží k pochopení, co na stránce funguje a co tlačí uživatele pryč.
Kolik stojí heatmap nástroj?
Microsoft Clarity je kompletně zdarma bez limitů. Hotjar má free tier (35 relací denně) a placené plány od cca $32–$39 měsíčně. Smartlook startuje na $55 měsíčně. Pro většinu malých a středních webů stačí Clarity.
Kolik návštěv potřebuji, aby data dávala smysl?
Spolehlivá heatmapa potřebuje obvykle 1 000–2 000 relací na konkrétní stránku. U menších webů to může znamenat několik týdnů sběru dat. Klíčové stránky (homepage, pricing) mají obvykle dost rychle, dlouhý ocas článků naopak trvá.
Heatmapa, nebo Google Analytics?
Není to buď, anebo. GA4 vám řekne, co se na webu děje (kolik návštěv, odkud přicházejí, kde odcházejí). Heatmapa odpoví, kde přesně na stránce se to děje. Bez obojího máte jen půlku obrazu.
Jsou heatmapy v souladu s GDPR?
Většina nástrojů (Hotjar, Microsoft Clarity, Smartlook) data anonymizuje a maskuje citlivé informace. Pro plný soulad s GDPR ale potřebujete cookie lištu se souhlasem a zmínku v zásadách ochrany osobních údajů. U Microsoft Clarity navíc berte v potaz, že Microsoft používá data k vlastním účelům.
Jak často mám heatmapy kontrolovat?
Pro klíčové stránky (landing pages, checkout) doporučuji týdenní rytmus, alespoň první měsíc po jakékoli větší změně. U evergreen obsahu stačí jednou za měsíc nebo po výraznější redesignové změně.
Další zdroje:
- Jak číst heatmapy a uživatelská data: UX analýza pro každého – Interval.cz [online]. [cit. 8. 5. 2026]. Dostupné z: https://www.interval.cz/clanky/jak-cist-heatmapy-a-uzivatelska-data-ux-analyza-pro-kazdeho/
- Types of Heatmaps – Hotjar Documentation [online]. [cit. 8. 5. 2026]. Dostupné z: https://help.hotjar.com/hc/en-us/articles/36820020346385-Types-of-Heatmaps
- Click maps – Microsoft Learn [online]. [cit. 8. 5. 2026]. Dostupné z: https://learn.microsoft.com/en-us/clarity/heatmaps/click-maps
- Hotjar vs Microsoft Clarity: Which Should You Use? [2026] – UXHeat [online]. [cit. 8. 5. 2026]. Dostupné z: https://www.uxheat.com/blog/hotjar-vs-clarity
- 5 Real Heatmap Examples in 2026 – Contentsquare [online]. [cit. 8. 5. 2026]. Dostupné z: https://contentsquare.com/guides/heatmaps/examples/
- Conversion Rate Optimization (CRO) Statistics 2026 – Marketing LTB [online]. [cit. 8. 5. 2026]. Dostupné z: https://marketingltb.com/blog/statistics/conversion-rate-optimization-cro-statistics/
- Click Maps: See Where Users Click and Improve UX – Mouseflow [online]. [cit. 8. 5. 2026]. Dostupné z: https://mouseflow.com/blog/click-heatmaps/
- The Complete Guide to Conversion Rate Optimisation (CRO) in 2026 – Apexure [online]. [cit. 8. 5. 2026]. Dostupné z: https://www.apexure.com/blog/conversion-rate-optimisation-guide/