I formati di file che utilizzi sul tuo sito web hanno un impatto importante sulla sua velocità, qualità e prestazioni. Tuttavia, capire quali tipi di immagine utilizzare può richiedere un po’ di ricerca. WebP, ad esempio, è un formato di file immagine di nuova generazione relativamente nuovo creato da Google.

Capire cos’è il formato WebP e come utilizzarlo sul tuo sito WordPress può aiutarti a migliorare la tua esperienza utente (UX) e nel complesso ridurre i tempi di caricamento.

In questo post, ti presenteremo WebP, spiegheremo la sua storia e vedremo perché è importante. Forniremo anche alcuni suggerimenti utili per l’utilizzo sul tuo sito WordPress. 

Iniziamo!

Introduzione a WebP

L’ottimizzazione delle immagini è un aspetto essenziale della velocità e delle prestazioni del sito web. Uno dei modi migliori e più efficaci per ottimizzare le immagini è ridurre le dimensioni dei file tramite la compressione. Più leggeri sono i tuoi file, più facile sarà per il server caricare il tuo sito, con conseguente maggiore velocità.

Esistono due tipi principali di compressione delle immagini: lossy e lossless. La compressione con perdita di dati (lossy) si verifica quando la dimensione del file viene ridotta rimuovendo alcuni dati dell’immagine, riducendo la qualità nel processo. Con la compressione senza perdita di dati (lossless), i dati vengono semplicemente ricostruiti, mantenendo una maggiore qualità.

WebP è un moderno formato di file immagine sviluppato da Google nel 2010 che utilizza la compressione con e senza perdita di dati. Lo scopo è fornire immagini più piccole e più veloci per i siti web, con prestazioni superiori. In effetti, secondo Google, le immagini senza perdita di dati WebP sono il 26% più piccole dei PNG e le immagini con perdita sono fino al 34% più piccole dei JPEG.

Perché WebP è importante

Come abbiamo detto, le immagini svolgono un ruolo significativo nelle prestazioni del tuo sito web. La dimensione dei suoi file influisce sulla sua velocità e, a sua volta, sull’UX. Pertanto, è importante assicurarsi di scegliere i migliori formati di file immagine.

WebP è un formato di immagine raster creato appositamente per le immagini online. In poche parole, è importante saperlo perché ti consente di visualizzare immagini di alta qualità utilizzando file di dimensioni inferiori rispetto a quelle che potresti altrimenti essere in grado di ottenere utilizzando formati diversi.

Grazie al metodo di codifica predittiva , le immagini WebP possono codificare le immagini in base ai loro valori di pixel. In sostanza, viene incluso solo ciò che è necessario senza distorcere l’aspetto della foto. Di conseguenza, le dimensioni dei file sono piccole, ma la qualità dell’immagine rimane relativamente alta.

La possibilità di utilizzare più immagini senza preoccuparsi dei tempi di caricamento lenti può aiutare a migliorare l’aspetto generale del tuo sito WordPress. Avere la libertà di utilizzare le dimensioni e la qualità delle immagini che desideri ti dà anche una maggiore flessibilità nella progettazione del tuo sito .

Come utilizzare le immagini WebP sul tuo sito WordPress

Ora che hai capito cos’è WebP e quali sono i suoi vantaggi, vediamo alcuni dei modi in cui puoi utilizzare questo formato sul tuo sito WordPress. Innanzitutto, è importante notare che non tutti i browser attualmente supportano le immagini WebP. Per un’analisi completa di quali browser e versioni sono compatibili con WebP (rispetto a ciò che potrebbe richiedere l’utilizzo di un formato di file immagine di backup), puoi visitare Can i use :

Un grafico della compatibilità del browser con i formati di immagine WebP.

Se vuoi aggiungere immagini WebP a WordPress, hai due opzioni. Il primo è un metodo manuale e il secondo consiste nell’utilizzare un plugin. Diamo un’occhiata più da vicino a come funziona ogni processo.

