Már régen várt fejlesztés érkezett a Google Tag Managerbe, a láthatóság mérése. Mostantól nem csak azt tudjuk mérni, hogy hányan scrollozták végig az oldalt (25-50-75-100%), hanem azt is, hogy az oldalunk egy adott eleme hányszor volt ténylegesen látható.
Mire használható a láthatóság mérése
Nemrég olvastam egy google fejlesztő blogján, hogy a jelenlegi pageview mérés elavult. 10-15 éve még elegendő volt akkor mérni egy oldalletöltést amikor az oldal betöltődött, de azóta nagyon sok minden változott. Teljesen máshogy épülnek fel a weboldalak, teljesen máshogy működnek. Megjelentek a PWA-k (progressive web app), SPA-k (single page application), amiknél a korábbi oldalletöltés mutató nem tükrözi jól a valós oldal használatot.
Egy példa
Vegyük csak alapul a facebookot. A legtöbb embernél az oldal a háttérben folyamatosan nyitva van és mellette böngészik az új ablakban. Ha új értesítést kap, akkor visszamegy az oldalra, majd ismét másik ablakban dolgozik. Tegyük fel magunknak a kérdést: ilyen esetekben tényleg csak egy oldalletöltést kell számolnunk? Vagy ahányszor visszamegy, annyiszor egyet?
A megoldás
Mi lenne, ha ahelyett, hogy hányszor töltődött be egy oldal, azt is mérnénk, hányszor lett megnézve? A Page_Visibility_API segítségével ezt könnyedén megtehetjük. Ez az api egy EventListener segítségével figyeli az oldal állapotát. Ha aktív az oldal, akkor a visibilityState Visible változót kap, ha nem aktív akkor hidden. A visibiltyChange event segítségével megtehetjük, hogy az oldalletöltést akkor és annyiszor küldjük az Analyticsnek, amikor az oldal látható és aktív.
A PageVisibility előnyei
- Az api alkalmazásával könnyedén kideríthetjük, hogy hányszor töltődött be az oldalunk úgy, hogy az sose volt aktív!
- Valójában hányszor nézték meg az oldalt egy oldalletöltés alatt.
- Hányan tették az oldalt háttérbe és aztán feledkeztek meg róla.
- Erőforrást spórolhatunk, ha nem terheljük a szervert olyankor amikor az oldal nem is aktív.
Elem láthatóság GTM-ben
Ha nem szeretnénk API-val bajlódni, megoldhatjuk mindezt GTM-en keresztül is. Mielőtt rátérnénk a beállításokra nézzük néhány példát, mire is lehet használni ezt a triggert. Arról van tehát szó, hogy megadhatunk bizonyos elemet, elemeket, amik ha a böngésző látható területére kerülnek, akkor a trigger “elsül” és meg tudjuk mérni az adott elem(ek) hányszor jelentek meg úgy hogy a felhasználó biztos látta őket.
Kétféle módon tudunk azonosítani egy elemet: ID alapján, vagy CSS selectorral. Ha például kíváncsiak vagyunk arra, hogy az oldalunkon elhelyezett billboard reklámnak milyen a láthatósága, akkor egyszerűen beállítunk rá egy CSS selectort mondjuk így: “div.billboard” és ha ez a div látótérbe kerül, lefut a trigger.
Sőt, egyszerre akár többet is megadhatunk vagy kapcsolattal. Vagy azt is megadhatjuk, hogy csak akkor hívódjon meg, ha bizonyos ideig – mondjuk legalább 5 másodpercig – látótérben volt a reklámzóna.
Számomra az egyik leghasznosabb funkció, hogy ezzel olyan HTML elemet is mérni tudunk az oldalon, ami alapból nem töltődik be, csak ha bizonyos feltétel teljesül. Például csináltam ide egy rejtett div-et, ami csak akkor jelenik meg, ha rákattintasz erre a gombra:
Hogyan állítsd be
GTM – Element visibility trigger beállítása
Új tag létrehozásakor válaszd az Element Visibility-t. A beállításban válaszd ki, hogyan szeretnéd azonosítani az elemet, ID vagy CSS alapján.
GTM – Element visibility trigger beállítása 2.
[…] A méréshez szükséges minden kódot Google Tag Manager (GTM) segítségével helyezünk el az oldalban. Ha nem hallottál még róla, akkor ne is olvass tovább, ez a cikk nem neked szól. Tudom ajánlani kezdésnek a Láthatóság mérése cikket. […]