Pokud používáte Hotjar pro analýzu UX, možná jste si všimli nedávného zvýšení cen. Bohužel se tím tento nástroj mohl stát pro některé malé firmy nebo startupy nedostupným. Dopadlo to na hodně UXáků v mém okolí, jelikož tento nástroj využívá opravdu hodně lidí, co znám.
Naštěstí mohu doporučit alternativu, která funguje stejně dobře. Microsoft Clarity.
Hlavní výhoda je, že je zdarma, což je fantastické pro malé podniky a začínající firmy s omezeným rozpočtem, ale i pro velké firmy, které né vždy potřebují všechny funkce Hotjaru a platit tak vysoké ceny. Aktuálně to u některých velkých klientů vyskočilo třeba na 7-10k$ / měsíc. Což se při tlaku na šetření rozhodně těžce obhajuje.
Co umí Microsoft Clarity?
Heatmapy
Kliknutí, zony kliknutí a scroll, takže klasika. Věc, co umí prodat, některé vylepšení i manažerů nebo lidem méně orientovaným na čísla. Dost se mi libí automatická kategorizace kliknutí, jmenovitě:
- Dead clicks – obrazuje, kde uživatelé klikli na stránku bez jakéhokoli efektu/reakce. Další informace o mrtvých kliknutích.
- Rage clicks – zobrazuje, kde uživatelé klikali rychle na stejné malé ploše během krátkého období. Další informace o zběsilých kliknutích.
- Error clicks – zobrazuje kliknutí, ke kterým došlo bezprostředně před chybami JavaScriptu. Další informace o chybách JavaScriptu.
Samotné ovládání nástroje není těžké a jde tím pádem dost rychle naučit.
Nahrávání návštěv
Zde si jde zase filtrovat, segmentovat, označovat jako oblíbené etc.
Můj oblíbený trik, je si udělat speciální segment nahrávek od lidí, co šli třeba na stránku s kontaktem nebo ještě lépe si ho zkopírovali. A pokud mi pak volají, tam se mohu podívat, co si předtím prošli za články etc.
Zajímavá je i funkce LIVE, kde jde vidět aktuální návštěvníky webu. Což mi sice přijde zbytečné, ale má to docela slušný wow efekt, když to člověk ukazuje. Reálná hodnota této funkce se však blíží nule. Ale třeba by to šlo použít, pokud by jste měli někoho na telefonu a potřebovali mu poradit třeba v případě chyby.
Filtrace uživatelů / návštěv
Obecně to má docela slušné filtry v porovnání s ostatními nástroji. Takže si jde udělat docela solidní segment uživatelů. Nejčastěji si vybírám jen Česko a pak přidávám konverzí akce nebo sleduji třeba errory. 
Vlastní štítky / tagy uživatelů.
Stejně jako Hotjar si můžete posílat vlastní eventy / značky k akcím uživatele a tím si třídit třeba B2B zákazníky, nebo lidi, co udělali žádanou akci.
Příklad je třeba měření konverze.
<script>
// init datavé vrstvy Clarity.
window.clarity = window.clarity || function() {
(window.clarity.q = window.clarity.q || []).push(arguments)};
window.clarity(„event“,“click_phone“); // event, aby to bylo vidět
window.clarity(„upgrade“, „click_phone“); // Tohle chci jistě měřit
window.clarity(„set“, „conversion“, „click_phone“); // značení konverze do vlastního štítku.
</script>
Ale třeba i kombinace pro AB testování. Pak je tam i zajímavé funkce porovnání dvou třeba heatmap. Kde si tím pádem můžete udělat i vizuální indicie jako se chovají varianty testu proti sobě.
window.Clarity(„set“, „experiment“, „experiment_<name>_<variant>“)
Co mi tam chybí?
U Hotjaru byl super modul na dotazníky, sice se platil zvlášť byl docela hojně využíván.
Aktuálně zde není lepší napojení na GA4. Zatím se jen párují data, ale chybí mi zde import konverzí nebo dalších metrik jako to šlo u Universal analytics. Takže aktuálně je lepší si tyto věci dělat přes vlastní „štítky / tag“.
Heatmapy neumí hover heat mapy / cursor tracking. tjs místa nad kterými byla myš, ale uživatel nekliknul. Osobně mi to tak moc nechybí.
Jak implementovat Microsoft Clarity?
Na webu https://clarity.microsoft.com/ se přihlásíte a založíte si pro danou doménu projekt.
V Google tag manageru najdete v Templates šablonu oficiální značky Microsoft Clarity – official.
Přidáte tento template do GTM. Pak jdete do značek. Vložíte značku z template, vyplníte ID. Nastavíte pravidla consent, tjs. jen se souhlasem s měření. Pravidla po spuštění, po načtení stránky se souhlasem a nebo v okamžik kdy uživatel dal dostatečný souhlas a měřením.
U vlastních štítku se to pak dělá přes HTML značku. Co může vypadat následovně.
<script>if(window.clarity) {window.clarity(„set“, „conversion“, „copied_contact“); window.clarity(„upgrade“, „copied_contact“)}</script>
V ukázce jsem přidal i „upgrade“ který říká, že tuhle nahrávku bych opravdu chtěl.
Nezapomeňte doplnit i nástroj do vašich stránek o GDPR / ePrivacy.
Zde najdete soupis cookies a další info.
Pohled vývojáře. Clarity je dobře napsané a moc nezatěžuje prohlížeč návštěvníka. Rozdíl po nasazení moc nejde naměřit. Což nejde říci u Hotjaru, co umí o 5-15% zpomalit celý web.
Videa o Microsoft Clarity
Porovnání Hotjaru a Microsoft Clarity
Krátky tutorial:
Hotjar vs Microsoft
Hotjar vysvětluje, jak je ten jediný dokonalý nástroj:
https://www.hotjar.com/blog/hotjar-vs-microsoft-clarity/
Reakce Microsoftu na tento článek 😀 .
https://clarity.microsoft.com/blog/clarity-vs-hotjars-free-forever-plan-2022/
Reakce na dalších nástrojů
https://www.fullsession.io/blog/hotjar-vs-microsoft-clarity/
Další porovnání:
https://blog.loginradius.com/growth/hotjar-vs-microsoft-clarity/
Co je důležité, tak Microsoft na tomto nástroji aktivně pracuje a vyvíjí ho.
https://clarity.microsoft.com/blog/
Pozor na nebezpečné nástroje
Zároveň bych chtěl nedoporučit využívat Yandex Metric. Před 10-12 lety šlo tento nástroj doporučit, ale pak už se jen zvyšovalo riziko. A posledních 10 let bych tento nástroj nedoporučil a poslední roky bych ho vysloveně zakázal používat. Tím, že dělá heatmapy a záznamy návštěv, tak odesílá do Ruska i data vašich uživatelů a často i obsahy polí, co vyplňuje uživatel. Z toho důvod to je velmi nebezpečné. Navíc zde samozřejmě bude i problém s tím, že data nemusím a nezůstávají v Evropské unii. Bohužel, je tu stále pár lidí v online marketingu, co tato rizika ignorují a nástroj doporučují svým klientů.
Je na tom Microsoft Clarity lépe? Ano, Microsoft je dost kontrolován a dodržuje GDPR.
Mé zkušenosti
Nástroj Microsoft Clarity mám jak na svém webu, tak na webech několika klientů. Dříve jsem všude měl Hotjar, dneska jako první volbu má Clarity a až nestačí, tak teprve po tom přemýšlíme o Hotjaru. Tím že je Clarity zdarma a zvládá i velké objemy, tak ho mohu postit ti na HP velkých webech, zatím co u Hotjaru si to nemohu dovolit. Chcete se firmě zaplatit? Domluvte nahrazení Hotjaru Clarity.
Jsou i firmy, co se jim povedlo zachovat staré smlouvy a mají třeba 95% slevu 🙂 , ty si Hotjar mohou nechat.
Co na to říká CRO a UX expert Ondřej Ilinčev?
Hotjar používají lidi už jen ze setrvačnosti a předpovídám mu strmý pád. Ty tam jsou doby, kdy se pozicovali jako levná alternativa integrující více funkcí. Pamatuji si doby, kdy stál Hotjar 7 dolarů a měl v sobě trychtýře, analytiku formulářů a neomezené dotazníky. Už pár let škrtají funkce a výrazně zdražují, naposled udělali z dotazníků vlastní produkt, kde si předplácíte počet odpovědí.
Opuštěný prostor elegantně vyplnil Microsoft, který kvůli anonymizovanému sběru dat dává zdarma k dispozici nástroj Clarity. Nejen, že funkce a vylepšení přidává, ale nemá žádné omezení návštěvnosti. Což se hodí pro velké weby, ale i pro weby, kde se chcete dostat k videu konkrétního uživatele (třeba proto, že si vám stěžoval na chybu v objednávce).
To málo, co bych Clarity vytknul je:
- Neintuitivní používání masek (regex) pro výběr heatmap.
- Nemožnost vynechat element podle ID (hodí se pro cookies lišty).
- Občas nesprávné renderování stránky s heatmapou.
Ale ten seznam mých výtek se postupně zmenšuje, hodně šlapou do vývoje a poslouchají zpětnou vazbu.
Aktuálně je to pro mě go-to nástroj pro heatmapy a videa uživatelů.
Co na to říká Michal Blažek?
(Po domluvě s Michalem jsem přidal jeho komentář z Facebooku)
Clarity je super ale má jeden zásadní problém. U cca každého třetího projektu v náhledu nezpracuje nějaký stylesheet. Takže je to rozsypaný čaj. Hotjar i Smartlook, ten samý web v pohodě. Styl není blokovány v robots ani jinde. Podpora nepomohla. O webech na JS frameworku ani nemluvím.
Závěr
Mohu tento nástroj doporučit? Rozhodně ANO.
PS: S tím jakou má světlou budoucnost Bing, tak doporučuji i registrovat Bing Webmaster Tools.
Update 2024-03-28
Generate session Insights
Za mě super věc, co ukazuje budoucnost analytiky.
Core web vitals
Výsledky vašeho webu pro core web vitals.
