Ottimizzare le immagini è la chiave per avere un sito web veloce ed efficace

,

Tra le regole del web la velocità è sempre stata ai primi posti, vediamo quali sono i vantaggi di usare immagini ottimizzate

È un passaggio molto semplice e alla portata di chiunque, eppure viene spesso sottovalutata l’ottimizzazione delle immagini in un sito. I vantaggi sono un caricamento istantaneo delle pagine (soprattutto sui dispositivi mobile) e di conseguenza un migliore posizionamento sui motori di ricerca. Un sito veloce influenza la SEO!

Le strategie per avere un sito veloce sono molte: puoi comprimere il codice, adottare la tecnologia AMP per i contenuti, sfruttare la memoria cache dei browser, avere un server ad alte prestazioni, eccetera. È tutto vano se poi usi immagini pesanti ed eccessivamente grandi, non adatte al web, che ritardano la visualizzazione dei contenuti.

Scegli il formato giusto

Esistono moltissimi formati per i file delle immagini, ma solo pochi di questi possono essere usati in un sito. I principali formati per il web, supportati da tutti i browser, sono tre: JPG, GIF e PNG. Ognuno di questi formati va usato in un determinato contesto. In generale si usa:

  1. JPG per le fotografie, per le immagini grandi, con molti colori e sfumature;
  2. il formato GIF si usa per immagini molto piccole, con pochi colori e/o sfondo trasparente, per semplici animazioni (le famose GIF animate), icone, loghetti…
  3. il PNG è una sorta di evoluzione del GIF, permette l’uso di un numero maggiore di colori, sfumature più accurate e trasparenze più elaborate.

Tutti questi formati sono pensati per ridurre il peso delle immagini al minimo, tuttavia ci può essere un’enorme differenza tra una JPG ottimizzata e la stessa JPG non ottimizzata.

PPI (pixels per inch, cioè pixel per pollice)

A prescindere dal formato scelto, le immagini hanno una risoluzione. Si tratta di un valore che indica la densità di punti o pixel per ogni pollice quadrato (DPI o PPI). Un’immagine che deve essere usata nel web, deve essere di 72 o, al massimo 96 ppi (per immagini che devono apparire a una migliore risoluzione su schermi ad alta definizione). Questo perché la maggior parte dei monitor a definizione standard sono impostati a 72 ppi.

Tuttavia molti dispositivi moderni hanno una risoluzione superiore. I MacBook attualmente in commercio hanno uno schermo da oltre 200 ppi, per esempio. Su uno schermo di questo tipo potresti visualizzare immagini con 200 ppi di risoluzione, ma il loro caricamento richiederebbe molto più tempo. Si tratta sempre di trovare un compromesso tra qualità e velocità di caricamento.

I tool per un’ottimizzazione avanzata delle immagini

Se usi Adobe Photoshop per modificare, tagliare, unire le immagini per il tuo sito, devi prepararle e salvarle nel modo corretto. Oltre a impostare 72 ppi come risoluzione, dovrai salvare scegliendo File > Esporta > Salva per web (o File > Salva per web se usi una versione datata). Si aprirà una schermata che ti permetterà di scegliere il formato e impostare alcuni parametri. Puoi impostare la qualità della JPG o il numero di colori della GIF che vuoi ottenere. Chiaramente, una qualità o un numero di colori inferiori corrisponderanno a immagini più leggere, a scapito della qualità delle stesse.

Photoshop non basta: il file ottenuto salvando per il web può essere ulteriormente compresso, evitando grandi perdite di qualità. Per farlo puoi usare strumenti come ImageOptim per Mac oppure FileOptimizer per PC Windows. Sono molto semplici da configurare e da usare, ma permettono di ridurre incredibilmente il peso delle immagini JPG e PNG.

Le dimensioni contano

Se l’immagine che vai a usare nel tuo sito sarà collocata, per esempio, in uno spazio quadrato di 300 per 300 pixel, ridimensionala e salvala in quel formato esatto.

Molto spesso la principale causa di lentezza della home di un sito è l’uso folle di 4 o 5 immagini larghe 2000 pixel nello slider a inizio pagina. Si arriva a questo quando si pretende la massima qualità anche visualizzando il sito su schermi molto grandi, senza considerare che ciò rallenta gravemente il caricamento della home, in cambio di un vantaggio estetico trascurabile. Né a Google, né ai tuoi clienti interessa vedere quelle fotografie in HD, ma tutti apprezzano una navigazione rapida, specialmente sullo smartphone.

Anche le immagini che vengono usate negli articoli di un blog andrebbero ottimizzate con cura prima di essere caricate, invece nella maggior parte dei casi, sono usate così come vengono acquistate (a una risoluzione esagerata), affidando a WordPress o a pesanti plugin la loro gestione, con scarsissimi risultati. WordPress, nonostante abbia qualche funzionalità da editor di immagini, non darà mai risultati paragonabili a quelli di specifici strumenti di editing.

Come avrai capito non è affatto banale, per chi non è del mestiere, considerare tutti gli aspetti e le variabili che contribuiscono a creare un sito veloce e ben posizionato. Per questo ti conviene valutare l’importanza di affidarti a un team di professionisti, che non lascerebbe nulla al caso.

Per curiosità, verifica subito le prestazioni del tuo sito web, collegandoti a questo strumento gratuito messo a disposizione da Google!

Se ottieni un punteggio basso, significa che c’è qualcosa che non funziona. Potresti aver bisogno di ottimizzare le immagini e non solo.

Possiamo aiutarti a raggiungere risultati sorprendenti!

CONTATTACI