come-salvare-immagini-ottimizzate-per-il-web-correttamente

La maggior parte dei principianti non sa come salvare correttamente le immagini e che queste possono avere un impatto enorme sulla velocità di un sito web. In questa guida, ti mostreremo come salvare immagini ottimizzate per il web correttamente .

Ogni esperto di web ti dirà che le immagini aiutano ad aumentare il coinvolgimento degli utenti. Tuttavia, ciò che non ti dicono è che non ottimizzare le immagini per il web può rallentare il tuo sito. Secondo alcuni studi , un ritardo di un secondo può costare il 7% delle vendite, l’11% in meno di visualizzazioni di pagina e il 16% di riduzione della soddisfazione del cliente.

Come salvare correttamente le immagini?

Quando si salvano le immagini, è necessario considerare due cose: il formato del file di immagine e la compressione . Scegliendo la giusta combinazione, puoi ridurre le dimensioni dell’immagine di 5 volte.

Secondo noi, gli unici due formati di immagine che contano veramente sono JPEG e PNG. Per semplificare le cose, usa JPEG per foto o immagini con molto colore e usa i PNG per immagini più semplici o quando hai bisogno di immagini trasparenti.

Per coloro che non conoscono la differenza, il formato dell’immagine PNG non è compresso, il che significa che è un’immagine di qualità superiore. Il rovescio della medaglia è che la dimensione del file è molto più grande. D’altra parte, JPEG è un formato di file compresso che riduce leggermente la qualità dell’immagine al fine di fornire una dimensione del file significativamente più piccola.

La prossima cosa da tenere a mente è la compressione, che significa utilizzare uno strumento per salvare immagini ottimizzate per il web. La compressione può fare una differenza enorme.

Ecco l’esempio delle varie dimensioni per un immagine a caso usata per farti rendere conto delle differenze di peso tra i vari formati.

Formato immagine Dimensione dell’immagine
Photoshop ottimizzato JPEG high 33 KB
TinyPNG ottimizzato 57 KB
JPEG Mini ottimizzato 70 KB
JPEG ottimizzato per Photoshop Max 93 KB
JPEG non ottimizzato Max 119 KB
PNG ottimizzato per Photoshop 135 KB
PNG non ottimizzato 145 KB

Strumenti di compressione delle immagini

Ora che hai visto la differenza che fa ogni tipo di compressione, di seguito è riportato come puoi salvare correttamente le immagini ottimizzate per il web e velocizzare il tuo sito.

Adobe Photoshop

Adobe Photoshop è un software premium dotato di una funzione per salvare immagini ottimizzate per il Web. Basta aprire l’immagine e fare clic sul pulsante File> Salva per Web e dispositivi.

Questo aprirà una schermata di salvataggio. A destra, puoi impostare diversi formati di immagine. Per il formato JPEG, vedrai diverse opzioni di qualità. Quando selezioni le tue opzioni, ti mostrerà anche la dimensione del file in basso a destra.

salvare-immagini-ottimizzate-per-il-web-con-photoshop

Nota: comprendiamo che Photoshop è abbastanza costoso. GIMP è un’alternativa gratuita che gli utenti possono utilizzare. Altri prodotti Adobe come Fireworks possono fare il lavoro allo stesso modo.

TinyPNG

TinyPNG è un’app Web gratuita che utilizza una tecnica di compressione per ridurre le dimensioni dei file PNG. Tutto quello che devi fare è visitare il loro sito Web e caricare le tue immagini. Comprimeranno l’immagine e ti daranno il link per il download.

Per gli sviluppatori, hanno anche un’API per convertire automaticamente le immagini.

JPEG Mini

JPEGmini utilizza una tecnologia di ricompressione che riduce significativamente la dimensione delle immagini senza comprometterne la qualità percettiva. Puoi utilizzare la loro versione web gratuitamente o acquistare il programma per il tuo computer. Hanno anche un’API a pagamento per automatizzare il processo per il tuo server.

ImageOptim

ImageOptim è un’utilità Mac che consente di comprimere le immagini senza perdere la qualità trovando i migliori parametri di compressione e rimuovendo i profili di colore non necessari.

Alternativa di Windows a questo è Trimage .

Come puoi vedere, ci sono molti strumenti che puoi usare per ottimizzare le immagini per il web. Quando si utilizza la compressione Photoshop, abbiamo riscontrato i migliori risultati in termini di dimensioni, tuttavia la qualità è stata influenzata. TinyPNG è stato un chiaro vincitore per il salvataggio di qualsiasi tipo di PNG sul web.

Alcuni suggeriscono che è possibile utilizzare una combinazione di TinyPNG o JPEG Mini e Image Optim per risultati ancora migliori. Tuttavia, l’esecuzione di due strumenti separati per caricare immagini può aumentare leggermente il carico di lavoro.

Considerazioni finali sull’ottimizzazione delle immagini per il web

Se non stai salvando immagini ottimizzate per il Web, inizia a farlo ora. Può fare un’enorme differenza sulla velocità del tuo sito e i tuoi utenti ti ringrazieranno per questo. Sicuramente la qualità dell’immagine potrebbe diminuire leggermente, ma la maggior parte degli utenti non se ne accorgerà.

Ultimo ma certamente non meno importante, l’uso di una CDN per pubblicare immagini per il tuo sito WordPress può velocizzare notevolmente il tuo sito.

E’ tutto! Speriamo che questo articolo ti abbia aiutato ad imparare come salvare immagini ottimizzate per il Web correttamente.

Related Posts