Tri Core Web Vitals u 2026.

Google mjeri tri primarne terenske metrike za iskustvo stranice. Svaka ima prag za "Dobru" izvedbu:

• Largest Contentful Paint (LCP) — vrijeme renderiranja najvećeg vidljivog elementa. Dobro: ispod 2,5 sekundi.
• Interaction to Next Paint (INP) — odzivnost na sve korisničke interakcije (zamijenio FID u ožujku 2024.). Dobro: ispod 200 ms.
• Cumulative Layout Shift (CLS) — vizualna stabilnost tijekom učitavanja. Dobro: ispod 0,1.

Banner za pristanak koji blokira renderiranje, pokreće teški JavaScript pri učitavanju ili ubacuje kasne promjene izgleda može gurnuti bilo koji od ovih u pojas "Treba poboljšanje" ili "Loše" — a Google koristi 28-dnevne terenske podatke od stvarnih korisnika Chromea, pa prijelazni problemi postaju trajni signali rangiranja.

Kako banneri za pristanak štete LCP-u

Largest Contentful Paint obično se aktivira na hero slici ili naslovu. Nekoliko uzoraka pristanka nepotrebno ga odgađa:

CMP skripte koje blokiraju renderiranje

Sinkrono učitavanje CMP-a iz zaglavlja dokumenta zaustavlja raščlanjivanje HTML-a dok se skripta ne preuzme i ne izvrši. Ako je CMP smješten na sporom CDN-u ili s hladnim priručnikom, možete dodati 200-800 ms LCP-u globalno.

Banner koji pokriva hero

Ako je banner za pristanak pozicioniran kao modalni prekrivač koji pokriva LCP element, preglednici će svejedno mjeriti LCP od pokrivenog elementa. Međutim, ako je banner najveći naslikani element, postaje LCP kandidat — a ako se renderira putem JavaScript-a nakon učitavanja stranice, LCP je umjetno visok.

Rješenje: asinkrono učitavanje s malim inline bootstrapom

Učitajte cijeli CMP asinkrono (`async` ili `defer`), samo s malom inline skriptom za početni prikaz bannera. Ciljajte bootstrap manji od 5 KB komprimiran. Cijela logika ponašanja, popisi dobavljača i UI chrome mogu se lijen-učitavati nakon prvog iscrtavanja.

Kako banneri za pristanak štete INP-u

Interaction to Next Paint mjeri najgore vrijeme odziva na sve klikove, dodire i pritiske tipki tijekom sesije. Interakcije pristanka na kolačiće često su prva interakcija korisnika — pa spor gumb Prihvati ruinira rezultat.

Teški rad na prihvaćanju

Mnogi CMP-ovi izvršavaju sinkroni rad na prihvaćanju: učitavaju 40+ skripti dobavljača, pišu u localStorage, pokreću dataLayer događaje, aktiviraju ažuriranja Google Consent Mode-a. Ako to prelazi 200 ms, INP pati.

Rješenje: red čekanja rada nakon iscrtavanja

Na klik Prihvati, odmah sakrijte banner i rasporedite teški rad s `requestIdleCallback` ili `setTimeout(0)`. Korisnik vidi banner kako trenutno nestaje; skripte dobavljača učitavaju se u pozadini bez blokiranja interakcije.

Kako banneri za pristanak štete CLS-u

Cumulative Layout Shift prati neočekivano vizualno kretanje. Banneri su klasičan izvor CLS-a kada se ubacuju u DOM nakon što je sadržaj naslikan.

Kasno ubacivanje bannera

Ako se banner pojavi 800 ms nakon LCP-a, gura sadržaj prema dolje i generira pomak izgleda. Čak i mali banner može pokrenuti CLS rezultat 0,1+ ako utječe na veliki dio vidnog polja.

Ponovnog renderiranje widgeta za preferencije kolačića

Widgeti za preferencije u podnožju koji asinkrono učitavaju logotipe dobavljača mogu višestruko reflowati cijelo podnožje, povećavajući CLS.

Rješenje: rezervirajte prostor unaprijed

Koristite CSS za rezerviranje prostora bannera od samog prvog iscrtavanja — rezervno mjesto fiksne visine, `min-height` na podnožju ili banner fiksiran na dnu koji ne gura sadržaj. Moderni CMP-ovi trebali bi ponuditi konfiguraciju bez CLS-a odmah.

Google Consent Mode V2 i izvedba

Consent Mode V2 omogućuje Google tagovima da se pokreću u stanju bez kolačića prije pristanka, prosljeđujući signale putem `gtag('consent', 'default', {...})`. To je odlično za kontinuitet mjerenja, ali sama gtag.js biblioteka je 50-90 KB. Učitajte je asinkrono i postavite zadane vrijednosti što ranije kako biste izbjegli uvjete utrke.

• Postavite zadane vrijednosti prije učitavanja gtag-a — stavite zadani poziv pristanka u zaglavlje, prije skripte gtag.js.
• Koristite `analytics_storage: 'denied'` kao zadano — minimizira podatke prikupljene prije pristanka.
• Ažurirajte pri prihvaćanju putem requestIdleCallback — izbjegavajte blokiranje glavne niti.

Mjerenje utjecaja CMP-a na Core Web Vitals

Ne nagađajte — mjerite. Koristite ove alate za kvantificiranje utjecaja vašeg bannera:

• PageSpeed Insights — terenske podatke iz Chrome UX izvješća plus laboratorijsku Lighthouse reviziju. Usporedite rezultate s i bez CMP skripte.
• Web Vitals Chrome proširenje — prekrivač LCP, INP, CLS u stvarnom vremenu tijekom lokalnog testiranja.
• WebPageTest.org — filmski pojas i pogled vodopada koji pokazuje točno kada se banner renderira i što blokira.
• Izvješće Core Web Vitals Search Console-a — 28-dnevni terenske podatke grupirani po uzorku URL-a. Provjerite dobivaju li odredišne stranice s vašim bannerom drugačije rezultate od stranica bez njega.

Kako FlexyConsent ostaje brz