Microsoft Clarity și testul A/B în magazinul online: heatmap și GA4

Microsoft Clarity îți arată unde dau clic și până unde derulează clienții magazinului online, prin hărți termice (heatmap) și înregistrări ale sesiunilor, iar testul A/B îți dovedește dacă o schimbare aduce mai multe comenzi. Începe cu pasul din pâlnie unde pierzi cei mai mulți oameni. Ca să vezi un salt al conversiei de la 2% la 2,4% îți trebuie în jur de 21.100 de vizite pe fiecare versiune.

Articolul este scris de echipa CloudCart, platforma eCommerce fondată în Bulgaria. Datele despre Clarity și Google au link către documentația oficială, iar funcțiile CloudCart sunt cele descrise pe paginile Analize și Coș și Checkout.

Ce este Microsoft Clarity și ce arată harta termică

Microsoft Clarity este un instrument pentru comportamentul vizitatorilor: înregistrează sesiunile, face hărți termice și marchează singur momentele în care clientul s-a împotmolit. Clarity nu are abonament și nici limită de trafic, iar înregistrările nu sunt un eșantion din vizite (Microsoft Clarity FAQ).

Harta termică (heatmap) este o imagine a paginii pe care zonele cu multe clicuri sau cu atenție lungă sunt colorate în tonuri calde. Pentru un magazin online contează două hărți: harta de clicuri și harta de derulare (scroll), care arată ce procent din vizitatori ajunge la fiecare înălțime a paginii. O înregistrare de sesiune este reluarea unei singure vizite: mișcările, clicurile și derularea unui client de la intrare până la ieșire.

Clarity marchează automat trei semnale care, într-un magazin, indică aproape mereu o problemă:

• Clic nervos (rage click). Clientul apasă de multe ori, repede, în același loc. De obicei butonul răspunde greu sau deloc.
• Clic mort (dead click). Clientul apasă pe ceva ce pare clicabil, iar pagina nu reacționează. Exemple tipice: o poză care nu se mărește sau textul „livrare” care nu e link.
• Derulare excesivă. Clientul trece prin pagină mult mai repede decât ar citi, pentru că caută ceva și nu găsește.

Analizele magazinului îți spun la ce pas pierzi clientul, iar Clarity îți arată de ce. De aceea cele două se folosesc împreună: cifrele pentru pâlnie și conversia normală sunt în articolul rata de conversie în magazinul online: formulă, medie și 20 de pași, iar aici afli cum găsești cauza și cum verifici reparația.

Limitele Clarity pe care e bine să le știi

Ce	Limită
Înregistrări de sesiuni	până la 100.000 de sesiuni pe proiect pe zi
Păstrarea înregistrărilor	30 de zile; cele marcate ca favorite și un eșantion aleatoriu, până la 9 luni
Harta termică	până la 100.000 de afișări de pagină pe hartă; disponibilă până la 9 luni
Număr de site-uri și membri în echipă	fără limită
Câmpurile de completat (email, telefon, adresă)	mascate mereu, nu ajung în Clarity

Sursa: Microsoft Clarity FAQ (linkul de mai sus). Pentru că înregistrările se păstrează 30 de zile, marchează ca favorite sesiunile de care vei avea nevoie pentru comparație după test.

Cum instalezi Microsoft Clarity în CloudCart prin Google Tag Manager

Cel mai sigur mod de a pune Clarity în CloudCart este aplicația Google Tag Manager: codul se gestionează dintr-un singur loc, iar consimțământul clientului ajunge și la el. Aplicația este inclusă în fiecare plan. În paranteză vezi unde se face fiecare pas:

1. Proiect în Clarity (clarity.microsoft.com). Intră în cont și adaugă un proiect nou cu domeniul magazinului. ID-ul proiectului apare în adresa din browser: clarity.microsoft.com/projects/view/ID/.
2. Container în GTM (tagmanager.google.com). Dacă nu ai încă unul, creează un container de tip „Web” pentru domeniu. Copiază ID-ul în formatul GTM-XXXXXXX.
3. Aplicația în CloudCart (panoul de administrare). Aplicații → Google Tag Manager, lipește GTM-ID-ul și salvează. CloudCart adaugă codul containerului pe fiecare pagină a magazinului. Configurarea completă, împreună cu GA4 și stratul de date, este în articolul Google Tag Manager și GA4 pentru magazin online.
4. Eticheta Clarity (GTM). Ai două variante. Cea rapidă: în Clarity deschide Settings → Setup → Google Tag Manager → Finish setup, intră cu contul Google, alege contul și containerul și apasă Create and publish. Cea manuală: în GTM apasă New Tag, alege din Community Template Library șablonul Microsoft Clarity - Official, introdu ID-ul proiectului și setează declanșatorul All pages.
5. Publicarea (GTM). Apasă Submit → Publish și dă versiunii un nume clar, de exemplu „Clarity”. O etichetă se leagă de un singur proiect Clarity.
6. Verificarea (magazinul). Deschide magazinul într-o fereastră nouă și treci prin două-trei pagini. Înregistrările apar în Clarity aproape imediat, iar hărțile termice se adună pe măsură ce vin vizite.

