SEO per immagini e tag Alt: 7 suggerimenti avanzati per aumentare il traffico con le immagini

Parlando di SEO per immagini, la prima cosa che ti verrà in mente è l'ottimizzazione dei tag alt, anche se in realtà l’ottimizzazione delle immagini include molte altre cose.

Non è raro trovare siti che presentano immagini di dimensioni enormi e nomi di file non descrittivi, e che queste siano visualizzate in dimensioni molto più piccole sul sito rispetto all'immagine originale. 

Spesso il problema è costituito dal fatto che le guide alla SEO per principianti si fermano solo alle basi; pertanto all’interno di esse si fa riferimento esclusivamente all’ottimizzazione dei tag alt.

Ma non dimenticare che la ricerca di immagini in sé è già una grande sfida, e che questa può indirizzare molto traffico verso il tuo sito. La nostra recente guida alla ricerca visiva può aiutarti a comprendere quanto la ricerca di immagini possa essere ardua.

E poi ammettiamolo, chi è che non l’ha mai usata per sfogliare foto di gattini?!

La SEO per immagini non è qualcosa che può essere ignorato, e in questa guida ti indicheremo i passaggi che puoi seguire per ottimizzare le immagini del tuo sito e posizionarti più in alto nelle ricerche di immagini. 

In questa guida alla SEO per immagini scopriremo:

• Perché le immagini sono così importanti?
• Cos’è la SEO per immagini?
• Cosa sono tag Alt e testo alternativo?
• Come ottimizzare il testo alternativo
• Come aggiungere i tag Alt sulle piattaforme di siti web più popolari
• In Che Modo le Immagini incidono sui Punteggi di PageSpeed
• 7 suggerimenti avanzati per l’ottimizzazione delle immagini: Oltre il testo alternativo
• Ottimizzazione delle immagini e aggiornamento della Google Page Experience
• Individuare i problemi relativi alle immagini del tuo sito

Perché le immagini sono così importanti?

Le immagini ti aiutano a dare un contesto ai tuoi contenuti.

Le immagini giuste possono aiutare l’utente a comprendere e a interagire meglio con il contenuto scritto, e a dividere blocchi di testo altrimenti troppo grandi.

Poche cose sono meno coinvolgenti di un blocco di testo ininterrotto di un paio di migliaia di parole. 

Ma al di là degli utenti, l’obiettivo di Google per il futuro è quello di passare alla ricerca visiva, e questo ha fatto partire un rinnovamento completo di Google Immagini un paio di anni fa.

Sempre più spesso vediamo immagini occupare posizioni di prestigio nelle SERP, spesso al di sopra dei risultati organici usuali.

Importante: Le immagini dovrebbero essere scelte con cura. 

Su tutti gli altri siti siamo abituati a vedere le classiche immagini stock, ma in realtà dovresti utilizzare immagini “fatte su misura per te”, che possano aiutarti a raccontare la storia che vuoi raccontare.

Non puoi negare l'importanza delle immagini e della ricerca di immagini. L'ottimizzazione delle immagini dovrebbe far parte della tua strategia SEO attuale, e dovresti considerarla come una delle migliori pratiche che puoi implementare.

Cos’è la SEO per immagini?

Più comunemente nota come ottimizzazione delle immagini, la SEO per immagini ha come obiettivo quello di migliorare le immagini presenti sul tuo sito web, per due principali motivi:

1. Per consentirti di posizionarti più in alto su Google Immagini.

2. Per migliorare la visibilità e l'ottimizzazione complessive di una pagina web.

Ciò implica l’esecuzione di diverse azioni che aiuteranno Google a comprendere meglio le immagini del tuo sito, tra cui la corretta denominazione dei file, l'aggiunta e l'ottimizzazione del testo alternativo, la riduzione delle dimensioni dei file e molto altro ancora. 

Una delle domande che ci vengono poste più di frequente in relazione alla SEO per Immagini è se queste azioni siano da considerarsi ancora necessarie, dati gli incredibili progressi compiuti da Google nell'utilizzo dell'Intelligenza Artificiale e dell'apprendimento automatico per il riconoscimento delle immagini.

