Lezione 8Ottimizzazione delle immagini e caricamento lento

Nozione 48

Selezionare il tipo di file corretto.

competenza target

Conoscere i diversi tipi di formati di immagine e i criteri principali per scegliere quello corretto.

"Il nostro cervello elabora le immagini 60.000 volte più velocemente rispetto a un testo".
"Conserviamo l'80% di ciò che vediamo, contro il 20% di ciò che leggiamo".

Per avere un'ottimizzazione efficiente del web e ridurre l'impatto ambientale, è importante fare la scelta giusta dei formati delle immagini. Una scelta sbagliata del formato ha un impatto notevole sul caricamento della pagina web e quindi aumenta il consumo di energia.
I formati di immagine più comunemente utilizzati sul web sono JPEG (Joint Photographic Experts Group); PNG (Portable Network Graphics); GIF (Graphics Interchange Format) e Webp.

Il formato JPEG
Questo formato è consigliato per le fotografie e la maggior parte delle immagini con colori e contrasti molto ampi. Lo svantaggio principale di questo formato è che causa una perdita di immagine. In altre parole, più l'immagine contiene colori distinti, meno il JPEG è comprimibile. Nonostante questo svantaggio, questo formato è il più utilizzato sul Web perché la qualità delle immagini è migliore rispetto agli altri formati.
Inoltre, a parità di peso, la quantità di informazioni contenute nel formato JPEG è più ricca rispetto al formato PNG. In questo caso, il peso è ottimizzato e richiede meno energia per l'archiviazione e il caricamento.

Formato PNG
Questo formato consente di comprimere un'immagine senza perdita di qualità e di informazioni.
È il formato ideale se si desidera inserire la trasparenza nelle immagini. La sua qualità di compressione è superiore a quella del formato GIF.

Il formato GIF
Il formato GIF consente il trasferimento di immagini e ha la capacità di combinare diverse immagini in un unico file. È in grado di supportare la trasparenza, ma offre solo 256 colori. Il grande vantaggio è che non perde informazioni durante la compressione.
GIF è il formato ideale per le immagini di piccole dimensioni che necessitano di pochi colori. D'altra parte, se l'immagine è più grande e ha molti colori, la qualità di quest'ultima ne risentirà e la dimensione del file sarà piuttosto elevata.
Si noti che questo formato è meno interessante del JPEG in termini di rapporto peso/qualità.

Il formato Webp
Questo formato combina i vantaggi degli altri tre (3) formati sopra citati. Crea immagini più piccole e più ricche, con un impatto più rapido sul web. La sua comprensione è di migliore qualità e avviene con o senza perdite