Definizione
Gli attributi ALT fanno parte dello standard HTML. Possono essere usati per specificare testi alternativi per le immagini che sono incluse nelle pagine web. Svolgono un ruolo importante nell’ottimizzazione dei motori di ricerca (SEO) e nei siti Web accessibili senza barriere e portatori di handicap.
Scopo del testo alternativo
Le immagini e la grafica sono elementi importanti nel web design. Spesso trasmettono interrelazioni complesse meglio delle descrizioni scritte, riassumono ciò che è scritto in modo vivido e rendono una pagina più attraente. Immagini di sfondo, loghi e banner, così come cornici e altri elementi grafici decorativi, sono indispensabili per l’estetica. Inoltre, molte immagini sono contenuti a sé stanti a cui i visitatori del sito Web sono direttamente interessati, ad esempio foto su Instagram o in una galleria online.
Tuttavia, non tutti gli utenti di Internet sono in grado di vedere le immagini e anche i motori di ricerca comprendono solo i contenuti grafici in misura limitata. Gli attributi ALT risolvono questo problema fornendo un’alternativa testuale a un’immagine. I browser Web e altri programmi utilizzano questo testo se l’immagine corrispondente non può essere visualizzata, vista o compresa. Anche con immagini difettose o comunque non visualizzabili, nessuna informazione viene persa e i visitatori sanno ancora di cosa tratta la grafica. Pertanto, i testi ALT migliorano l’ usabilità di una pagina e la rendono più user-friendly.
In dettaglio, gli attributi ALT vengono utilizzati nei seguenti casi:
- I programmi di lettura dello schermo per ipovedenti leggono ad alta voce il testo alternativo.
- I motori di ricerca come Google analizzano i testi ALT per scoprire cosa è visibile su un’immagine.
- In caso di collegamenti immagine interrotti o formati di file non supportati, i browser Web visualizzano l’attributo ALT.
- Alcuni utenti di Internet disattivano la visualizzazione delle immagini nel browser per accelerare il caricamento della pagina o risparmiare volume di dati. In questi casi, i browser web visualizzano anche il testo alternativo come si può vedere nello screenshot seguente:
I motori di ricerca attribuiscono grande importanza alla qualità dei testi ALT, poiché li aiutano a comprendere un’immagine e la pagina complessiva. Ciò consente loro di classificare correttamente l’immagine e il contenuto della pagina. Inoltre, classificano più in alto i siti Web senza barriere e generalmente accessibili. Pertanto, l’attributo è molto importante da un punto di vista SEO.
Inoltre, buoni testi alternativi migliorano il posizionamento delle immagini nella ricerca di immagini di Google. Soprattutto la grafica che ha una forte relazione con il contenuto della pagina genera più traffico perché attira utenti aggiuntivi dalla ricerca di immagini al sito web reale. Se le immagini sono particolarmente rilevanti per un determinato termine di ricerca , possono anche essere visualizzate nei risultati di ricerca organici e quindi portare più traffico a un sito web. Per quanto riguarda la SEO, gli attributi ALT sono quindi indispensabili.
Specifica degli attributi ALT nel codice HTML
ALT è un attributo obbligatorio in HTML. Sebbene la maggior parte dei browser ignori gli attributi ALT mancanti, sono obbligatori per tutti i tag <img> e <area> di una pagina Web conforme agli standard. Pertanto, il codice HTML per le immagini dovrebbe almeno assomigliare a questo:
<img src="imagefile.jpg" alt="testo alternativo">
L’attributo deve essere utilizzato anche per immagini puramente decorative come grafica decorativa, immagini di sfondo, linee o cornici. Tuttavia, il testo alternativo dovrebbe rimanere vuoto in questo caso, poiché tale immagine non ha alcun significato in termini di contenuto:
<img src="background.jpg" alt="">
I sistemi di output vocale e altri software di assistenza accessibili ai disabili ignorano tali tag <img> con un attributo ALT vuoto.
Requisiti per gli attributi ALT
Lo standard HTML prevede che i testi alternativi debbano essere un sostituto appropriato e completo del contenuto grafico delle immagini. Idealmente, gli attributi ALT non dovrebbero quindi contenere contenuti aggiuntivi come ulteriori spiegazioni, titoli o didascalie. Hanno il solo scopo di fornire una descrizione testuale del contenuto dell’immagine in modo che una pagina possa essere compresa anche senza le sue immagini e abbia comunque lo stesso contenuto informativo.
Questi requisiti non contraddicono i requisiti per gli attributi ALT per quanto riguarda l’ottimizzazione dei motori di ricerca (SEO). In un certo senso, i motori di ricerca sono anche ciechi al contenuto grafico, quindi beneficiano di testi ALT simili a quelli delle persone ipovedenti. Un buon testo alternativo è quindi ugualmente utile per i non vedenti, i motori di ricerca e gli utenti che hanno disattivato la visualizzazione delle immagini.
Tuttavia, anche un attributo ALT perfettamente ottimizzato non può nascondere contenuti carenti su una pagina web. L’uso improprio del testo alternativo, quindi, non aiuta la SEO e può – nel caso del keyword stuffing – addirittura essere controproducente, in quanto Google e altri motori di ricerca puniscono tali pratiche SEO.
Testi alternativi adatti per diversi tipi di immagine
Il contenuto ottimale di un testo ALT di alta qualità dipende in gran parte dallo scopo e dal contenuto di un’immagine. Un buon punto di partenza è la domanda su quale testo sostituirebbe l’immagine se non esistesse in primo luogo. Inoltre, la differenziazione nei seguenti tipi di immagine può aiutare a formulare l’attributo ALT corretto per la SEO:
- Immagini indipendenti: contenuto grafico che si distingue da solo. Ad esempio, foto in gallerie e album, screenshot dimostrativi di applicazioni, “immagini divertenti”, immagini da scaricare o acquistare e simili. Il testo alternativo fornisce una descrizione breve ma significativa dell’immagine, inclusa la parola chiave più importante per la ricerca di immagini SEO.
- Immagini in linea: queste grafiche sostituiscono singole o poche parole per motivi estetici o per risparmiare spazio. Ciò include faccine ed emoticon, simboli e icone, nonché semplici pittogrammi. L’attributo ALT corrispondente contiene il testo che l’immagine sostituisce, ad esempio “emoji sogghignante” o semplicemente “sorriso”.
- Immagine esplicativa: grafici, statistiche, screenshot esplicativi. Se un grafico riassume solo il testo circostante senza fornire nuove informazioni, il testo ALT rimane vuoto. In caso contrario, contiene una versione breve del contenuto dell’immagine. Per spiegazioni più lunghe è più indicato il normale testo continuo perché utile a tutti i visitatori.
- Grafiche decorative senza valore informativo: immagini di sfondo, cornici, linee e simili. Poiché queste immagini sono utilizzate esclusivamente per l’estetica visiva, sono fornite con attributi ALT vuoti.
Differenza rispetto all’attributo TITLE
Sebbene ALT possa essere applicato solo ai tag <img>, TITLE è un attributo universale supportato dalla maggior parte degli elementi HTML. Il suo scopo è aggiungere commenti, brevi spiegazioni o informazioni aggiuntive. I browser Web visualizzano il TITLE come suggerimento quando il puntatore del mouse è posizionato su di esso. A causa della loro importanza per l’accessibilità e l’usabilità, i testi alternativi sono più importanti per la SEO rispetto ai titoli delle immagini. Pertanto ALT è una specifica obbligatoria, mentre TITLE viene utilizzato solo con parsimonia e prudenza.