La risposta è semplicemente “sì”. Google non è ancora in grado di leggere tutti i tipi di immagini, anche se la sua capacità di farlo è notevolmente migliorata negli ultimi anni. È anche importante sapere che la SEO per immagini non serve solo ad aiutare i motori di ricerca a capire cosa un'immagine stia mostrando. 

Le immagini scarsamente ottimizzate sono spesso causa della lentezza di caricamento delle pagine, e apportare dei miglioramenti in questo senso può avere un grande impatto sulla velocità di caricamento del sito, nonché sul punteggio PageSpeed.

Tuttavia, la SEO per immagini è spesso limitata alla sola ottimizzazione dei tag alt. È innegabile che si tratti di una parte importante del processo, ma dovrebbe essere considerata, appunto, solo una parte di questo. 

Detto ciò, comprendere cosa siano i tag alt e il testo alternativo, nonché le loro funzioni, è un ottimo punto di partenza.

Cosa sono tag Alt e testo alternativo?

Gli esperti di SEO parlano spesso di ottimizzazione dei tag alt o del testo alternativo; a volte li chiamano anche descrizioni alt o attributi alt. Sono termini usati in modo intercambiabile, per riferirsi alla medesima cosa.

Ma cosa sono?

Ecco come Matt Cutts l'ha spiegato molto tempo fa, in un modo semplice da capire. (Tutti noi sentiamo la mancanza di Matt)

I tag alt forniscono un'alternativa di testo a un'immagine per i motori di ricerca, e per coloro che usano screen reader per accedere a una pagina web. Inizialmente, il testo alternativo aveva il solo scopo di rendere le immagini accessibili ai non vedenti e alle persone affette da disabilità visive.

Molto semplicemente, si tratta di una descrizione testuale di un’immagine, volta a descrivere in modo chiaro ciò che l’immagine mostra. 

Fa parte del codice HTML di un tag immagine e si presenta come segue:

Il testo alternativo è il contenuto descrittivo che si trova all'interno dell'attributo alt assegnato ad un tag immagine.

Il testo alternativo può servire a migliorare le prestazioni SEO del tuo sito, poiché aggiunge ulteriori segnali di pertinenza a una pagina web e aiuta Google a comprendere meglio i contenuti di un'immagine, migliorandone il ranking.

Tuttavia, molti sbagliano nel fare ciò: non è difficile imbattersi in pagine web in cui viene utilizzato il medesimo testo alternativo per tutte le immagini - che corrisponde esattamente alla parola chiave di destinazione principale della pagina. 

Come ottimizzare il testo alternativo

Quando ottimizzi il testo alternativo di un’immagine, ci sono alcune regole di buona pratica che dovresti seguire. 

Creare tag alt descrittivi non deve essere difficile. È meglio non pensarci troppo e ispirarsi semplicemente al contenuto dell’immagine.

Spesso, per scrivere un buon testo alternativo è sufficiente utilizzare il buon senso e limitarsi a descrivere ciò che l’immagine mostra. Per semplificare, le buone pratiche da seguire sono essenzialmente tre.

LE 3 REGOLE DEI TAG ALT

1. Sii descrittivo e specifico 

Il testo alternativo dovrebbe sempre descrivere il contenuto di un'immagine nel modo più dettagliato possibile.

Sii quanto più specifico possibile quando descrivi un’immagine, in quanto questo la aiuterà a posizionarsi su Google Immagini e fornirà un contesto per far comprendere in che modo l’immagine si collega al contenuto della tua pagina.

2. Sii pertinente

I tag alt non sono un luogo in cui inserire parole chiave con corrispondenza esatta, e dovrebbero essere utilizzati esclusivamente per descrivere ciò che un'immagine mostra. 

I tag alt devono assolutamente essere pertinenti.

Prova a scrivere un testo alternativo che descriva le immagini e che consenta di capire il motivo per cui sono esse sono legate all'argomento della tua pagina, specialmente quando un'immagine è di natura più generica e non è specifica come altre. 

3. Sii originale

Non utilizzare la parola chiave di destinazione principale della tua pagina come tag alt per tutte le immagini presenti sulla tua pagina.

Assicurati sempre di scrivere un testo alternativo univoco che descriva il contenuto specifico dell'immagine, piuttosto che ripetere il contenuto di un’altra. 

