TechBlogSD - Tutto per WordPress e sviluppo WEB
Istruzioni WEB e WordPress, notizie, recensioni di temi e plugin

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

58

Google è il motore di ricerca dominante tra gli utenti di lingua inglese. Per questo motivo, i proprietari di siti WordPress seguono seriamente le linee guida e le opportunità mostrate nello strumento Google PageSpeed ​​Insights. Uno dei messaggi di avviso più diffusi nello strumento PageSpeed ​​è quello di correggere le immagini servite in formato tradizionale su immagini server in formati di nuova generazione. In questo articolo spiegheremo come correggere questo avviso nei siti WordPress per ottimizzare le tue immagini.

Correlati: come correggere lo spostamento cumulativo del layout in WordPress?

Avviso in Google PageSpeed ​​Insights

Vai alla pagina dello strumento Google PageSpeed ​​Insights e verifica l’URL della tua pagina web. Dovresti vedere un’opportunità che mostra "Immagini server in formati di nuova generazione" come di seguito. Puoi vedere il potenziale risparmio di dimensioni per ogni immagine e il risparmio stimato nel tempo di caricamento della pagina.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Avviso PageSpeed ​​per la pubblicazione di immagini in formati di nuova generazione

Nota: Google afferma che questa è un’opportunità e non influirà sul punteggio delle prestazioni di PageSpeed. Tuttavia, la rimozione di questo avviso aumenta notevolmente il punteggio nella realtà.

Formati immagine di nuova generazione

Prima di andare avanti, devi capire i formati delle immagini. Esistono tre formati di immagine tradizionali e popolari:

  • Joint Photography Experts Group (JPEG o JPG) – supporta la compressione con perdita di dati
  • Portable Network Graphics (PNG): supporta la compressione trasparente e senza perdita di dati e la sostituzione di GIF
  • Graphics Interchange Format (GIF): un formato bitmap supporta il loop di più fotogrammi.

Ora ci sono nuovi formati di nuova generazione consigliati per i siti web:

  • WebP – sviluppato da Google per una migliore compressione
  • JPEG 2000: miglioramento rispetto agli standard JPEG nella compressione delle immagini
  • JPEG XR – Formato JPEG ad intervallo esteso sviluppato da Microsoft

Puoi controllare la galleria di Google per confrontare visivamente varie immagini. I formati di nuova generazione aiutano a ridurre notevolmente le dimensioni delle immagini aumentando così la velocità di caricamento della pagina. Secondo Wikipedia, il 92% dei browser supporta il formato WebP, rendendolo un sostituto promettente per il formato tradizionale. Pertanto, devi iniziare a utilizzare il formato WebP per sbarazzarti delle immagini di servizio nei formati di nuova generazione che avvisano nello strumento PageSpeed ​​Insights.

Conversione di formati di immagine

Sebbene Google spinga il formato immagine leggero, non sono molto popolari tra gli sviluppatori di applicazioni. Molte applicazioni non supportano la creazione di immagini in questi formati. Ad esempio, SnagIt, il popolare strumento di cattura dello schermo per i blogger, non offre alcuna opzione per creare immagini in formato di nuova generazione. Puoi creare in formato tradizionale come PNG o JPEG.

Ora che è difficile trovare un’applicazione per creare formati di immagine di nuova generazione. Invece, puoi caricare immagini PNG o JPEG sul tuo sito WordPress e utilizzare un plug-in per convertirle in uno dei formati di immagine di nuova generazione. Questo è un modo efficace e semplice in quanto non è necessario modificare il modello di lavoro.

Poiché Google è il proprietario proprietario del formato WebP, molti plugin supportano la conversione di immagini tradizionali in formato WebP. Qui, spiegheremo come convertire le tue immagini in WebP e correggere "pubblica immagini in formato di nuova generazione" nello strumento PageSpeed ​​Insights.

Plugin WebP per WordPress

Ci sono alcuni plugin popolari disponibili per la conversione WebP.

Ottimizzatore SG per SiteGround

Se stai ospitando su SiteGround, l’opzione migliore è utilizzare il plug-in SG Optimizer. Funzionerà immediatamente per convertire e servire immagini WebP dal tuo server. Puoi scegliere il livello di compressione per controllare la qualità delle immagini convertite mantenendo tutte le immagini originali. Dai un’occhiata al nostro articolo precedente su come servire immagini WebP in SiteGround.

  • Puoi semplicemente abilitare l’opzione "Genera copie WebP di nuove immagini" nella sezione "Ottimizzatore SG > Ottimizzazione immagine".
  • Fare clic sul pulsante "Genera file WebP in blocco" per generare immagini WebP per tutte le immagini esistenti con un livello di compressione lossless o predefinito.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Opzione WebP nel plugin SG Optimizer

Offerta SEO: ottimizza il tuo sito con la speciale prova gratuita di 14 giorni di Semrush Pro.

Smush Pro

Smush è un altro popolare plugin per la compressione delle immagini con oltre 1 milione di installazioni attive. Tuttavia, WebP è un’opzione premium in questo plug-in e devi pagare un abbonamento di $ 5 al mese (piano annuale) per utilizzare questa funzione.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Opzione Smush Pro WebP

Ottimizzazione automatica

