Come ottimizzare le immagini del suo e-commerce PrestaShop

Cómo optimizar las imágenes de tu ecommerce en Prestashop
Le immagini hanno un peso enorme nel suo negozio online. Sono indispensabili per conquistare la fiducia del cliente, che ha bisogno di vedere il prodotto come se fosse in un negozio fisico prima di decidersi ad acquistarlo. Per questo un e-commerce contiene moltissime immagini che, se non vengono esportate con la risoluzione e la qualità giuste, possono rallentare il caricamento e, di conseguenza, far scappare l'utente dal suo negozio. In Línea Gráfica le spieghiamo come ottimizzare le immagini per evitare che succeda: continui a leggere!

Perché è importante ottimizzare le immagini?

Ormai è chiaro: una delle principali conseguenze di un e-commerce che non si carica a una velocità adeguata a causa della risoluzione e delle dimensioni delle sue immagini è che i visitatori abbandonano la pagina. Come abbiamo detto più di una volta, gli utenti non sono disposti ad aspettare sapendo che ci sono altri siti in grado di offrire gli stessi contenuti più velocemente. Un sito lento a caricarsi è sinonimo di una frequenza di rimbalzo molto alta. Inoltre, le reti 3G e 4G di uno smartphone non si avvicinano nemmeno lontanamente alla velocità della banda larga di casa. Considerando questo e il fatto che sempre più utenti navigano da dispositivi mobili, è fondamentale non trascurare la velocità di caricamento delle immagini del suo negozio. Ma non finisce qui. Anche il gigante di Internet tiene molto in considerazione la velocità di caricamento di un sito ai fini del posizionamento SEO. Come può immaginare, Google ha a disposizione un tempo limitato per scansionare il suo sito. Questo significa che più il suo negozio è veloce ad aprirsi, più pagine del suo e-commerce Google potrà scansionare e, di conseguenza, maggiori saranno le possibilità di comparire tra i primi risultati del suo motore di ricerca. Ma partiamo dall'inizio…

Che qualità devono avere le immagini?

Come le stiamo raccontando, le immagini sono un elemento fondamentale per qualsiasi negozio online. Per questo vogliamo che lei conosca anche i parametri da tenere presenti quando si tratta di scegliere e ottimizzare le immagini del suo sito.

Risoluzione

Innanzitutto bisogna capire che salvare un'immagine da pubblicare su Internet non è come salvarla per la stampa. Sono due modi di visualizzare un'immagine su supporti molto diversi: uno schermo e la carta. Per questo la cosa più importante è verificare con un programma di fotoritocco (come Photoshop, Illustrator o GIMP) che la risoluzione sia di 72 ppi (pixel per pollice). Più alto è questo valore, maggiore è la qualità. Per mostrarla su un sito web, 72 ppi sono più che sufficienti, mentre per stamparla, per esempio su un manifesto, ne servirebbero circa 300.

Formato

Di sicuro, al momento di salvare un'immagine, le saranno comparsi diversi formati e le sarà sorta qualche domanda: pesa di più il PNG o il JPG? Per questo è importante sapere a cosa serve ciascun formato, perché alcuni possono essere più utili per ottimizzare le immagini. Dietro ognuno c'è un mondo, ma non si preoccupi: Le diamo le informazioni essenziali per capire quando usare l'uno o l'altro:
  • JPG: È il formato universale per le fotografie, perché è quello che le comprime meglio senza alterarne i toni né i colori originali. È quindi perfetto per immagini ricche di dettagli. Inoltre può regolare la qualità da 0 a 100. Per esempio, se salva con qualità 80 noterà a malapena la differenza di nitidezza, ma vedrà eccome quella di peso: l'immagine occuperà circa il 30% in meno.
  • PNG: Permette di conservare le trasparenze, e per questo è il formato migliore per le immagini di brand, come loghi o grafiche a tinte piatte. Il suo grande vantaggio è che perde poca qualità durante la compressione. Ma c'è differenza tra PNG 8 e PNG 24? La differenza tra i due formati è che il PNG 8 memorizza al massimo 256 colori, mentre il 24 arriva a 16 milioni di colori. Le consigliamo di usare il PNG 8 solo per immagini che non richiedono trasparenze e hanno pochi colori.
  • GIF: Usi questo formato solo quando le sue immagini contengono un'animazione. Tenga presente che non si comprime con una buona qualità, perché le animazioni includono diversi fotogrammi, cioè contengono più di un'immagine.
  • WEBP: questo formato, sviluppato da Google qualche anno fa, offre immagini di alta qualità ma più leggere rispetto ad altri formati come PNG o JPG. Per questo, dato che ottimizza enormemente il peso delle immagini senza sacrificarne la qualità, è un formato ideale per i siti web.

Dimensioni

Di solito si tende a salvare l'immagine nelle dimensioni predefinite, o addirittura in grande, pensando che così si vedrà meglio sul sito. Ma avrà notato che la qualità e nitidezza delle sue immagini dipendono soprattutto dalla risoluzione e dal formato con cui le esporta. Quindi lasci perdere l'idea di salvare le immagini in grande: aumenterebbero di peso in modo considerevole e del tutto inutile, se poi sulla pagina vengono mostrate molto più piccole. Per questo le consigliamo di esportare tutte le immagini nella dimensione reale in cui verranno mostrate sul sito, cioè con le dimensioni che usa nel suo PrestaShop. Se un'immagine deve occupare uno spazio di 50 px x 70 px, la ridimensioni a quella misura. Così ridurrà notevolmente il peso delle sue foto senza perdere qualità né ottenere immagini sgranate. Che senso ha avere un'immagine più grande se i suoi utenti la vedranno ridotta?