Ma nella pratica, come dovrebbe apparire un testo alternativo ben ottimizzato? Proviamo a crearne uno per questa immagine che mostra due gattini:

Un tag alt che sia descrittivo, pertinente e originale potrebbe apparire così:

Questo tag alt è descrittivo per i motori di ricerca e gli screen reader ed include al contempo le parole chiave.

Come aggiungere i tag Alt sulle piattaforme di siti web più popolari

Diverse piattaforme di siti web dispongono già di opzioni di testo alternativo; dovrai solo accedervi. 

Come aggiungere un testo alternativo alle immagini su WordPress

Se utilizzi WordPress, aggiungere un testo alternativo alle tue immagini è davvero molto semplice.

È sufficiente fare clic su un'immagine nella finestra editor, dopodiché vedrai apparire l’apposito campo nella scheda Impostazioni immagine.

In alternativa, fai clic su un'immagine dalla libreria multimediale e potrai accedere all’opzione anche da qui.

Come aggiungere un testo alternativo alle immagini su Shopify

Se usi Shopify, puoi aggiungere il testo alternativo sia alle immagini dei temi che alle immagini dei prodotti. 

Per ottimizzare il testo alternativo delle immagini dei prodotti, vai a Prodotti > Tutti i prodotti e fai clic sull'elenco dei prodotti che desideri modificare. 

Nella pagina dei dettagli del prodotto, fai clic su un elemento multimediale e trova la pagina multimediale di anteprima. Adesso puoi fare clic per aggiungere un testo alternativo.

Per aggiungere un testo alternativo alle immagini dei temi, vai su Negozio Online > Temi e fai clic per personalizzare il tema del tuo negozio.

Nella parte sinistra della pagina vedrai il menù delle sezioni, dove potrai fare clic su un blocco di immagini e, da qui, su immagini singole.

Vedrai una casella di testo su cui potrai inserire il tuo testo alternativo.

Come aggiungere un testo alternativo alle immagini su Magento

Aggiungere un testo alternativo alle immagini in un negozio Magento è davvero molto semplice.

Fai clic su Catalogo > Prodotti, seleziona il prodotto a cui desideri aggiungere il testo alternativo e scorri fino alla sezione Immagini e Video.

Fai clic su un'immagine per modificare il testo alternativo. 

Come aggiungere un testo alternativo alle immagini su Wix

Fino a poco tempo fa, non era possibile aggiungere un testo alternativo alle immagini su un negozio Wix. Tuttavia, negli ultimi anni la piattaforma ha investito risorse per correggere i problemi SEO più comuni, ed oggi è finalmente possibile modificare il testo alternativo.

Puoi aggiungere un testo alternativo alle immagini attraverso la finestra di modifica, facendo clic sull’immagine a cui desideri aggiungere un testo alternativo e accedendo alle opzioni di impostazione. 

Una volta qui, seleziona l’opzione "Cosa c'è nell'immagine?" e aggiungi il tuo testo alternativo.

In che modo le immagini incidono sui punteggi di PageSpeed

L’ottimizzazione delle immagini è comunemente descritta come uno dei metodi più efficaci per migliorare il punteggio PageSpeed del proprio sito quando si utilizza lo strumento Google PageSpeed Insights.

In questo contesto, le immagini di grandi dimensioni sono considerate le “grandi colpevoli”, e questo ha perfettamente senso.

Il download di immagini più grandi richiede più tempo e questo, a sua volta, rallenta il caricamento della tua pagina. 

Consulta questa guida per ottenere maggiori informazioni su come migliorare il tuo punteggio PageSpeed.

7 suggerimenti avanzati per l’ottimizzazione delle immagini: oltre il testo alternativo

L'ottimizzazione delle immagini dovrebbe andare ben oltre l'aggiunta di tag alt. 

Ci sono diverse cose che puoi fare per migliorare le prestazioni organiche complessive del tuo sito, nonché per ottimizzare le tue immagini e ottenere un posizionamento più elevato su Google Immagini.

Molti problemi potrebbero derivare semplicemente dalla scelta di caricare immagini raw sul tuo sito, senza prima lavorarci un po’ sopra: questa non è mai una buona idea.

