Una fotografia scattata con uno smartphone recente può pesare diversi megabyte e misurare migliaia di pixel di larghezza. Caricata così com’è sul sito, rallenta il caricamento soprattutto da rete mobile, consuma traffico dei visitatori e peggiora le metriche di velocità. Eppure la stessa immagine, preparata correttamente, può pesare meno di duecento kilobyte con una resa visiva quasi identica.
Le dimensioni giuste
La prima regola è non caricare immagini più grandi di quanto serva. Se un’immagine viene mostrata al massimo a 1200 pixel di larghezza, caricarla a 4000 pixel non aggiunge qualità visibile. WordPress genera automaticamente diverse versioni ridimensionate e il browser sceglie quella più adatta allo schermo, ma partire da un originale ragionevole aiuta comunque.
I formati moderni
- WebP: supportato da tutti i browser attuali, offre file molto più leggeri del JPEG a parità di qualità.
- AVIF: ancora più efficiente in molti casi, con un supporto ormai ampio.
- JPEG: ancora valido per le fotografie, se ben compresso.
- PNG: da usare solo per grafiche con trasparenza o pochi colori.
- SVG: ideale per loghi e icone, perché resta nitido a qualsiasi dimensione.
L’immagine più grande visibile all’apertura della pagina non va caricata in modo differito: deve arrivare per prima. Il caricamento differito va applicato alle immagini più in basso.
La compressione
Esistono strumenti gratuiti e plugin che comprimono le immagini al caricamento. Una qualità tra il 70 e l’85 per cento è di solito invisibile all’occhio ma riduce molto il peso. Conviene controllare il risultato sulle immagini con molti dettagli o sfumature, dove la compressione eccessiva può creare difetti.
Le dimensioni dichiarate
Indicare larghezza e altezza delle immagini nel codice permette al browser di riservare lo spazio prima che vengano caricate. In questo modo il testo non si sposta durante il caricamento, migliorando l’esperienza e l’indicatore CLS dei Core Web Vitals.
Testi alternativi e nomi dei file
- Il testo alternativo descrive l’immagine per chi non può vederla e aiuta i motori di ricerca a capirla.
- Deve essere breve e concreto: cosa mostra l’immagine e perché è lì.
- Le immagini puramente decorative possono avere un testo alternativo vuoto.
- Un nome del file descrittivo, come cucina-su-misura-rovere.webp, è preferibile a IMG_4521.jpg.
Foto autentiche e immagini di repertorio
Le immagini di repertorio sono comode, ma le stesse foto compaiono su centinaia di siti e trasmettono poca fiducia. Foto reali del team, dei lavori e dei luoghi, anche semplici ma ben illuminate, comunicano molto di più e differenziano l’azienda dai concorrenti.
Domande frequenti
Devo convertire tutte le vecchie immagini?
Esistono plugin che lo fanno in automatico. Conviene comunque verificare il risultato e fare un backup prima.
Le immagini influiscono sulla SEO?
Sì, sia tramite la velocità della pagina sia tramite Google Immagini, che può portare traffico.
Quanto deve pesare un’immagine?
Non c’è un limite fisso, ma per una foto a tutta larghezza un peso tra 100 e 250 kilobyte è un buon obiettivo.
I siti CMXD WebStart vengono consegnati con immagini ottimizzate per velocità e qualità. Vuoi sapere quanto pesano le pagine del tuo sito? Scrivici.
