fb-pixel

WebP WordPress: come usare immagini più leggere e veloci sul tuo sito

Pubblicato in:

by:

L’importanza della relazione tra il formato WebP e WordPress nasce da un’esigenza che, negli ultimi anni, è diventata sempre più prioritaria: le immagini, infatti, sono ormai una parte fondamentale della comunicazione digitale. I componenti visivi di una pagina web hanno tantissime funzioni: rendono i contenuti più piacevoli da vedere, aiutano a raccontare una storia e attirano l’attenzione dell’utente. Ma hanno anche un lato critico: se non sono ottimizzate, possono rallentare il caricamento delle pagine e compromettere l’esperienza di navigazione.

Una delle soluzioni più efficaci per migliorare le prestazioni di un sito WordPress è usare immagini nel formato WebP, un formato moderno che consente di ridurre il peso dei file senza compromettere la qualità. In questo articolo vedremo come funziona il WebP e come usarlo facilmente su WordPress, anche se non hai grande dimestichezza con la materia.

Cos’è il formato WebP e perché è utile su WordPress

WebP è un formato di immagine sviluppato da Google che consente di ottenere file più leggeri rispetto ai tradizionali JPEG/JPG o PNG. A parità di qualità visiva, le immagini WebP possono pesare fino al 30-40% in meno. Questo significa:

  • siti più veloci, perché le pagine caricano più rapidamente;
  • risparmio di banda, utile sia per chi gestisce il sito che per chi lo visita da mobile;
  • miglior posizionamento su Google, perché la velocità è un fattore di ranking SEO.

Il formato è ormai supportato dalla quasi totalità dei browser moderni, quindi è sicuro da usare nella maggior parte dei casi. Se vuoi saperne di più sulle caratteristiche tecniche e sulle differenze con altri formati, abbiamo preparato un approfondimento dedicato al confronto fra i formati moderni AVIF vs WebP che ti consigliamo di leggere.

Il supporto al formato WebP è stato introdotto nativamente in WordPress a partire dalla versione 5.8, rilasciata nel 2021. Da questa versione in poi, gli utenti possono caricare immagini con estensione .webp nella Libreria Media, utilizzarle negli articoli o nelle pagine, e visualizzarle normalmente all’interno del sito, senza dover installare plugin o intervenire nel codice.

Wordpress 5.8

Ci sono tuttavia alcuni aspetti da tenere in considerazione per assicurarsi che tutto funzioni correttamente.

Versione di WordPress troppo vecchia

Se il tuo sito utilizza una versione di WordPress precedente alla 5.8, il caricamento diretto di file WebP non è supportato nativamente. In questo caso, quando provi a caricare un’immagine in formato .webp, potresti ricevere un messaggio di errore del tipo “Questo tipo di file non è permesso per motivi di sicurezza”.

Per risolvere il problema hai due possibilità: aggiornare WordPress all’ultima versione disponibile (opzione consigliata per motivi di sicurezza e compatibilità) oppure usare un plugin che abiliti il caricamento del formato WebP.

Tema non aggiornato o non compatibile

Anche se WordPress supporta il WebP, il tuo tema attivo potrebbe non essere pronto a gestire correttamente questo formato. Alcuni temi, soprattutto quelli sviluppati diversi anni fa o non più mantenuti, utilizzano funzioni che forzano l’uso di formati tradizionali come JPEG o PNG. Questo può causare problemi nella visualizzazione delle immagini WebP, ad esempio con slider, gallerie o anteprime.

In casi come questi, potresti notare che le immagini WebP non vengono mostrate correttamente o che il sito continua a caricare le versioni originali. La soluzione può essere aggiornare il tema se disponibile, oppure utilizzare un plugin per la gestione delle immagini che forzi il rendering in WebP anche in presenza di limitazioni del tema.

Configurazioni server limitanti

Infine, è possibile che sia il tuo server a impedire il corretto utilizzo delle immagini WebP. Alcuni provider di hosting (soprattutto quelli più economici o datati) non hanno configurato correttamente il supporto MIME per i file .webp, e questo può causare errori sia nel caricamento che nella visualizzazione delle immagini.

In pratica, anche se WordPress è pronto e il tuo tema lo consente, il server potrebbe non riconoscere il formato come valido, impedendo al browser di mostrare l’immagine. Per risolvere, spesso basta aggiungere una riga nel file .htaccess per istruire Apache a riconoscere il WebP, soluzione che puoi gestire richiedendo il supporto del tuo hosting per farti aiutare.