Pașii urmează ghidul Microsoft Learn: How to install Clarity on Google Tag Manager. Codul se poate pune și în Design → Custom CSS/JS, dar acolo nu există verificare, iar un script greșit blochează imediat magazinul, așa că alege GTM.

Ai nevoie de consimțământ pentru Microsoft Clarity: GDPR, cookie-uri și mascare

Da, pentru vizitatorii din România și din restul UE, Clarity cere un semnal de consimțământ. De la 31 octombrie 2025, Clarity aplică cerința pentru vizitele din Spațiul Economic European, Regatul Unit și Elveția: pentru ele, modul de consimțământ este activ implicit, iar Clarity așteaptă un semnal valid înainte să pună cookie-uri (Microsoft Learn: Consent Mode în Clarity).

Ce înseamnă asta în practică: fără consimțământ, Clarity nu pune cookie-urile _clck și _clsk, iar tocmai _clsk leagă paginile unei vizite într-o singură înregistrare. Dacă clientul deschide un produs și apoi coșul, Clarity vede două sesiuni separate. Afișările și clicurile de bază se numără, dar drumul complet până la comandă lipsește.

Baza legală este aceeași pentru toate cookie-urile de statistică. În România, Legea 506/2004 permite stocarea de informații pe dispozitivul vizitatorului doar cu acordul lui sau atunci când e strict necesară pentru serviciul cerut de el. Ce trebuie să conțină bannerul de cookie-uri și politica magazinului afli din articolul GDPR și cookie-uri pentru magazinul online.

Cum trimiți consimțământul către Clarity din CloudCart

Clarity citește semnalele Google Consent Mode (ad_storage și analytics_storage) fără altă configurare (Microsoft Learn: Google Consent Mode in Clarity). Aplicația GDPR din CloudCart trimite exact aceste semnale, așa că acordul ajunge la Clarity fără cod:

1. Aplicația GDPR (panoul de administrare). Aplicații → GDPR, activeaz-o și în tabul Cookies alege bara sau fereastra pentru cookie-uri.
2. Grupul Google Consent Mode (panoul de administrare). În același tab pornește grupul Google Consent Mode. Implicit este oprit, iar la pornire îți confirmi alegerea. Din acel moment magazinul trimite semnalele de consimțământ înainte să se încarce Google Tag Manager.
3. Cookie-urile Clarity în politică (panoul de administrare). CloudCart nu scanează singur cookie-urile. În grupul Performance Cookies (cookie-urile de statistică) adaugă un cookie cu numele „Microsoft Clarity”, o descriere scurtă („înregistrări ale sesiunilor și hărți termice”) și numele tehnice _clck, _clsk. Așa clientul vede pentru ce își dă acordul.
4. Cookie-urile implicite (Clarity). În proiectul Clarity deschide Settings → Setup și oprește punerea implicită a cookie-urilor. Astfel Clarity așteaptă acordul fiecărui vizitator, nu doar al celor din UE.
5. Verificarea (magazinul). Șterge cookie-urile, deschide magazinul și refuză. În consola browserului rulează clarity('metadata', (d, upgrade, consent) => { console.log(consent); }, false, true, true);. Trebuie să vezi analytics_storage: "DENIED" și să nu existe cookie-urile _clck și _clsk. După „Accept” valorile devin GRANTED.

Mascarea: ce nu înregistrează Clarity

Clarity maschează conținutul sensibil chiar în browser, iar datele mascate nu ajung pe serverele sale. Modul implicit este Balanced: sunt mascate cifrele și adresele de email din text. Strict maschează tot textul, iar Relaxed nu maschează textul. Câmpurile de completat și listele derulante sunt mascate în toate modurile (Microsoft Learn: Masking content).

Pentru un magazin online, Balanced este un început bun. Dacă pagina de mulțumire sau contul clientului afișează numele și adresa ca text simplu, adaugă-le în Settings → Masking → Mask by element cu selectorul CSS al blocului. Schimbarea se aplică înregistrărilor noi, la cel mult o oră după salvare, și nu maschează înregistrările vechi.

Cum citești hărțile termice și înregistrările ca să găsești problema

