Indice dell’articolo18 sezioni
- 01Le tre metriche che contano
- 02LCP — Largest Contentful Paint < 2.5s
- 03INP — Interaction to Next Paint < 200ms
- 04CLS — Cumulative Layout Shift < 0.1
- 05Come misurare davvero (no PageSpeed teorico)
- 06Le 7 ottimizzazioni che fanno la differenza
- 071. Immagini in AVIF + lazy loading nativo
- 082. Hero LCP ottimizzata con preload
- 093. Pulizia ferocia degli script di tracking
- 104. Critical CSS inline + rest deferred
- 115. Font in font-display: swap e preloaded
- 126. Plugin audit serio
- 137. CDN + HTTP/3 attivi
- 14Trappole comuni
- 15Cosa portarsi a casa
- 16Conclusione
- 17Continua a leggere
- 18Domande frequenti
Un sito lento perde traffico, vendite, conversioni — e Google lo penalizza in SERP. È un fatto, non un’opinione: ogni 100ms in più di caricamento riducono il tasso di conversione tra l’1 e il 5%, a seconda della categoria. Nel 2026 i Core Web Vitals sono tre metriche specifiche, misurate sul campo, che decidono se il tuo sito è “veloce” agli occhi di Google. Ti spieghiamo quali sono, come ottimizzarli, e cosa abbiamo imparato facendolo sui siti dei nostri clienti.
Le tre metriche che contano
Google misura la performance percepita con tre numeri. Ognuno ha una soglia “verde” che vuoi raggiungere.
LCP — Largest Contentful Paint < 2.5s
Quanto tempo passa dal click utente al momento in cui il contenuto principale della pagina è visibile. Tipicamente è la hero image, l’H1, una featured image. Sotto i 2.5 secondi sei nel verde. Sopra i 4 sei nel rosso e Google ti penalizza.
Cause comuni di LCP cattivo: immagini hero pesantissime, CSS render-blocking nel head, font che caricano in ritardo bloccando il testo, server lento.
INP — Interaction to Next Paint < 200ms
La metrica che ha sostituito FID a marzo 2024. Misura quanto è reattiva la pagina ai click, tap, input dell’utente. Se clicchi un pulsante e la pagina ci mette 500ms a rispondere visivamente, INP è alto.
Cause comuni: troppi script di tracking (GTM caricato in async con 15 tag dentro), plugin WP pesanti che eseguono JavaScript ad ogni evento, animazioni JS non hardware-accelerated.
CLS — Cumulative Layout Shift < 0.1
Quanto il layout della pagina “salta” durante il caricamento. Un’immagine che carica senza dimensioni dichiarate, un banner cookie che spinge giù il contenuto, un font che cambia dimensione del testo a metà rendering.
Sotto 0.1 è verde. Sopra 0.25 è rosso. Una pagina con CLS alto è frustrante anche prima che l’utente capisca perché — clicchi un pulsante, il pulsante si sposta, clicchi su un banner ads.
Come misurare davvero (no PageSpeed teorico)
Le metriche dei Core Web Vitals che Google usa per il ranking sono field data — misure reali da utenti veri — non i lab data del PageSpeed Insights. Tre strumenti che usiamo sui clienti:
- Search Console > Core Web Vitals — i dati che Google effettivamente usa per ranking. Aggregati per URL pattern. È la fonte di verità.
- PageSpeed Insights (pagespeed.web.dev) — combina field data (se ci sono) e lab data. Utile per debug puntuale.
- WebPageTest.org — lab data ma con scelta geografica, browser, network throttling. Insostituibile per debug profondo.
Sui clienti tracciamo i CWV in continuo con un dashboard custom che pesca da Search Console API. Il dato lab di PageSpeed può essere ingannevole se vario.
Le 7 ottimizzazioni che fanno la differenza
Dopo decine di interventi su siti WP, e-commerce, landing, queste sono le 7 cose che muovono davvero l’ago. Non tutte si applicano a ogni sito, ma valutarle è la base.
1. Immagini in AVIF + lazy loading nativo
AVIF è il formato 2026. Compressione 30-50% migliore di WebP, supportato da tutti i browser moderni. Plugin LiteSpeed Image Optimization o Smush convertono automaticamente. Per le immagini sotto la fold, loading="lazy" nativo HTML — niente più plugin LazyLoad.
2. Hero LCP ottimizzata con preload
L’immagine principale della hero deve essere preloaded nel <head>:
<link rel="preload" as="image" href="hero.avif"
imagesrcset="hero-mobile.avif 800w, hero.avif 1920w"
imagesizes="100vw">Il browser inizia a scaricare l’immagine prima ancora di parsare il CSS. Tipicamente abbatte LCP di 500-1000ms su mobile.
3. Pulizia ferocia degli script di tracking
GTM con 20 tag attivi è un assassino INP. Pulisci i tag che non usi davvero (controlla GA4 ultimi 90 giorni: i tag che non generano dati vanno via). Sposta GTM in defer dove possibile. Considera Server-Side Tagging per i tag critici (conversion, e-commerce).
4. Critical CSS inline + rest deferred
I primi 14KB di CSS che servono per renderizzare il fold inline nel <head>. Il resto del CSS caricato con <link rel="preload" as="style"> o asynchronously. Plugin: WP Rocket o LiteSpeed lo fanno automaticamente, sui siti custom va fatto a mano.
5. Font in font-display: swap e preloaded
Mai mostrare testo invisibile mentre il font carica. font-display: swap nel @font-face mostra il fallback sistema, poi swappa al font custom. Per i font critici (display dei titoli) <link rel="preload" as="font" type="font/woff2" crossorigin>.
6. Plugin audit serio
WordPress su 30+ plugin attivi è quasi sempre lento. Audit con Query Monitor: scopri quali plugin pesano sulle query database, quali caricano script in homepage anche se servono solo in checkout. Disattiva quello che non usi attivamente. Spesso recuperi 500ms-1s di LCP.
7. CDN + HTTP/3 attivi
Cloudflare gratis copre il 90% dei casi. Cache statica, immagini ottimizzate, HTTP/3. Setup di 30 minuti, beneficio sui CWV immediato. Per siti enterprise: Cloudflare Pro o Bunny CDN.
Trappole comuni
Tre errori che vediamo continuamente.
- “Ho installato il plugin di cache, sono a posto” — no. Il plugin di cache aiuta server response time, ma non risolve immagini pesanti, JS bloccante, CLS. È uno dei sette interventi, non l’unico.
- “PageSpeed mi dà 95, sono ok” — il lab data può essere ottimo, ma se gli utenti veri vedono LCP a 3s (rete lenta, dispositivo vecchio) la Search Console mostrerà rosso. Guarda sempre i field data.
- “Ho ottimizzato la home” — Google misura i CWV per URL pattern (gruppo di pagine simili). Ottimizzare solo la home non basta: le pagine articolo, le pagine prodotto, il checkout vanno ottimizzati ognuno per sé.
Cosa portarsi a casa
- LCP < 2.5s, INP < 200ms, CLS < 0.1 — le tre soglie verdi del 2026. Sotto le quali Google sorride.
- Field data > lab data. Search Console è la fonte di verità, non PageSpeed Insights.
- I 7 interventi base: AVIF, hero preload, pulizia tracking, critical CSS, font swap, plugin audit, CDN. Applicarli risolve il 90% dei problemi.
“Bello, sì — ma prima funzionante.” Un sito veloce è il prerequisito di un sito che genera business. Tutto il resto viene dopo.
Conclusione
Performance non è “ottimizzazione finale” — è una scelta strutturale del sito. Si paga ora o si paga dopo (in perdita di conversioni, di posizionamento, di reputazione). I siti che costruiamo nascono già ottimizzati su CWV: è più facile farlo bene la prima volta che riparare dopo.
Se il tuo sito ha un Core Web Vitals score in rosso, è uno dei primi interventi che facciamo come servizio. Audit + roadmap + esecuzione in 2-4 settimane. Niente vetrine, solo strumenti che vendono — e che vendono velocemente.