Come convertire immagini JPEG e PNG in WebP

Per utilizzare immagini WebP sul tuo sito, è necessario convertirle da formati più comuni come JPEG e PNG. Esistono diversi metodi, adatti a diversi livelli di esperienza e necessità.

Strumenti online gratuiti

Se hai poche immagini da convertire, puoi usare uno strumento online. Funzionano direttamente dal browser, senza bisogno di installare nulla. Basta caricare il file, scegliere il formato di destinazione e scaricare il risultato.

Ne abbiamo già parlato nel nostro articolo dedicato ai migliori strumenti per ottimizzare le immagini. Qui ti riportiamo giusto i tre più semplici da usare, a nostro avviso:

  • Squoosh: sviluppato da Google, permette di confrontare qualità e peso in tempo reale;
  • CloudConvert: supporta molti formati e offre buoni risultati anche nella versione gratuita;
  • Convertio: interfaccia intuitiva, utile per conversioni rapide.

Questi strumenti sono perfetti per chi ha poche immagini da convertire, ma diventano scomodi se il numero di file è elevato.

Programmi da installare sul computer

Se però hai a che fare con molte immagini, una soluzione più pratica per te potrebbe essere quella di installare dei software sul tuo pc, in modo da avere maggiore controllo sul processo. Ad esempio:

  • GIMP (gratuito): permette di esportare direttamente in WebP.
  • Photoshop: con l’uso di plugin come WebPShop, consente la gestione del formato WebP.
  • cwebp: strumento da riga di comando per conversioni automatizzate, adatto a chi ha familiarità con terminali o script.

Questi strumenti sono più indicati per chi ha dimestichezza con l’editing e vuole una gestione più flessibile delle immagini.

WebP WordPress: i migliori plugin

Se preferisci non uscire mai dal tuo pannello WordPress e desideri automatizzare la conversione delle immagini la soluzione migliore è installare un plugin, così da semplificare al massimo l’utilizzo del formato WebP sul tuo sito WP. I plugin possono occuparsi automaticamente della conversione delle immagini, della compatibilità con i browser, e persino della gestione della cache, senza bisogno di interventi manuali.

Vediamo ora i plugin più efficaci, sia gratuiti che premium, con una panoramica delle loro funzionalità e di come utilizzarli.

EWWW Image Optimizer

EWWW Image Optimizer è uno dei plugin più longevi e affidabili per l’ottimizzazione delle immagini su WordPress. È adatto sia a principianti che a utenti più esperti, grazie a un’interfaccia semplice e numerose impostazioni personalizzabili. Tra le funzionalità principali ti segnaliamo:

  • conversione automatica in WebP al momento del caricamento delle immagini;
  • conversione retroattiva delle immagini già presenti nella libreria (molto comoda per siti già avviati!);
  • compressione senza perdita di qualità visiva;
  • supporto al lazy load (caricamento differito);
  • fallback automatico per browser che non supportano WebP.
Webp WordPress Plugin Ewww Image Iptimizer

EWWW Image Optimizer è disponibile sia in versione gratuita che a pagamento, con le seguenti differenze:

  • gratis: include le funzioni principali, come la conversione automatica e la gestione delle immagini WebP;
  • a pagamento a partire da circa 8$/mese, sia con piani mensili che annuali: offre compressione più potente, supporto CDN, backup automatico e maggiore controllo sulla qualità.

Per installarlo da backend vai su “Plugin” e clicca su “Aggiungi plugin”. Qui ti basterà cerca “EWWW Image Optimizer”, installare il plugin e attivarlo nella schermata a seguire.

Ewww Image Optimizer

Il plugin da questo momento in avanti sarà disponibile cliccando su “Impostazioni” nella barra di controllo di WordPress. Qui, nella sezione “WebP”, abilita la conversione automatica, salva e lascia che il plugin lavori per te.

Webp Su WordPress Con Ewww

ShortPixel Image Optimizer

ShortPixel è uno dei plugin più utilizzati per l’ottimizzazione delle immagini, noto per l’eccellente rapporto tra compressione e qualità visiva. È perfetto per chi vuole un sito veloce senza sacrificare l’aspetto visivo. Queste le sue funzionalità principali:

  • compressione avanzata (lossy, glossy, lossless);
  • conversione automatica in WebP;
  • backup delle immagini originali;
  • supporto a WebP con fallback;
  • compatibilità con WooCommerce, NextGEN Gallery e altri plugin.
Shortpixel Webp