Harta termică îți arată unde e problema pe o pagină, iar înregistrarea îți arată de ce apare. Lucrează în ordinea asta:

1. Găsește pasul cu cea mai mare pierdere. În CloudCart deschide Analize și compară în pâlnia de conversie Desktop cu Mobile: Coș → Comandă începută → Comenzi. Pasul care pierde cel mai mult este primul de verificat. Rapoartele sunt descrise pe pagina Analize CloudCart.
2. Deschide harta termică exact a acelei pagini. Pentru produs, uită-te la harta de derulare pe telefon: ce procent din oameni ajunge la butonul de cumpărare. Pentru coș, uită-te la clicurile pe costul livrării și pe codul de reducere.
3. Filtrează înregistrările. Alege sesiunile cu coșul vizitat, fără comandă, pe telefon, cu clicuri nervoase sau moarte. Urmărește 20 până la 30 la rând.
4. Notează ce se repetă. După vreo zece înregistrări problema se vede: un câmp care dă eroare, un buton sub prima ecranare, un cost de livrare care apare abia la ultimul pas.
5. Scrie o ipoteză. În forma „Dacă [schimbarea], [indicatorul] va crește, pentru că [ce ai văzut în înregistrări]”.

Dacă înregistrările arată încărcare lentă (ecran gol, poze care apar târziu), repară întâi viteza: pașii sunt în articolul despre PageSpeed și Core Web Vitals pentru magazinul online.

Ce testezi primul în magazinul online

Testează întâi schimbarea de la pasul cu cea mai mare pierdere, care atinge cei mai mulți vizitatori și se face cel mai repede. Tabelul leagă semnalul tipic din Clarity de o ipoteză și de locul din CloudCart unde faci schimbarea:

Ce vezi în Clarity	Ipoteza	Ce schimbi în CloudCart	Ce măsori
Clicuri nervoase pe costul livrării în coș	Clientul nu știe cât plătește și cât mai are până la livrarea gratuită	Pragul de livrare gratuită și BumpCart, care arată cât mai lipsește până la prag	Coș → comandă începută; valoarea medie a comenzii
Pe telefon, sub 50% ajung la butonul de cumpărare	Ce contează e sub prima ecranare	Ordinea blocurilor pe pagina produsului din design; o descriere mai scurtă sus	Adăugări în coș la 100 de vizite pe produs
Clicuri moarte pe poza produsului	Oamenii vor să vadă detaliul	Mai multe poze și mai mari în catalog	Adăugări în coș
Renunțări la pasul de plată	Lipsește metoda de plată preferată	Ramburs plus card, Apple Pay și Google Pay cu CloudCart Pay; buton express pe produs	Comandă începută → comandă
Derulare excesivă în categorie și căutări fără clic	Clientul nu găsește produsul	Filtrele din categorie; raportul Aura Search pentru căutările fără rezultat	Căutări cu clic; comenzi după căutare
Coș abandonat după completarea emailului	Clientul amână decizia și poate reveni	Momentul trimiterii emailului de coș abandonat și codul din el	Coșuri recuperate

Costul livrării văzut prea târziu este printre primele lucruri de căutat în înregistrările coșului. Cum alegi pragul după valoarea medie a comenzii și tarifele curierilor afli din articolul pragul pentru livrare gratuită. Coșul și pașii comenzii în CloudCart sunt pe pagina Coș și Checkout, iar emailurile pentru comenzile nefinalizate sunt pe pagina coșuri abandonate.

Câte vizite îți trebuie pentru un test A/B

Testul A/B (A/B testing) compară două versiuni ale aceleiași pagini, afișate în același timp unor grupuri de vizitatori alese la întâmplare. Numărul de vizite depinde de conversia de acum și de cât de mare e efectul pe care vrei să-l detectezi: cu cât schimbarea e mai mică, cu atât îți trebuie mai mult trafic.

Conversia de acum	Efect +20%	Efect +30%	Efect +50%
1% (comenzi din vizite)	42.700	19.800	7.750
2%	21.100	9.800	3.830
3%	13.900	6.460	2.520
10% (adăugare în coș)	3.840	1.770	690
30% (coș → comandă)	960	440	160

Cifrele sunt vizite pentru fiecare dintre cele două versiuni, calculate cu formula standard pentru compararea a două procente, la un nivel de încredere de 95% și o putere a testului de 80%. Efect +20% la o conversie de 2% înseamnă o creștere până la 2,4%.

Cum folosești tabelul