Ecco 7 dei suggerimenti avanzati più efficaci per l'ottimizzazione dei link:

1. Rinomina le tue immagini in modo appropriato

Google pubblica una propria guida delle buone pratiche per le immagini, e secondo questa guida una delle cose più importanti è assicurarsi di utilizzare dei nomi file descrittivi.

Ad esempio, è meglio utilizzare "jordan-air-1-mid-front.jpg, anziché IMG00353.JPG."

Quando esporti delle immagini da una fotocamera o da uno smartphone (o addirittura fai uno screenshot), a queste immagini vengono attribuiti dei nomi di file generici. Non caricare un'immagine con il nome di file che gli è stato assegnato per impostazione predefinita. Piuttosto, attribuisci alle immagini un nome descrittivo che aiuti a comprendere ciò che esse mostrano e separa le parole con dei trattini (non underscore/trattini bassi). 

Inserisci questa azione nella tua checklist, per tutte le volte che caricherai delle immagini. 

Se hai già caricato le immagini sulla tua pagina, vai avanti e aggiorna i nomi dei file in modo che siano descrittivi. Non ci vorrà molto e ti assicuriamo che non sarà una perdita di tempo. 

2. Ridimensiona le immagini in base alle dimensioni di visualizzazione

Un altro problema comune, con le immagini, si verifica quando il file immagine presenta dimensioni in pixel molto maggiori rispetto all'immagine che può essere utilizzata sul tuo sito. 

Ad esempio, la fotocamera principale di un iPhone X genera immagini di 4032 px x 3024 px. 

Supponiamo però che la larghezza massima di visualizzazione delle immagini sul tuo sito sia di 600px. 

La differenza tra un'immagine con una larghezza di 4032 px ed una con una larghezza di 600 px è notevole, e utilizzare diverse immagini con dimensioni maggiori rispetto a quelle di visualizzazione potrebbe comportare un rapido e significativo incremento delle dimensioni del file di pagina. 

Assicurati di ridimensionare le immagini alle loro dimensioni massime di visualizzazione. 

Se sei un utente WordPress, puoi utilizzare un’estensione come Resize Image After Upload per semplificare le cose. Altrimenti, potresti ridimensionare le immagini con Photoshop o utilizzando uno strumento come Canva.

Dovresti anche assicurarti di ridimensionare le immagini in modo reattivo con i CSS

3. Riduci le dimensioni dei tuoi file immagine

Uno dei metodi più semplici per ridurre le dimensioni dei file delle tue immagini consiste nel ridimensionarle in base alle dimensioni massime di visualizzazione, ma non si tratta dell’unica strada possibile.

Infatti, anche questo è un argomento trattato da Google nella sua guida all’ottimizzazione delle immagini:

Per ottenere i migliori risultati, sperimenta diverse impostazioni di qualità per le tue immagini e non temere di ridurne il valore: i risultati visivi sono spesso molto buoni e le dimensioni dei file in genere vengono ridotte in modo significativo.

— Google

Come puoi ridurre le dimensioni dei tuoi file immagine?

Utilizzando uno dei tre strumenti open source raccomandati da Google: 

• Gutezli

• MozJpeg

• pngquant

Ma se non hai familiarità con l'uso di strumenti come questi o desideri una soluzione web-based più veloce, potresti utilizzare uno strumento come Optimizilla, con cui potrai comprimere le tue immagini.

Oppure, se sei un utente WordPress, prova il plugin Smush.

4. Crea una Sitemap di immagini

Se desideri che Google sia in grado di riconoscere tutte le immagini presenti sul tuo sito e che le esegua su Google Immagini, dovresti creare una sitemap dedicata che includa gli URL di tutte le tue immagini.

Per spiegarlo in modo semplice, creare una sitemap di immagini incrementerà le possibilità che le tue immagini vengano visualizzate nei risultati di ricerca, e anche se puoi fare riferimento alle immagini in una sitemap esistente, generalmente ha più senso creare una mappa dedicata che i motori di ricerca possano usare.

Ecco un esempio fornito da Google per aiutarti a comprendere il formato che dovresti utilizzare.