Anche in questo caso abbiamo sia una versione gratuita che una a pagamento, che differiscono fra loro per il numero di immagini utilizzabili ogni mese:

  • gratis: fino a 100 immagini al mese;
  • a pagamento: pacchetti prepagati (es. 10.000 immagini a circa $9.99 una tantum) oppure abbonamenti mensili (es. 7.000 immagini/mese a $4.99).
  • Funziona anche su più siti, a seconda del piano scelto.

Le modalità di ricerca, installazione e attivazione sono le medesime che abbiamo visto prima. A questo punto dovrai andare sul sito ufficiale, creare un account gratuito e ottenere la tua API Key.

Api Key Plugin

Inserisci la chiave nelle impostazioni del plugin e clicca su Salva.

Api Shortpixel

Il plugin ti reindirizzerà automaticamente nelle sue impostazioni, dove dovrai semplicemente assicurarti che sia attivata l’opzione per convertire le immagini in WebP. Il plugin si occuperà della compressione e della conversione in automatico, sia per le immagini nuove che per quelle esistenti.

Webp WordPress Shortpixel

Imagify

Imagify è il plugin sviluppato dal team di WP Rocket, noto per la semplicità d’uso e l’integrazione diretta con la libreria media di WordPress. Si rivolge soprattutto a chi desidera automatizzare tutto con pochi click, senza doversi perdere tra troppe opzioni tecniche. Questo plugin svolge le seguenti attività:

  • compressione automatica all’upload;
  • conversione automatica in WebP con una semplice spunta;
  • visualizzazione WebP tramite tag <picture> o tramite riscrittura URL (più compatibile);
  • backup delle immagini originali.
Imagify

Questo plugin offre un piano free e diverse soluzioni a pagamento:

  • gratis: 20 MB di immagini al mese (circa 200 immagini), massimo 2MB per immagine.
  • opzioni a pagamento a partire da 4,99$/mese e piani sia mensili che annuali.

Dopo aver attivato il plugin, anche in questo caso servirà ottenere la chiave API. Per farlo ti basterà inserire la tua mail dalle impostazioni di plugin e incollare la chiave che ti sarà inviata per posta elettronica, e cliccare infine su “Salva le modifiche”.

Api Imagify

Nelle impostazioni assicurati che sia selezionata l’opzione WebP, e il plugin farà il resto.

Ottimizzazione Webp

WebP Express

WebP Express è un plugin pensato specificamente per chi vuole convertire e servire immagini WebP senza dover acquistare un piano premium, ma per gestirlo al meglio avrai bisogno di masticare qualche tecnicismo che troverai nelle impostazioni. È molto flessibile e dispone di queste funzioni:

  • conversione on-the-fly delle immagini in WebP;
  • scelta tra diversi metodi di conversione (cwebp, imagick, vips);
  • generazione di WebP solo alla prima richiesta (per risparmiare spazio);
  • supporto al fallback per browser non compatibili;
  • compatibilità con plugin di cache e CDN.

Si tratta di un plugin opern source e quindi completamente gratuito, senza limitazioni di immagini o qualità.

WebP Express richiede qualche configurazione in più rispetto ad altri plugin, ma offre un ottimo controllo senza costi aggiuntivi.

Smush

Smush è uno dei plugin di ottimizzazione immagini più scaricati su WordPress. Nella sua versione gratuita è ottimo per ridurre il peso delle immagini JPEG e PNG, ma per usare il formato WebP bisogna passare alla versione Pro. Smush ti garantisce:

  • compressione automatica delle immagini al caricamento;
  • ottimizzazione in blocco delle immagini esistenti;
  • lazy loading integrato;
  • conversione in WebP disponibile solo nella versione Pro;
  • compatibilità con builder visuali come Elementor e WPBakery.
Smush

Per usare le immagini WebP dovrai per forza acquistare uno dei piani a pagamento, che partono da 1,50$/mese. Completata l’attivazione e l’aggiunta della licenza, ti basterà accede alle impostazioni nella sezione “Smush > “CDN & WebP” e attivare la conversione automatica in WebP. Il plugin inizierà a servire le immagini ottimizzate senza bisogno di ulteriori modifiche.

PluginPiano gratuito disponibileConversione automatica in WebPFallback per browser non compatibiliBackup immagini originaliInterfaccia sempliceLimiti nella versione gratuita
EWWW Image OptimizerMediaNessuno, ma meno controllo qualità
ShortPixel (100 immagini/mese)FacileLimite immagini/mese
Imagify (20 MB/mese)Molto sempliceLimite MB/mese
WebP ExpressMediaRichiede più configurazione
Smush (Pro) WebP solo a pagamento (solo Pro) (solo Pro)FacileNessun WebP nella versione free
Confronfro plugin wordpress per formato WebP