• Calculează durata. Vizitele pentru o versiune × 2, împărțite la vizitele zilnice ale paginii. Un magazin cu 1.000 de vizite pe zi și conversie de 2% are nevoie de aproximativ 42 de zile ca să vadă +20%.
• Măsoară pasul cel mai apropiat. Dacă testezi pagina produsului, măsoară adăugarea în coș (în jur de 10%), nu comanda din toate vizitele. Traficul necesar scade de aproximativ 5 ori.
• Testează schimbări curajoase. Un magazin mic nu poate dovedi +5%. Poate dovedi +30% până la +50%, iar un asemenea efect vine din livrare, plată și primul ecran pe telefon, mai rar din culoarea butonului.
• Minimum 2 săptămâni întregi. Așa testul trece prin toate zilele săptămânii.

Ca să vezi cât valorează testul în bani, un exemplu calculat, nu de la un magazin real: 1.000 de vizite pe zi, conversie 2% și o comandă medie de 45 € înseamnă 20 de comenzi și 900 € pe zi. Un câștig dovedit de +20% aduce 4 comenzi în plus, adică 180 € pe zi și în jur de 5.400 € pe lună, din același trafic.

Dacă traficul nu ajunge pentru un test A/B adevărat, compară secvențial: 4 săptămâni înainte și 4 săptămâni după schimbare, în Analize, separat pentru telefon și calculator. Alege cele două perioade din calendar sau folosește comparația cu perioada anterioară, dacă planul tău o include. Metoda este descrisă pe larg în articolul despre rata de conversie. Dacă traficul vine din reclame, marchează-l cu parametri UTM, ca să compari aceleași surse înainte și după: parametri UTM și atribuire pentru magazinul online.

Cum faci un test A/B cu GA4 după închiderea Google Optimize

GA4 măsoară rezultatul testului A/B, dar nu împarte vizitatorii în grupuri. Google Optimize, instrumentul Google pentru teste A/B, s-a oprit la 30 septembrie 2023, iar toate experimentele active s-au încheiat atunci. Google trimite către instrumente externe conectate la Google Analytics, precum AB Tasty, Optimizely și VWO (Google: Sunset of Google Optimize).

Sarcina	Unde se face
Împărțirea vizitatorilor în versiunea A și B și afișarea versiunii	Instrumentul de teste A/B; scriptul lui se pune prin GTM în CloudCart
Comenzile, adăugările în coș, comenzile începute	GA4, care primește evenimentele e-commerce din aplicația Google Analytics din CloudCart
De ce câștigă sau pierde o versiune	Clarity: înregistrările și hărțile termice ale celor două versiuni
Verificarea că cifrele generale ale magazinului au crescut	Analize CloudCart: conversie, pâlnie, valoarea medie a comenzii

Leagă Clarity și de GA4 din setările proiectului Clarity: integrarea cu Google Analytics este descrisă în Clarity FAQ și cere ca Clarity să fie deja instalat. Ca să vezi separat înregistrările fiecărei versiuni, adaugă o etichetă personalizată în șablonul Clarity din GTM (câmpurile Custom tag Key și Value), de exemplu cheia „variant”, a cărei valoare („A” sau „B”) vine de la instrumentul de teste printr-o variabilă GTM, și filtrează înregistrările după ea.

Scriptul instrumentului de teste trebuie să stea în același grup de consimțământ ca Clarity și GA4. Altfel, clientul care a refuzat statistica va fi totuși repartizat într-o versiune și va strica comparația.

Greșeli la testele A/B și la hărțile termice

• Oprirea testului după prima săptămână bună. Rezultatele de la început sar în sus și în jos. Decide doar după ce atingi traficul din tabel și minimum 2 săptămâni întregi.
• Mai multe schimbări într-o versiune. Dacă versiunea cu trei schimbări câștigă, nu știi care a ajutat.
• Test în timpul unei promoții. Black Friday, sărbătorile și o campanie nouă de reclame schimbă comportamentul mai mult decât orice reparație. Fă schimbările în Checkout cu cel puțin 2 săptămâni înainte de o promoție mare și nu porni un test nou în săptămâna promoției.
• Hartă termică doar pe calculator. Pe telefon prima ecranare se termină în alt loc, iar butonul vizibil pe calculator poate ajunge sub ea. Verifică ponderea telefoanelor în raportul de sesiuni pe dispozitiv din Analize și uită-te separat la hărțile de pe Mobile.
• Clarity fără consimțământ. Fără grupul Google Consent Mode, sesiunile din UE se rup în pagini separate și nu mai vezi drumul până la coș.
• Decizie după o singură înregistrare. Un client nervos este o întâmplare. Problemă este ceea ce vezi în cel puțin 5 din 20 de înregistrări.

Întrebări frecvente

Ai o întrebare despre Clarity, Google Tag Manager sau consimțământul din magazinul tău? Scrie-ne la support@cloudcart.com.