Come aggiungere manualmente immagini WebP a WordPress

Il metodo manuale non è così rapido o semplice come l’utilizzo di un plugin. Tuttavia, se hai almeno un po’ di esperienza nel lavorare con i file del tuo sito e vuoi evitare di installare un altro plugin sul tuo sito, questa potrebbe essere l’opzione migliore per te.

L’aggiunta manuale di immagini WebP al tuo sito WordPress richiede una conversione prima di caricarle nella tua libreria multimediale. Il modo più semplice per farlo è utilizzare uno strumento basato su browser, come Online-Convert :

Il sito web dello strumento Online-Convert.com.

Per iniziare, puoi semplicemente fare clic su Choose Files , selezionare la tua immagine e quindi premere il pulsante Start Conversion . Ricordati di salvare il nuovo file quando hai finito.

Per aggiungere l’immagine al tuo sito, puoi utilizzare un client FTP (File Transfer Protocol) come FileZilla o modificare il file functions.php per abilitare i caricamenti WebP. Puoi fare quest’ultimo aggiungendo il seguente snippet di codice al file:

//** *Abilita il caricamento dei file immagine webp.*/ 
function webp_upload_mimes($existing_mimes) {
$existing_mimes['webp'] = 'image/webp';
return $existing_mimes;
}
add_filter('mime_types', 'webp_upload_mimes');

Al termine, ricorda di salvare le modifiche e ricaricare il file. Dovresti quindi essere in grado di caricare immagini WebP tramite la tua libreria multimediale.

Se questo ti sembra un po’ troppo complesso, non preoccuparti. Hai anche la possibilità di utilizzare un plugin.

Come servire immagini WebP in WordPress usando un plugin

Grazie ai plugin di WordPress, convertire le tue immagini PNG e JPEG in WebP può essere facile e veloce. Inoltre, non dovrai modificare direttamente nessuno dei file del tuo sito, poiché l’estensione farà tutto il lavoro per te.

A parte la facilità d’uso, un vantaggio di questo metodo è che non dovrai preoccuparti dei visitatori che accedono al tuo sito da un browser che non supporta le immagini WebP. Se il browser che stanno utilizzando non è compatibile con questo formato di file immagine di nuova generazione, verranno serviti i file originali, come le immagini JPEG o PNG.

Se decidi di voler seguire il percorso del plugin, il passaggio successivo è scegliere quale utilizzare. Hai alcune opzioni. Uno dei più popolari e affidabili è ShortPixel Image Optimizer :

Questo plugin freemium offre vari modi per migliorare le prestazioni del tuo sito ottimizzando le tue immagini. Oltre alle conversioni di immagini istantanee, lo strumento offre una compressione sia lossy che lossless.

Per utilizzare il plugin, puoi installarlo e attivarlo, quindi convalidare la tua chiave API (che verrà inviata al tuo indirizzo email). Quindi puoi abilitare la conversione automatica delle immagini selezionando quell’opzione nella scheda Impostazioni avanzate :

La schermata delle impostazioni del plugin ShortPixel.

Ulteriori plugin di ottimizzazione delle immagini che potresti prendere in considerazione includono EWWW Image Optimizer e Optimole .

Conclusione

Le immagini svolgono un ruolo fondamentale per qualsiasi sito web. Tuttavia, i formati di file che utilizzi influenzeranno l’aspetto delle tue immagini sulla pagina e la velocità di caricamento. Pertanto, è importante scegliere la migliore opzione possibile.

Come abbiamo visto in questo post, WebP è un moderno formato di file immagine sviluppato da Google, che puoi utilizzare per mostrare immagini di alta qualità senza compromettere le prestazioni del tuo sito. Utilizzando sia la compressione lossy o lossless, WebP ti consente di mantenere l’aspetto ricco delle tue immagini e allo stesso tempo di sfruttare i vantaggi dei file di dimensioni inferiori.

Buon lavoro!