Che dimensioni usare per le foto dei prodotti?

In Aspetto > Impostazioni immagini del suo PrestaShop può filtrare per prodotti e vedere le dimensioni di tutte le immagini prodotto del suo negozio. impostazioni immagini prodotti in prestashop Così, per esempio, se l'immagine prodotto più grande che ha è di 1000 px x 1000 px, per quel tipo dovrà usare immagini con quelle stesse dimensioni. Se in quel caso usa un'immagine più piccola, risulterà sgranata. In altre parole, dovrà adattare ogni immagine al formato o alle dimensioni che ha impostato. Per quanto riguarda il peso di queste immagini, è consigliabile che non superino i 100 KB, altrimenti rallenteranno il caricamento del suo e-commerce.

Strumenti per ottimizzare le immagini

Ecco una serie di buone pratiche e strumenti che renderanno il suo negozio online molto più veloce. Se il suo negozio è già online, la prima cosa da fare è controllare la velocità di caricamento. Le consigliamo di analizzarla con PageSpeed. È semplicissimo: basta inserire il suo URL, cliccare su «Analizza» e compariranno i risultati, suddivisi in diagnostica e opportunità. Inoltre, cliccando sulle frecce a destra vedrà come correggere questi errori. strumenti ottimizzazione immagini per prestashop ottimizzare immagini web con pagespeed Ora non resta che ridurre il peso di quelle immagini e sostituirle, quindi le salvi sul suo computer. Una volta salvate tutte, usi uno strumento per comprimere le immagini. Noi le mostriamo Compresspng e Compressjpg, ma può usarne uno qualsiasi, perché funzionano in modo molto simile e sono piuttosto intuitivi. Per prima cosa, carichi le immagini su Compresspng o Compressjpg a seconda del formato, cliccando su Upload Files. In base al numero e al peso delle immagini, la compressione richiederà più o meno tempo. Al termine, le scarichi da Download ZIP. Ecco le sue immagini compresse! Ora non deve far altro che ricaricarle sul suo sito. comprimere immagini per prestashop E se invece vuole caricare nuove immagini sul sito, basta esportarle nel formato giusto e con una risoluzione di 72 ppi da un programma di fotoritocco. In Photoshop e GIMP deve salvarle con Salva per web. Si aprirà una finestra in cui potrà scegliere il formato: scelga quello più adatto in base a quanto le abbiamo spiegato prima. Può anche controllare e modificare la risoluzione in Immagine > Dimensione immagine. ottimizzare immagini web per prestashop con photoshop In sintesi: consigli per ottimizzare le immagini per il web

Modulo PrestaShop per ottimizzare le immagini

Come abbiamo detto all'inizio dell'articolo, migliorare la velocità di caricamento non è un vantaggio solo per l'utente che naviga con calma nel nostro negozio PrestaShop. Google, sempre affamato di siti di qualità, dà così tanta importanza al tempo di apertura di un e-commerce che, se si carica a una velocità accettabile, lo farà comparire nelle prime posizioni. E cosa significa? Che se ha un negozio online fantastico, ma ce l'ha anche il suo concorrente e in più si carica più velocemente, Google posizionerà il suo davanti al suo nei risultati di ricerca. Sa già che offrire comodità, trasparenza e sicurezza è la base di qualsiasi negozio digitale. Lo sa, certo, e comprendiamo anche le difficoltà che comporta. Per questo, con l'obiettivo di presentarle tutte le alternative per migliorare la velocità di caricamento, le proponiamo la più comoda ed efficace. Il Modulo PrestaShop per ottimizzare le immagini firmato Línea Gráfica è l'aiuto che le serve per trasformare il suo negozio PrestaShop in un vero peso piuma. Questo modulo riduce il peso delle immagini del suo sito senza perdita di qualità, grazie a un sistema intuitivo e facilissimo da usare:
  • Scelga la percentuale di riduzione che desidera per i file JPG e JPEG.
  • Selezioni il livello di riduzione da applicare ai file PNG.
  • Selezioni le immagini del negozio che non vuole comprimere. Un logo, per esempio.

Scopri il modulo per comprimere le immagini!

Se cercava una spinta rapida per migliorare la velocità e il posizionamento del suo sito, l'ha trovata. Verificare i risultati in tempi record e offrire un'esperienza migliore non è mai stato così semplice! E se dopo tutto questo non sa ancora come migliorare la velocità di caricamento in PrestaShop, niente paura: abbiamo preparato la guida definitiva passo dopo passo!

E lei, usa altri strumenti per ottimizzare le sue immagini? In Línea Gráfica siamo esperti di marketing digitale e Partner Platinum PrestaShop: se ha bisogno di una mano per posizionare il suo negozio, non deve far altro che contattarci.

Álvaro Criado
Aggiornato il