Questo plugin offre l’ottimizzazione al volo delle immagini con conversione WebP utilizzando il servizio ShortPixel CDN. Sebbene questa sia una buona opzione per combinare CDN e WebP, c’è un problema. Hai un limite per offrire gratuitamente fino a 100 immagini al mese. Se hai bisogno di più, devi pagare $ 3,99 al mese per avviare il piano premium per un massimo di 5000 immagini. Questa sarà un’opzione costosa quando si desidera comprimere e servire un numero elevato di immagini. Se vuoi provare Autoptimize, dopo aver installato e attivato il plugin, vai alla sezione "Impostazioni > Autoptimize > Immagini".

  • Abilita la casella di controllo "Ottimizza immagini".
  • Scegli il livello di ottimizzazione dell’immagine come lucido, senza perdite o con perdite.
  • Seleziona la casella che dice "Carica WebP o AVIF nei browser supportati?"
  • Abilitare "Immagini a caricamento lento?" casella di controllo.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Impostazioni WebP nel plugin Autoptimize

Fai clic sul pulsante "Salva modifiche" e prova lo strumento PageSpeed ​​Insights del tuo sito. Dovresti vedere che l’avviso "Pubblica immagini nei formati di nuova generazione" è scomparso ora. Tuttavia, inizierai a vedere un messaggio di avviso nel pannello di amministrazione di WordPress che ti informa che la tua quota ShortPixel è utilizzata e ti chiederà di aggiornare il piano.

Plugin WebP gratuiti

Fortunatamente, ci sono pochi plugin gratuiti disponibili come WebP Express e WebP Converter for Media. In questo articolo, spiegheremo il processo con il plug-in WebP Converter for Media.

Installa il plug-in WebP Converter per Media

Accedi al pannello di amministrazione di WordPress e vai alla sezione "Plugin > Aggiungi nuovo". Digita "webp" nella casella di ricerca per filtrare i risultati e scoprire il plug-in WebP Converter for Media. Fai clic sul pulsante "Installa" e quindi attiva il plug-in sul tuo sito.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Installa il plug-in WebP Converter per Media

Abilita la conversione delle immagini WebP

Dopo aver attivato il plugin, vedrai un messaggio come di seguito e fai clic sul pulsante "Velocizza il mio sito web". In alternativa, puoi andare al menu "Impostazioni > Convertitore WebP" per raggiungere la pagina delle impostazioni del plugin.

  • Seleziona la modalità di caricamento dell’immagine come "tramite .htaccess (consigliato)".
  • Scegli JPEG, JPG e PNG per le estensioni di file supportate.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Modalità di caricamento delle immagini ed estensioni dei file

  • Per l’elenco delle directory supportate, scegli l’opzione "/uploads". Assicurati di servire le immagini dalla cartella di caricamento predefinita di WordPress. Se hai spostato le tue immagini nel sottodominio, seleziona quella directory in modo che il plugin funzioni correttamente.
  • Per il metodo di conversione, scegli l’opzione "GD (consigliato)".
  • Infine scegli la qualità dell’immagine secondo le tue necessità. Il plugin utilizza l’85% come valore di qualità predefinito per la conversione WebP.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Conversione directory e qualità

Il plugin utilizza anche alcune funzionalità extra per l’ottimizzazione dell’immagine aggiuntiva. Puoi lasciare i valori predefiniti così come sono o controllare e abilitare/disabilitare i valori necessari per le tue necessità. Ad esempio, puoi scegliere la memorizzazione nella cache del browser per i file WebP che consigliamo e scegliere la rimozione di file WebP più grandi. Fare clic sul pulsante "Salva modifiche" dopo aver selezionato tutte le opzioni.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Proprietà aggiuntive

Rigenera immagini

Il plug-in WebP Converter for Media offre anche un’opzione per rigenerare tutte le tue immagini per convertirle in formato WebP. Questo è utile se hai delle immagini caricate sul sito prima di installare il plugin.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Rigenera immagini WebP

Controlla in Google Chrome

Dopo aver rigenerato tutte le immagini esistenti, puoi aprire il sito Web in Google Chrome e controllare. Dovresti vedere che le immagini WebP vengono servite dalla sezione degli strumenti per sviluppatori. Puoi controllare questo articolo su come controllare che le immagini WebP siano servite sul browser Chrome. Se hai abilitato la memorizzazione nella cache del browser, copia semplicemente l’URL dell’immagine e verifica che il nome del file contenga .webp.

Problema di supporto del server

Sfortunatamente, non tutti i server Web supportano la conversione WebP. Puoi trovarlo se la sezione "Metodo di conversione" è disabilitata nelle impostazioni del plug-in. Il tuo server dovrebbe avere la libreria supportata GD o Imagick installata per supportare il formato WebP. In caso contrario, il plug-in mostrerà un errore e non dovresti essere in grado di utilizzare la conversione WebP. Per quanto abbiamo testato, i server di hosting condiviso Bluehost non supportano la conversione WebP e vedrai un messaggio di errore come di seguito.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Errore di configurazione del server per WebP

In questo caso, devi discutere con l’host per abilitare il supporto necessario per le immagini WebP.

Abilita la memorizzazione nella cache per le immagini WebP utilizzando WP Rocket

Come accennato, il plug-in WebP Converter for Media offre un’opzione per abilitare la memorizzazione nella cache del browser per le immagini WebP. Questo ti aiuterà ad accelerare il caricamento della pagina, indicando ai browser di memorizzare nella cache le immagini quando l’utente riapre le stesse immagini. Tuttavia, questa opzione non è disponibile con molti altri plugin e dovresti combinarla con le impostazioni del tuo plugin di memorizzazione nella cache. Ad esempio, se stai utilizzando WP Rocket, assicurati di abilitare la casella di controllo per la memorizzazione nella cache del browser nella sezione "Immagini". Ciò consentirà al plug-in di memorizzare nella cache le immagini WebP e di servirle sui browser supportati.

Come risolvere il problema delle immagini di servizio nei formati di nuova generazione in WordPress?

Abilita il supporto WebP in WP Rocket

Fonte di registrazione: www.webnots.com
Lascia una risposta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More