C'è una differenza sostanziale tra creare una sitemap di immagini e crearne una che include le tue pagine web.

Come affermato da Google, "Le sitemap di immagini possono contenere URL di altri domini, a differenza delle normali sitemap, che impongono restrizioni tra domini. Ciò ti consentirà di utilizzare CDN (“content delivery networks”, o “reti per la distribuzione dei contenuti”) per ospitare le immagini.”

E questo ci porta al perché dovresti ospitare immagini su una CDN.

5. Ospita le immagini su una CDN

In genere l'intero sito web viene ospitato su un server. 

Proviamo ad immaginare uno scenario in cui un sito web è ospitato negli USA ma viene visitato da un utente che si trova da qualche parte in Europa. 

Le risorse, come per esempio le immagini, dovranno “viaggiare di più” per raggiungere l'utente che si trova in Europa, rallentando il caricamento della pagina. 

Una CDN (o “rete per la distribuzione dei contenuti”) memorizza nella cache le immagini del tuo sito web su più server in diverse località del mondo, consentendo di servire tali immagini ad un utente dalla località più vicina a lui.

Tra le CDN più popolari ci sono Cloudflare, Fastly, KeyCDN e Amazon CloudFront.

Puoi facilmente impostare una CDN su WordPress tramite estensioni come W3 Total Cache o, se hai bisogno di ulteriori indicazioni, consultare le guide all’integrazione dei diversi provider, come questa di Cloudflare.

Ti consigliamo anche di consultare la nostra guida sulle pratiche SEO da conoscere per le CDN.

6. Implementa il Lazy Loading

Non possiamo negare il fatto che le immagini siano le risorse di una pagina con le dimensioni di file più grandi e, di conseguenza, la causa principale del rallentamento di un sito. 

Ovviamente, le immagini sono qualcosa di cui non possiamo fare a meno: questa opzione non può essere nemmeno considerata, poiché le immagini sono troppo importanti per fornire un'esperienza utente eccezionale. 

Ma possiamo usare il cosiddetto lazy loading (o caricamento differito) per rimandare il caricamento di un’immagine da parte del browser fino al momento in cui questo non è necessario.

“Lazy loading” (o caricamento differito) significa semplicemente che le risorse non verranno caricate fino al momento in cui non sarà necessario farlo. In sostanza, quindi, la pagina verrà caricata molto più velocemente quando un utente vi accede. Questa opzione non viene utilizzata esclusivamente per le immagini; anche risorse come JavaScript possono essere caricate in questo modo.

Pensala in questo modo: se un utente non scorrerà mai verso il basso fino alla seconda metà di una pagina, tali risorse non verranno mai caricate. E questo comporterà un notevole miglioramento delle prestazioni. 

Ma vediamo, ancora una volta, cosa dice Google a proposito del lazy loading, oltre a raccomandarlo su PageSpeed Insights:

Il lazy loading può accelerare notevolmente il caricamento di pagine lunghe che includono molte immagini nella loro parte bassa, caricandole in base alle esigenze o al termine del caricamento e del rendering del contenuto principale.

— Google

Per scoprire come implementare il lazy loading sul tuo sito, dai un’occhiata a questa guida. 

7. Sfrutta la memorizzazione nella cache del browser

Google PageSpeed Insights consiglia spesso di sfruttare la memorizzazione nella cache del browser.

Per spiegarlo nel modo più semplice possibile, si parla di memorizzazione nella cache del browser quando i file vengono archiviati dal browser di un visitatore: ciò significa che le risorse verranno caricate più velocemente alla successiva visita della pagina da parte del visitatore.

Quando visiti una pagina, le immagini vengono scaricate e quindi visualizzate nel browser. Escludendo la memorizzazione nella cache del browser, le immagini dovranno essere nuovamente scaricate alla successiva visita della pagina da parte dell'utente. Al contrario, con la memorizzazione nella cache del browser, il browser le avrà già memorizzate, il che significa che la pagina verrà caricata molto più velocemente le volte successive.

La memorizzazione nella cache del browser può avere un impatto notevole sui siti in cui gli utenti rivisitano frequentemente le stesse pagine. 

Per maggiori dettagli sulle raccomandazioni fornite da Google in merito alla memorizzazione nella cache, clicca qui. 

