Utilizziamo i cookie per migliorare la tua esperienza, analizzare il traffico del sito e personalizzare i contenuti. Puoi accettare tutti i cookie o scegliere quali categorie consentire. Scopri di più
Core Web Vitals per Ecommerce 2026: Correzioni LCP, INP, CLS | Ordiko
Guida
Core Web Vitals per Ecommerce 2026: Correzioni LCP, INP, CLS
Guida pratica 2026 ai Core Web Vitals per ecommerce — soglie LCP/INP/CLS, cause nel mondo reale e le correzioni che fanno la differenza su PDP e PLP.
PT1H
TL;DR. I Core Web Vitals nel 2026 sono LCP ≤ 2.5s, INP ≤ 200ms, CLS ≤ 0.1 a p75. Nei siti ecommerce, LCP è fissato tramite il preload dell'immagine hero, INP tramite il deferimento del JS e l'uso delle funzionalità concorrenti di React 18+, e CLS tramite la riserva di spazio per immagini e regioni dinamiche. Google valuta a p75 su un intervallo di 28 giorni; le correzioni richiedono settimane per riflettersi.
Soglie del 2026
Metri
Buono
Necessita miglioramenti
Scarso
LCP
≤ 2.5s
2.5s – 4.0s
> 4.0s
INP
≤ 200ms
200ms – 500ms
> 500ms
CLS
≤ 0.1
0.1 – 0.25
> 0.25
TTFB
≤ 800ms
800ms – 1.8s
> 1.8s
Fonte: . INP ha sostituito FID come Core Web Vital a marzo 2024 e rimane il metro per il 2026.
Domande frequenti
I Core Web Vitals influenzano i ranking?
Sì, dal 2021 — ma come fattore di spareggio piuttosto che come segnale principale. Due pagine di uguale qualità dei contenuti si classificheranno in ordine CWV. Correggere CWV su una pagina poco classificata non la farà improvvisamente classificare se il contenuto è debole.
Perché è più difficile correggere INP rispetto a LCP?
LCP è principalmente un problema di CDN e ottimizzazione delle immagini con correzioni ben comprese. INP è un problema di esecuzione di JavaScript che richiede un'analisi componente per componente. Ogni evento di interazione può avere un collo di bottiglia diverso (clic sul filtro vs. aggiunta al carrello vs. cambio variante).
Qual è un buon obiettivo INP per PDP?
Sotto 200ms p75 è 'buono'. Sotto 100ms è raggiungibile su PDP moderni con disciplina (RSC, senza script di terze parti pesanti, input debounced). Sopra 500ms è 'scarso' e probabilmente influisce sui ranking.
Come gestisce Ordiko CWV per impostazione predefinita?
Ordiko fornisce Next.js 16 Cache Components + PPR, che trasmette un shell statico con l'immagine LCP già precaricata e confini di Suspense per contenuti dinamici. L'INP predefinito è sotto 200ms su PDP tipici senza ottimizzazione su misura.
Google utilizza i CWV come segnale di esperienza della pagina nel ranking. I dati reali degli utenti mostrano che le pagine con tutti i CWV verdi superano in classifica pagine comparabili con CWV scadenti in nicchie competitive.
Oltre ai ranking, i CWV influenzano direttamente la conversione. Studi nel 2024–2025 mostrano costantemente:
Miglioramento di 1 secondo in LCP: aumento della conversione del 5–15% su PDP.
INP sotto i 200ms: riduzione del 10–20% nell'abbandono del carrello.
CLS sotto 0.1: aumento percepito della qualità dell'UX.
Misurare nel modo giusto
Due fonti di dati sono importanti:
CrUX (Chrome User Experience Report): dati reali degli utenti che Google utilizza per classificarti. Finestra mobile di 28 giorni, p75. Visibile in PageSpeed Insights e Search Console.
Il tuo RUM: dati reali degli utenti che raccogli tramite la libreria web-vitals o il tuo CDN. Mostra dati più freschi, ti consente di segmentare per tipo di pagina, dispositivo, paese.
Gli strumenti sintetici (Lighthouse, WebPageTest) sono utili per la diagnosi ma non per la valutazione.
Correzioni LCP (largest contentful paint)
Nei siti ecommerce, LCP è quasi sempre:
L'immagine hero sulla home, PLP e PDP.
L'H1 + il primo paragrafo sulle pagine di blog/articolo.
I grandi vantaggi:
Precarica l'immagine LCP con <link rel="preload" as="image" fetchpriority="high">:
Sposta i letterali regex fuori dai gestori di eventi — ricreare regex in un percorso caldo costa un INP misurabile.
Deferisci gli script di terze parti non critici. Pixel di marketing, widget di chat, SDK di test A/B: caricali con strategy="afterInteractive" o lazyOnload.
Correzioni CLS (cumulative layout shift)
I grandi vantaggi:
Imposta sempre larghezza/altezza sulle immagini. I browser riservano lo spazio corretto.
Riserva spazio per contenuti incorporati. iframe, annunci, lettori video necessitano di dimensioni esplicite o contenitori con rapporto d'aspetto.
Evita `font-display: swap` senza CSS di fallback per i font. Lo swap riformatta il testo. Usa size-adjust per abbinare le metriche o accetta font-display: optional.
Non iniettare contenuti sopra contenuti esistenti. Notifiche banner, consenso ai cookie, banner di vendita — rendili in una posizione che non sposti la pagina.
I caricamenti dello scheletro dovrebbero corrispondere alle dimensioni reali del contenuto. Uno scheletro più piccolo del contenuto caricato sposta la pagina.
Note specifiche per tipo di pagina
Pagina principale
L'immagine hero è LCP. Precaricala.
I caroselli sono mine anti CLS. Usa solo CSS o pre-renderizza il primo slide.
PLP (product list / category)
LCP è solitamente l'immagine della prima scheda prodotto.
INP è per i clic sui filtri e la paginazione. Usa startTransition in modo aggressivo.
CLS è il riempimento della griglia prodotto quando si applicano i filtri. Riserva l'altezza della griglia.
PDP
LCP è l'immagine principale del prodotto.
INP è il cambio di variante e l'aggiunta al carrello. L'UI ottimistica è obbligatoria.
CLS è il caricamento delle miniature della galleria prodotto dopo l'immagine principale.
Carrello / Checkout
INP è critico qui. Un pulsante "effettua ordine" lento costa ordini.
CLS dal caricamento degli iframe di pagamento (Stripe Elements, ecc.). Riserva spazio.
Strumenti
Strumento
A cosa serve
PageSpeed Insights
Diagnosi di un singolo URL con sovrapposizione di dati reali (CrUX)
Lighthouse
Misurazione sintetica per flussi di lavoro di sviluppo
WebPageTest
Misurazione con throttling della rete, multi-locazione
Search Console → CWV
Livello di dominio p75 su 28 giorni
Il tuo RUM (web-vitals)
Dati di campo in tempo reale segmentati per pagina, dispositivo, paese
Come Ordiko gestisce i CWV per impostazione predefinita
Immagine LCP precaricata per impostazione predefinita su PDP, PLP, home.
Confini di Suspense attorno a isole dinamiche (carrello, recentemente visualizzati, hero personalizzato).
startTransition + useOptimistic sui controlli di filtro e variante.
Ricerca debounced a 200ms con AbortController.
Tipico p75 reale su un PDP Ordiko predefinito: LCP 1.0–1.8s, INP 80–160ms, CLS < 0.05.
FAQ
I Core Web Vitals influenzano i ranking? Sì, dal 2021 — ma come fattore di rottura piuttosto che come segnale primario. Due pagine di uguale qualità del contenuto si classificheranno in ordine di CWV. Correggere i CWV su una pagina scarsamente classificata non la farà improvvisamente classificare se il contenuto è debole.
Perché è più difficile correggere l'INP rispetto all'LCP? LCP è principalmente un problema di CDN e ottimizzazione delle immagini con correzioni ben comprese. L'INP è un problema di esecuzione di JavaScript che richiede un'analisi componente per componente. Ogni evento di interazione può avere un collo di bottiglia diverso (clic sul filtro vs. aggiunta al carrello vs. cambio di variante).
Qual è un buon obiettivo INP per PDP? Sotto i 200ms p75 è 'buono'. Sotto i 100ms è raggiungibile su PDP moderni con disciplina (RSC, senza script di terze parti pesanti, input debounced). Sopra i 500ms è 'scarso' e probabilmente influisce sui ranking.
Come gestisce Ordiko i CWV per impostazione predefinita? Ordiko utilizza Next.js 16 Cache Components + PPR, che trasmette una shell statica con l'immagine LCP già precaricata e confini di Suspense per contenuti dinamici. L'INP predefinito rimane sotto i 200ms su PDP tipici senza ottimizzazione su misura.