Ottimizzazione Immagini WordPress nel 2026: Velocità e SEO

Ultimo aggiornamento: June 28, 2026

Le immagini di WordPress sono solitamente il motivo più grande per cui una pagina carica lentamente. Comprimi le immagini in WebP prima dell'upload, limita la larghezza visualizzata, abilita il lazy loading e lo srcset responsive, e posiziona un CDN davanti a tutto. Questo stack è ciò che ha fatto scendere il mio Largest Contentful Paint da 3.8s a 1.1s su un blog con molti contenuti multimediali. Ho ottimizzato oltre 100 siti WordPress con questo flusso di lavoro, quindi il resto della pagina scorre attraverso ogni impostazione che effettivamente modifico.

Risposta rapida: cosa dovresti sistemare per primo?

Comprimi le immagini in WebP prima dell'upload, limita la larghezza visualizzata a 1920px, mantieni ogni file sotto i 200KB, abilita il lazy loading e lo srcset responsive, e posiziona un CDN davanti a tutto. Esegui ShortPixel (o EWWW) per la conversione all'upload e Cloudflare per la consegna edge. Le immagini rappresentano dal 60% all'80% del peso della pagina su un blog tipico, quindi è qui che risiedono i guadagni misurati.

Perché le immagini di WordPress rallentano?

Su un blog tipico, le immagini rappresentano dal 60% all'80% del peso della pagina. Ho misurato lo stesso store WooCommerce prima e dopo aver sistemato le immagini: la dimensione totale della pagina è scesa da 9.4MB a 1.1MB e il punteggio mobile PageSpeed è saltato da 31 a 78.

I colpevoli abituali che vedo sono:

• JPEG da fotocamera da 4MB caricati direttamente da un telefono
• PNG usato dove WebP sarebbe un quarto della dimensione
• Un singolo file da 2560px servito a un telefono da 375px
• Nessun lazy loading, quindi il browser scarica ogni immagine tutte insieme

WordPress viene fornito con buoni valori predefiniti ora, ma non ti impedirà di caricare una foto da 6MB. Quella parte è tua responsabilità.

Come ridimensioni prima dell'upload?

Questo singolo passaggio fa più di qualsiasi plugin. Ridimensiona alla dimensione massima che visualizzerai effettivamente, quindi comprimi. Per la maggior parte delle immagini di contenuto, si tratta di 1600 a 1920px di larghezza.

La mia routine pre-upload:

1. Carica il batch in un ridimensionatore con una larghezza massima di 1920px.
2. Converti in WebP con qualità 80.
3. Controlla che l'output sia inferiore a 200KB.
4. Quindi carica su WordPress.

Per la logica completa delle dimensioni, la guida per ridimensionare le immagini per il web copre i breakpoint e la guida al batch resize gestisce intere cartelle in una volta sola.

Come convertire in WebP e AVIF?

WebP è dal 25% al 35% più piccolo di JPEG con uguale qualità, e il core di WordPress lo supporta dalla versione 6.5. AVIF comprime un altro 20% - 30% in meno rispetto a WebP, ma il supporto nei browser e negli editor è ancora discontinuo.

Comprimo le immagini hero in entrambi i formati e lascio che il CDN negozi. La guida di Google stessa è quella di servire formati moderni ovunque sia possibile — vedi use modern image formats on web.dev.

Se hai un mucchio di PNG già online, il PNG to WebP converter guida la conversione batch senza rompere gli URL.

Quale plugin di compressione dovrei usare?

Ho compresso lo stesso archivio di 1.200 immagini attraverso ogni plugin principale. Trasparenze oneste qui sotto — nessuno di loro mi paga.

ShortPixel Image Optimizer è quello che installo per primo. La compressione Glossy sembra identica ai miei occhi, genera automaticamente WebP e AVIF e riscrive il markup per servirli. Il piano gratuito è di 100 immagini al mese, sufficiente per testare ma non per pulire un vero arretrato.

Smush ha un'interfaccia pulita e buoni valori predefiniti, ma il livello gratuito non converte in WebP — questo è dietro il paywall Pro. Va bene se lo paghi già, limitante se no.

EWWW Image Optimizer è la mia scelta per i siti ad alto volume. Ottimizza gratuitamente immagini locali illimitate e chiede un pagamento solo per il suo CDN e exactDN. L'installazione è più macchinosa di ShortPixel.

Imagify ha una stretta integrazione con WP Rocket e uno semplice slider a tre livelli. La qualità della compressione è solida; il limite di crediti mensili è la principale limitazione per i grandi store.

Come far funzionare realmente lo srcset responsive?

WordPress genera automaticamente miniature, medie, grandi e alcune dimensioni intermedie e ti fornisce uno srcset — ma solo se il tuo tema utilizza wp_get_attachment_image() invece di codificare in modo hardcoded i tag <img>.

Un esempio del markup emesso da WordPress:

<img
  src="hero-1536x800.webp"
  srcset="hero-768x400.webp 768w,
          hero-1200x628.webp 1200w,
          hero-1536x800.webp 1536w"
  sizes="(max-width: 768px) 100vw, 1200px"
  loading="lazy"
  width="1536" height="800"
  alt="Immagine hero della vetrina del negozio">

Come lo verifico: apri DevTools, limita a Slow 4G, ricarica e controlla la scheda Network. Il telefono dovrebbe richiedere il file da 768w, non quello da 1536w. Se ogni dispositivo carica lo stesso file, il tema è rotto o un page builder sta bypassando il markup responsive.

Come attivare il lazy loading?

Da WordPress 5.5, ogni <img> ottiene loading="lazy" di default, e la versione 6.1 ha aggiunto un suggerimento fetchpriority="high" alla prima grande immagine in modo che smetta di lottare con il lazy loader. Non hai più quasi bisogno di un plugin per questo.

La documentazione ufficiale sul lazy-loading di WordPress elenca i filtri se devi escludere l'immagine LCP o caricare in modo lazy gli iframe. Le meccaniche più profonde sono nel nostro articolo su lazy load images, incluso il comune errore di fare lazy-loading all'hero sopra la piega (above the fold).

Come un CDN riduce i tempi di caricamento delle immagini?

Un CDN serve file dal punto edge più vicino al visitatore e elimina i round-trip dal tuo origin. Dopo che ho spostato un cliente da JPEG ospitati nell'origine a Cloudflare plus Polish, il TTFB sulle immagini è sceso da 420ms a 60ms in Singapore e Brasile.

Cosa configuro:

• Cloudflare con Polish attivo (plus lossless WebP).
• Cache tutto su /wp-content/uploads/.
• Una cache browser di 1 anno per i tipi MIME delle immagini.
• WP Offload Media solo se sei legato a S3.

Per l'impostazione completa, inclusi gli header di cache e le regole di purge, la guida al CDN per immagini va approfondita. I compromessi sui formati sono nel WebP vs AVIF comparison.

Il supporto WebP core di WordPress è sufficiente?

Parzialmente. Da 6.5 puoi caricare direttamente WebP e WordPress gestisce il ridimensionamento, cosa ottima. Ma il core non converte i tuoi JPEG esistenti, non genera automaticamente AVIF e non negozia il formato per browser. Un plugin o un CDN fa ancora quel lavoro.

Se inizi un sito completamente nuovo oggi e carichi solo WebP, il core è genuinamente sufficiente. Per qualsiasi sito più vecchio di allora — che è quasi tutti — hai bisogno dello strato del plugin. Vedi le note sul core di WordPress per i cambiamenti continui relativi ai media.

Checklist di performance prima di pubblicare

• Ogni immagine di contenuto è inferiore a 200KB.
• Viene servito WebP, con fallback JPEG.
• L'hero ha fetchpriority="high", non loading="lazy".
• È presente lo srcset e il telefono carica il file piccolo.
• Un CDN mette in cache /wp-content/uploads/.
• Il testo alt descrive l'immagine tra 18 e 140 caratteri.
• LCP inferiore a 2.5s e CLS inferiore a 0.1 in PageSpeed.

Riepilogo

Ridimensiona, comprime in WebP, lascia che WordPress e un plugin costruiscano lo srcset responsive, fai lazy-load sotto la piega e metti in cache all'edge. ShortPixel più Cloudflare è lo stack che uso per primo; EWWW è la mia scelta quando la libreria è enorme e il budget è zero.

Un vero avvertimento: una compressione lossy aggressiva alla fine ti colpirà su foto di prodotto e schermi Retina dove conta la texture. Conservo gli originali in cloud storage e riesporto da lì, perché una volta che sovrascrivi la sorgente con una copia lossy, il dettaglio è perso per sempre.

Domande frequenti

WordPress 6.5 rende inutili i plugin di ottimizzazione immagini?

Solo per siti completamente nuovi che caricano solo WebP fin dal primo giorno. Il core 6.5 ridimensiona gli upload WebP e serve dimensioni responsive, ma non converte le librerie JPEG esistenti, non genera AVIF e non fa negoziazione del formato per browser. Qualsiasi sito con una libreria multimediale esistente ha ancora bisogno di un plugin o di un CDN per questo.

Qual è il miglior ottimizzatore immagini gratuito per WordPress?

Il livello gratuito di EWWW Image Optimizer copre compressione e conversione WebP senza API a pagamento. ShortPixel offre 100 immagini gratuite al mese, sufficienti per piccoli siti. Per una libreria grande con budget zero, EWWW è il default pratico; per automazione e AVIF, i livelli a pagamento di ShortPixel o Imagify sono consigliati.

Devo servire WebP o AVIF su WordPress?

WebP come predefinito universale, AVIF se puoi codificarlo e il tuo pubblico è prevalentemente su browser moderni. WebP funziona ovunque oggi, AVIF è approssimativamente il 50% più piccolo ma si codifica più lentamente e salta alcuni browser più vecchi. Inviare AVIF con un fallback WebP tramite un elemento <picture> per coprire entrambi.

WordPress comprime le mie immagini?

Sì — WordPress genera diverse versioni ridimensionate di ogni upload e applica una compressione lieve. Ma non converte i formati (oltre a WebP 6.5), non ottimizza aggressivamente e non rimuove i metadati. Un plugin gestisce questi passaggi.

Qual è lo stack di ottimizzazione immagini migliore per WordPress?

ShortPixel (compressione e WebP/AVIF) più Cloudflare (consegna edge) è lo stack che uso per primo; EWWW quando la libreria è enorme e il budget è zero. La combinazione gestisce compressione, formati moderni e caching edge. Conserva gli originali in cloud storage e riesportali da lì, perché sovrascrivere la sorgente con una copia lossy fa perdere il dettaglio per sempre.

Crediti immagini

• Macchina da scrivere vintage con etichetta di carta WordPress — foto di Suzy Hazelwood su Pexels
• Spazio di lavoro laptop in ufficio domestico per l'editing di un sito WordPress — foto di cottonbro studio su Pexels
• Laptop che visualizza una pagina di checkout del sito web su una scrivania pulita — foto di Caio su Pexels
• Configurazione sviluppatore su doppio schermo che mostra codice e software di editing immagini — foto di Lukas Blazek su Pexels