Se sei un utente WordPress, uno dei più popolari plugin di cache può aiutarti ad implementarla in modo rapido. Se non lo sei, questa guida di GTmetrix ti aiuterà a farlo.

Ottimizzazione delle immagini e aggiornamento della Google Page Experience

Google ha recentemente annunciato di voler implementare l'aggiornamento della sua Page Experience nel corso del 2021.

Tale aggiornamento terrà conto di una serie di fattori di ranking esistenti, tra cui la navigazione sicura (o safe browsing), la presenza di annunci interstitials, HTTPS come fattore di ranking, l'aggiornamento per l’ottimizzazione dei dispositivi mobili, il Page Speed Update e i Core Web Vitals.

Se ti sei perso l’annuncio, sappi che questo, come affermato in Search Engine Land, significa essenzialmente che "A parità di tutte le altre condizioni, questo aggiornamento implica che Google avrà maggiori probabilità di posizionare le tue pagine in alto se esse forniscono una buona user experience."

Ma in che modo tutto questo è collegato all’ottimizzazione delle immagini?

Innanzitutto, avrai notato che i Core Web Vitals sono uno dei fattori che verranno presi in considerazione, e questi includono anche il Largest Contentful Paint (o LCP). Questa metrica indica essenzialmente quanto velocemente viene percepita una pagina; dopo quanto tempo un utente ritiene che la pagina sia stata caricata.

L’LCP viene calcolato da Google considerando il tempo necessario per il rendering dell'elemento di contenuto più grande presente sulla pagina (spesso si tratta di immagini).

Il CLS (Cumulative Layout Shift) è un altro Core Web Vital, e descrive quanto accade quando il contenuto continua a muoversi anche se una pagina sembra essere completamente caricata. In termini semplici, questo può essere ottimizzato includendo gli attributi di dimensione alle tue immagini (e video).

Infine, ricorda che l'aggiornamento della Page Experience terrà di conto anche della Page Speed, e abbiamo già visto sopra in che modo le immagini possano influire su questa. 

Individuare i problemi relativi alle immagini del tuo sito

Fino a questo punto abbiamo esaminato come ottimizzare le immagini del tuo sito, ma in quali modi puoi individuare i problemi già esistenti sul tuo sito?

Per individuare questi tipi di problemi, puoi utilizzare lo strumento Site Audit di SEMrush. La scheda Problemi del tuo Site Audit è forse il modo più rapido per iniziare, in quanto ti mostrerà i seguenti problemi:

Immagini interne ed esterne interrotte

Le immagini interrotte rendono l'esperienza utente scadente; dovresti dare priorità alla risoluzione dei problemi relativi alle immagini che non vengono visualizzate. 

Site Audit ti mostrerà tutte le immagini interrotte presenti sul tuo sito, in modo da consentirti di aggiornare gli URL errati o di sostituire le immagini.

L'audit ti indicherà anche eventuali immagini esterne interrotte, e in questo caso la soluzione più indicata sarà quella di sostituire le immagini, dato che non controllerai la fonte. 

Immagini senza attributi Alt

Abbiamo già visto quanto sia importante ottimizzare il testo alternativo delle immagini, pertanto il report del site audit ti restituirà un elenco completo delle immagini presenti nel sito che non ce l’hanno.

Questo renderà più semplice l’aggiunta del testo alternativo, in quanto ti fornirà un elenco su cui lavorare pagina per pagina.

Prendi la SEO per immagini sul serio per l'esperienza utente e i motori di ricerca

Dedicare un po’ del tuo tempo all’ottimizzazione delle immagini può avere un notevole impatto sul traffico verso il tuo sito proveniente dalla Ricerca di immagini, e migliorerà l’esperienza degli utenti grazie a tempi di caricamento più brevi. 

E non dimenticare che ottimizzare i nomi dei file immagine e dei tag alt ti aiuterà a dare pertinenza contestuale alla tua pagina, migliorandone al contempo la visibilità organica. 

Molti esperti di SEO reputano superflua l'ottimizzazione delle immagini, ma con l'aggiornamento della Google Page Experience, in arrivo il prossimo anno, non c'è momento migliore per agire.