Els tres Core Web Vitals el 2026

Google mesura tres mètriques de camp primàries per a l'experiència de pàgina. Cada una té un llindar per al rendiment "Bo":

• Largest Contentful Paint (LCP) — temps per renderitzar l'element visible més gran. Bo: menys de 2,5 segons.
• Interaction to Next Paint (INP) — capacitat de resposta a totes les interaccions de l'usuari (va substituir FID el març de 2024). Bo: menys de 200 ms.
• Cumulative Layout Shift (CLS) — estabilitat visual durant la càrrega. Bo: menys de 0,1.

Un banner de consentiment que bloqueja el renderitzat, executa JavaScript pesant en la càrrega o injecta canvis tardans en el disseny pot empènyer qualsevol d'aquests cap a la banda "Necessita millora" o "Deficient" — i Google utilitza dades de camp de 28 dies d'usuaris reals de Chrome, de manera que els problemes transitoris es converteixen en senyals de classificació persistents.

Com els banners de consentiment perjudiquen el LCP

El Largest Contentful Paint normalment s'activa en una imatge hero o titular. Diversos patrons de consentiment el retarden innecessàriament:

Scripts CMP que bloquegen el renderitzat

Carregar el CMP de manera síncrona des del cap del document atura l'anàlisi d'HTML fins que l'script es descarrega i s'executa. Si el CMP s'allotja en un CDN lent o té caché freda, pots afegir 200-800 ms al LCP globalment.

Banner que cobreix l'element hero

Si el banner de consentiment es posiciona com a superposició modal cobrint l'element LCP, els navegadors encara mesuraran el LCP de l'element cobert. No obstant això, si el banner és l'element pintat més gran, es converteix en el candidat LCP — i si es renderitza via JavaScript després de la càrrega de la pàgina, el LCP és artificialment alt.

Solució: Càrrega asíncrona amb un petit bootstrap en línia

Carrega el CMP complet de manera asíncrona (`async` o `defer`), amb només un petit script en línia per a la visualització inicial del banner. Apunta a un bootstrap de menys de 5 KB comprimit amb gzip. La lògica de comportament completa, les llistes de proveïdors i l'UI chrome es poden carregar de manera diferida després del primer pintat.

Com els banners de consentiment perjudiquen l'INP

L'Interaction to Next Paint mesura el pitjor temps de resposta en tots els clics, tocs i pulsacions de tecles durant una sessió. Les interaccions de consentiment de galetes sovint són la primera interacció que fa un usuari — per tant, un botó d'Acceptar lent arruïna la puntuació.

Treball pesat en Acceptar

Molts CMP executen treball síncron en Acceptar: carregant més de 40 scripts de proveïdors, escrivint a localStorage, disparant esdeveniments dataLayer, activant actualitzacions de Google Consent Mode. Si això supera els 200 ms, l'INP pateix.

Solució: Posa en cua el treball després del pintat

En fer clic a Acceptar, amaga immediatament el banner i programa el treball pesat amb `requestIdleCallback` o `setTimeout(0)`. L'usuari veu que el banner desapareix instantàniament; els scripts de proveïdors es carreguen en segon pla sense bloquejar la interacció.

Com els banners de consentiment perjudiquen el CLS

El Cumulative Layout Shift rastreja el moviment visual inesperat. Els banners són una font clàssica de CLS quan s'injecten al DOM després que el contingut s'ha pintat.

Injecció tardana de banner

Si el banner apareix 800 ms després del LCP, empeny el contingut cap avall i genera un canvi de disseny. Fins i tot un banner petit pot desencadenar una puntuació CLS de 0,1+ si afecta una gran part de la finestra visible.

Redibuidats del widget de preferències de galetes

Els widgets de preferències del peu de pàgina que carreguen logotips de proveïdors de manera asíncrona poden redistribuir tot el peu de pàgina múltiples vegades, acumulant CLS.

Solució: Reserva espai d'entrada

Utilitza CSS per reservar l'espai del banner des del primer pintat — un marcador de posició d'alçada fixa, `min-height` al peu de pàgina o un banner fixat a la part inferior que no empenyi el contingut. Els CMP moderns haurien d'oferir una configuració sense CLS de fàbrica.

Google Consent Mode V2 i rendiment

El Consent Mode V2 permet que les etiquetes de Google s'executin en un estat sense galetes abans del consentiment, passant senyals via `gtag('consent', 'default', {...})`. Això és excel·lent per a la continuïtat de la mesura, però la pròpia biblioteca gtag.js té 50-90 KB. Carrega-la de manera asíncrona i estableix els valors predeterminats el més aviat possible per evitar condicions de carrera.

• Estableix els valors predeterminats abans que gtag es carregui — posa la crida consent default al cap, abans del script gtag.js.
• Utilitza `analytics_storage: 'denied'` com a valor predeterminat — minimitza les dades recollides abans del consentiment.
• Actualitza en Acceptar via requestIdleCallback — evita bloquejar el fil principal.

Mesurar l'impacte del CMP en els Core Web Vitals

No facis suposicions — mesura. Utilitza aquestes eines per quantificar l'impacte del teu banner:

• PageSpeed Insights — dades de camp de Chrome UX Report més auditoria Lighthouse de laboratori. Compara les puntuacions amb i sense el script CMP.
• Extensió Web Vitals de Chrome — superposició LCP, INP, CLS en temps real durant les proves locals.
• WebPageTest.org — vista de filmstrip i cascada que mostra exactament quan es renderitza el banner i què bloqueja.
• Informe Core Web Vitals de Search Console — dades de camp de 28 dies agrupades per patró d'URL. Comprova si les pàgines de destinació amb el teu banner puntuen de manera diferent que les pàgines sense ell.

Com FlexyConsent es manté ràpid