Come abilitare la visualizzazione delle immagini WebP

Un aspetto importante è garantire che le immagini siano visibili su tutti i browser. I plugin più evoluti lo fanno automaticamente ma, se stai lavorando senza plugin. puoi usare il tag HTML <picture>, che consente di mostrare un’immagine in WebP solo ai browser compatibili, offrendo un’alternativa JPEG o PNG per gli altri.

Ad esempio:

<picture>
  <source srcset="immagine.webp" type="image/webp">
  <img src="immagine.jpg" alt="Descrizione immagine">
</picture>

Questo approccio garantisce la compatibilità completa, ma richiede una modifica manuale del codice per ogni immagine.

Dopo aver attivato le immagini WebP, potresti non vedere subito il cambiamento. Questo succede perché molti temi, sistemi di cache o CDN (come Cloudflare) possono mostrare ancora le versioni precedenti delle immagini.

In questi casi ti consigliamo di:

  • pulire la cache del browser e del sito;
  • svuotare anche la cache lato rete nel caso tu stia usando una CDN;
  • verificare che il tema non abbia funzioni che sovrascrivono i formati immagine.

Come verificare che le immagini WebP siano attive

Dopo aver convertito le immagini in WebP e averle integrate nel tuo sito WordPress, è fondamentale assicurarsi che vengano effettivamente caricate e visualizzate correttamente nel nuovo formato. Per farlo, esistono diversi strumenti – tutti gratuiti – che ti permettono di controllare il comportamento del tuo sito e di verificare quali versioni delle immagini vengono effettivamente servite agli utenti.

Ecco due strumenti semplici e utili da usare anche se non hai competenze tecniche.

Ispezione del browser (strumenti per sviluppatori)

Ogni browser moderno (come Chrome, Firefox o Edge) include una funzione chiamata “Strumenti per sviluppatori”, che ti consente di analizzare in dettaglio cosa viene caricato in una pagina web, incluse le immagini.

Apri la pagina che contiene l’immagine da controllare e clicca con il tasto destro su un punto qualsiasi della pagina e seleziona “Ispeziona”. Vai nella scheda “Network” e seleziona il tipo di risorsa “Img” (immagini) nel filtro in alto.

A questo punto ricarica la pagina (F5) per vedere il traffico completo e clicca su una delle immagini per visualizzare i dettagli: nella colonna “Type” o “Content-Type” deve apparire image/webp accanto all’immagine che vuoi verificare. Se invece vedi ancora image/jpeg o image/png, significa che l’immagine non viene servita in formato WebP.

Verifica Webp Ispeziona

PageSpeed Insights

PageSpeed Insights è uno strumento di Google che analizza la velocità e le prestazioni di una pagina web, sia su desktop che su dispositivi mobili. È utile perché segnala anche l’uso (o la mancanza) del formato WebP per le immagini.

Per utilizzarlo vai sul sito ufficiale, inserisci l’indirizzo della tua pagina web e clicca su “Analizza” e, a caricamento dei risultati completato, scendi nella sezione “Diagnostica”. Se le immagini non sono in WebP, potresti vedere il messaggio “Serve immagini in formati moderni”.

Formati Immagine Recenti

Se invece lo strumento non mostra questo suggerimento, è molto probabile che le immagini WebP siano già attive e correttamente servite.

Conclusioni

Convertire le immagini in WebP è solo uno dei tanti modi per ottimizzare un sito lento. Per ottenere prestazioni ancora migliori, affidati a un hosting pensato per WordPress. Su SupportHost trovi soluzioni veloci, sicure e compatibili con tutte le tecnologie moderne.

Ciò detto, usare immagini WebP su WordPress è una strategia semplice ma efficace per rendere il tuo sito più veloce, più efficiente e più apprezzato da Google. E usando uno dei plugin che abbiamo visto potrai ottenere grandi benefici e il tuo sito sarà più leggero, moderno e in grado di offrire un’esperienza migliore a ogni visitatore.

Qual è la tua esperienza con i formati WebP e i plugin che abbiamo elencato? Lascia un commento con la tua esperienza.


Prova gratis e senza impegno uno dei nostri piani hosting per 14 giorni. Non è richiesto nessun dato di pagamento!

Commenti

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *