La conversione WebP attivata non determina quale immagine viene scaricata dal browser. Verifica la richiesta reale nella scheda Network: URL selezionato, intestazione Content-Type, dimensioni e dimensione della risposta. Solo allora stabilirai se il problema è l’assenza della variante corretta, una regola del server, la cache o un’immagine troppo grande.

Pannello Network con tre illustrazioni e schede immagine nei formati JPEG e WebP

Questa guida è destinata ai proprietari di negozi PrestaShop che hanno già WebP, ma continuano a vedere immagini pesanti o un punteggio di prestazioni scarso. Contiene un test reale e controllato su tre illustrazioni e un metodo per separare la conversione del file dalla sua consegna al cliente.

1. Inizia dalla foto visibile in una pagina specifica

Scegli un’immagine nella scheda prodotto oppure nell’elenco prodotti. Non iniziare da un file casuale nella directory del server: il tema può usare una miniatura diversa, una variante per schermi con maggiore densità di pixel o un URL da CDN. Il WebP dell’originale non sostituisce automaticamente tutte le dimensioni necessarie.

Apri gli strumenti per sviluppatori, vai su Network, disattiva la cache durante il test e ricarica la pagina. Seleziona il filtro immagini. Per le foto caricate in lazy loading, scorri fino al punto da analizzare. Annota URL, tipo di risposta, dimensione e informazione se i dati sono stati effettivamente scaricati dalla rete. Queste opzioni sono descritte nella documentazione Network di Chrome DevTools.

Non confrontare il download completo di un JPEG con una riga WebP contrassegnata come memory cache. Un risultato del genere descrive condizioni diverse. Allo stesso modo, un trasferimento ridotto con risposta 304 non significa che il file grafico stesso abbia improvvisamente pochi byte.

2. Un indirizzo .jpg può restituire WebP

Nel codice sorgente di WebP Pro 2.1.3 la consegna dell’immagine può funzionare tramite regole Apache: una richiesta JPG o PNG viene riscritta verso una variante WebP esistente, se il browser dichiara di supportarla. L’indirizzo visibile nell’HTML può quindi continuare a terminare con .jpg, mentre la risposta può avere tipo image/webp.

Per questo la sola visualizzazione del codice della pagina non basta per concludere “WebP non funziona”. Verifica il formato della risposta ricevuta. D’altra parte, la dicitura .webp nelle impostazioni o l’esistenza del file sul disco non dimostrano che la regola corretta venga eseguita sul server che gestisce il negozio.

Come interpretare l’osservazione dal browser
OsservazionePossibile conclusionePasso successivo
URL .jpg, Content-Type image/webpIl server ha fornito WebP mantenendo l’indirizzo sorgente.Verifica dimensioni e byte di questa variante.
URL .jpg, Content-Type image/jpegIn questo test è stato fornito JPEG.Verifica la presenza della variante WebP esatta, le regole del server e la cache.
WebP esiste, ma riguarda una dimensione diversaLa conversione non corrisponde al file selezionato dal tema.Completa il tipo di miniatura necessario o l’ambito corretto della coda.
L’immagine proviene da CDNLa risposta non viene fornita direttamente dalla regola del server principale del negozio.Verifica formato, chiave cache e aggiornamento lato CDN.
WebP ha una risoluzione elevataIl formato può essere corretto, ma l’immagine selezionata è ancora troppo grande.Confronta le dimensioni naturali con la dimensione di visualizzazione.

3. Verifica srcset, picture e la variante selezionata

Con le immagini responsive il browser sceglie la risorsa tenendo conto delle condizioni della pagina e del dispositivo. Verifica l’elemento img, eventuali srcset e sizes, e nel caso di picture anche gli elementi source. La proprietà currentSrc aiuta a indicare l’indirizzo effettivamente selezionato, invece di basarsi sulla prima voce nel codice.

L’elemento picture consente di fornire sorgenti alternative, ad esempio in base al formato o a una condizione media; le regole di selezione sono presentate nella documentazione dell’elemento picture. Non tutti i temi utilizzano questo meccanismo e non tutti i negozi hanno bisogno di modificare l’HTML, se la negoziazione del formato lato server funziona correttamente.

Ripeti il test per il telefono. Una foto larga 2000 px usata in una piccola miniatura resta un carico inutile, anche dopo la conversione. La scelta della dimensione e la scelta del formato sono due impostazioni separate.

4. Misurazione propria: tre illustrazioni JPEG e WebP

Per il test controllato abbiamo usato tre illustrazioni blog esistenti nella dimensione di 700 × 400 px. Ogni JPEG è stato convertito tramite PHP 8.1.34 e GD 2.3.3 in WebP con parametro qualità 80. Non abbiamo modificato né le dimensioni né l’inquadratura. Chromium ha scaricato sei file da un server HTTP locale con cache disattivata e senza CDN.

La fonte delle miniature era una copia locale di PrestaShop 8.2.8 con Warehouse 4.7.2. La misurazione stessa è stata eseguita su una pagina comparativa separata, quindi non misura il tempo di apertura della scheda prodotto né l’effetto dell’implementazione del modulo. Indichiamo i byte del contenuto delle risposte ricevute, senza intestazioni di trasporto. Tutte e sei le richieste si sono concluse con HTTP 200 e con il tipo immagine corretto.

Dimensione della risposta misurata per le stesse tre illustrazioni
Illustrazione, 700 × 400 pxJPEG, image/jpegWebP, image/webpFile da confrontare
Reso parziale64 824 B35 040 BJPEG / WebP
Merchant Center61 499 B29 286 BJPEG / WebP
Checkout60 485 B30 742 BJPEG / WebP
Totale186 808 B95 068 BDifferenza: 91 740 B in questo test.

Il risultato mostra le dimensioni di file concreti. Non dimostra che ogni WebP sarà più piccolo dello stesso valore né che entrambe le codifiche abbiano una qualità visiva identica. I parametri di qualità dei diversi formati non sono una scala comune. Osserva le immagini nella dimensione reale d’uso, prestando attenzione a scritte, texture fini e bordi netti.

5. Verifica la coda e solo dopo ripeti la conversione

In WebP Pro 2.1.3 il salvataggio o il ridimensionamento dell’immagine può aggiungere un’attività alla coda. La variante pronta viene creata dopo la sua esecuzione. Durante la diagnosi verifica se è stato selezionato l’ambito corretto, se l’attività è stata elaborata e se non si è conclusa con un errore. Il semplice salvataggio della pianificazione non avvia automaticamente l’attività di sistema CRON.

Anche la modifica della qualità non deve necessariamente cambiare subito i file esistenti. Nel codice esaminato un WebP già presente può essere saltato al di fuori della modalità di sovrascrittura. Se modifichi consapevolmente la qualità, pianifica la rigenerazione dell’ambito necessario e poi verifica il risultato. Non avviare una rigenerazione completa dell’intero negozio per ogni piccola discrepanza.

Se hai bisogno di istruzioni sul processo stesso di creazione delle miniature, leggi la guida sulla generazione e rigenerazione delle immagini. Qui il punto di arrivo è l’immagine ricevuta dal cliente.

6. Verifica separatamente cache, CDN e LCP

Nella negoziazione del formato è importante che il livello intermedio distingua le varianti di risposta. Le regole di WebP Pro prevedono Vary: Accept quando è disponibile il modulo intestazioni di Apache. Questo però non significa una configurazione automatica di qualsiasi CDN o Nginx. Verifica la risposta reale dal punto da cui il browser la scarica.

Dopo aver modificato l’immagine, aggiorna la cache corretta e ripeti lo stesso identico test. Annota il dispositivo selezionato, lo stato della cache, l’URL e le dimensioni. Senza questi dati, il confronto “prima e dopo” mescola facilmente immagini diverse o condizioni diverse.

Un file più piccolo può ridurre il tempo di download, ma LCP comprende anche altre fasi, tra cui l’attesa del server, la scoperta della risorsa e la sua visualizzazione. La guida di Google sull’ottimizzazione di LCP mostra perché la sola compressione non risolve ogni ritardo. Non promettere un punteggio PageSpeed 100 basandoti solo sul formato.

Passo successivo: se manca la generazione o la consegna delle varianti corrette, verifica WebP Pro per PrestaShop. Se le immagini sono corrette ma la pagina è ancora lenta, prepara i risultati di Network e richiedi una diagnosi delle prestazioni del negozio.

Verificato il 13.09.2026. Meccanismi del modulo: codice WebP Pro 2.1.3. Misurazione delle illustrazioni: test HTTP controllato separato; non è una misurazione della velocità del negozio in produzione.

Prodotti correlati

SEO e velocità del negozio

Immagini in formato WebP Pro modulo per PrestaShop

PrestaDev.pl
PDWEBPPRO
149,00 zł 121,14 złnetto
2 Recensioni
Il modulo consente di implementare le immagini di prodotti, categorie, produttori, fornitori, immagini dei moduli, dei template ecc. nel formato WebP. Il formato WebP è destinato a diventare il nuovo standard aperto per la grafica compressa su Internet come diretto concorrente del più vecchio formato JPEG, con dimensioni inferiori a parità di qualità. Con...
Vedi gli articoli dell'autore
Patryk Marek

Patryk Marek — proprietario di PrestaDev.pl e sviluppatore specializzato in PrestaShop. Da molti anni si occupa della creazione, dello sviluppo e della manutenzione di negozi online. Unisce il lavoro sul codice del negozio e dei moduli alla configurazione dell’ambiente server in cui queste soluzioni operano.

Progetta e sviluppa moduli PrestaShop, adatta le funzionalità esistenti e prepara integrazioni con grossisti e servizi esterni. Lavora sull’importazione e sull’aggiornamento dei dati dei prodotti, sull’automazione della gestione del catalogo, sul processo dell’ordine e sugli strumenti che supportano il lavoro quotidiano del proprietario del negozio.

La sua esperienza comprende anche aggiornamenti e migrazioni dei negozi, diagnosi degli errori, analisi delle prestazioni e configurazione dei server e dei servizi necessari al funzionamento di PrestaShop. Nella risoluzione dei problemi tiene conto delle dipendenze tra moduli, tema, PHP, database e impostazioni di hosting.

Nel blog condivide conoscenze derivanti da molti anni di pratica nello sviluppo e dal lavoro con il backend tecnico dei negozi. Le guide si concentrano su problemi concreti, sui modi per verificarli e sui limiti delle soluzioni descritte. Aiutano i proprietari dei negozi e le figure tecniche a preparare le modifiche, valutarne la portata e verificarne il risultato.

Commenti (0)

Nessun commento in questo momento

Nuovo commento

Stai rispondendo a un commento