Accelerare il tuo WordPress - Come salvare le immagini ottimizzate per il web

Stai salvando immagini sbagliate? La maggior parte dei principianti non sa come salvare correttamente le immagini che possono avere un enorme impatto sulla velocità del sito. In questo articolo, ti mostreremo come salvare correttamente le immagini ottimizzate per il web.

Ogni esperto di blog ti dirà che le immagini aiutano ad aumentare il coinvolgimento. Tuttavia ciò che non ti dicono è che non ottimizzando le immagini per il web può rallentare il tuo sito. Secondo Strangeloop, un ritardo di un secondo può costarti il ​​7% delle vendite, l'11% in meno di visualizzazioni di pagina e il 16% di diminuzione della soddisfazione dei clienti.

Video Tutorial

Se il video non ti piace o hai bisogno di ulteriori istruzioni, continua a leggere.

Come salvare le immagini correttamente?

Quando salvi le immagini, devi considerare due cose: formato di file immagine, e compressione. Scegliendo la combinazione giusta, puoi ridurre le dimensioni dell'immagine di 5 volte.

Per la maggior parte di noi, gli unici due formati di immagine che contano sono JPEG e PNG. Per semplificare le cose, usa i 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à più elevata. Lo svantaggio è 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.

Su WPBeginner, la maggior parte delle nostre immagini sono JPEG.

La prossima cosa è la compressione che significa usare uno strumento per salvare immagini ottimizzate per il web. La compressione può fare una grande differenza.

Vedi la tabella sottostante che evidenzia le poche combinazioni che avremmo potuto usare per salvare l'immagine di Strangeloop usata in questo articolo.

Strumenti di compressione delle immagini per i blogger

Ora che hai visto la differenza di ogni tipo di compressione, qui sotto puoi vedere come è possibile salvare correttamente le immagini ottimizzate per il web e velocizzare il tuo sito.

Adobe Photoshop

Adobe Photoshop è un software premium che viene fornito con una funzionalità per salvare immagini ottimizzate per il web. Basta aprire la tua immagine e fare clic sul pulsante File> Salva per Web e dispositivi.

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

Nota: comprendiamo che Photoshop è piuttosto costoso. GIMP è un'alternativa gratuita che gli utenti possono utilizzare. Altri prodotti Adobe come Fireworks possono fare il lavoro come wel.

TinyPNG

TinyPNG è un'applicazione web gratuita che utilizza una tecnica di compressione lossy intelligente per ridurre le dimensioni dei file PNG. Tutto quello che devi fare è andare sul loro sito web e caricare le tue immagini. Comprimono l'immagine e ti danno 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 le dimensioni delle immagini senza influire sulla loro 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 ti consente di comprimere le immagini senza perdere qualità, trovando i migliori parametri di compressione e rimuovendo i profili di colore non necessari.

L'alternativa a Windows è Trimage.

Come puoi vedere ci sono diversi strumenti che puoi usare per ottimizzare le immagini per il web. Quando si utilizza la compressione di Photoshop, abbiamo visto i risultati migliori in termini di dimensioni, tuttavia la qualità è stata influenzata. TinyPNG è stato un chiaro vincitore per aver salvato 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 le immagini può aumentare un po 'il carico di lavoro.

Considerazioni finali sull'ottimizzazione dell'immagine

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. Certo, la qualità dell'immagine potrebbe diminuire leggermente, ma la maggior parte degli utenti non se ne accorgerà.

Se stai cercando immagini di qualità, consulta la nostra guida su come trovare immagini royalty-free per i tuoi post sul blog.

Ultimo ma certamente non meno importante, l'utilizzo di una CDN per servire le immagini per il tuo sito WordPress può velocizzare significativamente il tuo sito. Dai un'occhiata a questa infografica per vedere che cos'è un CDN e utilizza la nostra guida su come impostare CDN per il tuo sito. Stiamo utilizzando MaxCDN per il nostro sito.

Ci auguriamo che tu abbia trovato utile questo articolo.

Hai amici blogger che stanno salvando immagini errate? Condividi questo articolo con loro, in modo che possano velocizzare il loro sito. Ti ringrazieranno per questo.

Se avete domande, quindi si prega di lasciare un commento qui sotto. Inoltre, non dimenticare di seguirci su Twitter e Google+