{"id":11309,"date":"2026-09-12T07:15:05","date_gmt":"2026-09-12T07:15:05","guid":{"rendered":"https:\/\/www.visilay.com\/?p=11309"},"modified":"2026-09-25T10:34:33","modified_gmt":"2026-09-25T10:34:33","slug":"alt-text","status":"publish","type":"post","link":"https:\/\/www.visilay.com\/it\/blog\/alt-text\/","title":{"rendered":"Alt text: cos'\u00e8, come si scrive e quando va lasciato vuoto"},"content":{"rendered":"\n

L'alt text \u00e8 la descrizione testuale che prende il posto di un'immagine per chi non pu\u00f2 vederla, e si scrive nell'attributo alt<\/code> del tag <img><\/code>.<\/p>\n\n\n\n

La regola che decide tutto il resto \u00e8 questa: l'alt descrive il significato<\/strong> dell'immagine dentro quella pagina, non il suo aspetto. Se l'immagine \u00e8 un pulsante o un link, l'alt racconta l'azione (\"Cerca nel sito\"), non la grafica (\"icona lente d'ingrandimento\"). Se l'immagine \u00e8 pura decorazione, l'alt va lasciato vuoto con alt=\"\"<\/code>, che \u00e8 una cosa diversa dal non metterlo affatto.<\/p>\n\n\n\n

Chi legge davvero l'alt text<\/h2>\n\n\n\n

Uno screen reader lo pronuncia ad alta voce nel punto esatto in cui incontra l'immagine, seguendo l'ordine di navigazione della pagina: chi ascolta riceve l'informazione nello stesso momento in cui un utente vedente la vedrebbe. Quando l'attributo manca del tutto, molti screen reader ripiegano sul nome del file, e chi ascolta si sente leggere IMG_4021.jpg<\/code> o un percorso generato dal CMS<\/a>.<\/p>\n\n\n\n

Il testo compare anche a schermo quando l'immagine non si carica: connessione lenta, file spostato, immagini disattivate nel browser. \u00c8 anche uno dei sei errori pi\u00f9 diffusi in materia di accessibilit\u00e0 web<\/a>. E poi c'\u00e8 il crawler, che non vede la fotografia ma legge la stringa.<\/p>\n\n\n\n

I tre stati possibili dell'attributo non sono intercambiabili, e confonderli \u00e8 l'errore pi\u00f9 frequente.<\/p>\n\n\n\n

Stato dell'attributo<\/th>Cosa fa lo screen reader<\/th>Quando \u00e8 corretto<\/th><\/tr><\/thead>
alt<\/code> assente<\/td>Spesso legge il nome del file<\/td>Mai<\/td><\/tr>
alt=\"\"<\/code> (vuoto)<\/td>Salta l'immagine in silenzio<\/td>Immagini decorative, che non aggiungono informazione<\/td><\/tr>
alt=\"testo\"<\/code><\/td>Legge il testo ad alta voce<\/td>Immagini informative, link, pulsanti, loghi, grafici<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

Cosa dice Google, con le sue parole<\/h2>\n\n\n\n

Nelle best practice per Google Immagini<\/a>, aggiornate a marzo 2026, la documentazione ufficiale \u00e8 netta: \u00abL'attributo pi\u00f9 importante per fornire pi\u00f9 metadati per un'immagine \u00e8 il testo alternativo\u00bb. Google lo usa insieme agli algoritmi di visione artificiale e al contenuto della pagina per capire il soggetto dell'immagine, e lo tratta come anchor text<\/a> quando l'immagine \u00e8 usata come link.<\/p>\n\n\n\n

La stessa pagina porta tre esempi, che valgono pi\u00f9 di qualsiasi lista di consigli. alt=\"cagnolino\"<\/code> \u00e8 marcato come poco descrittivo. alt=\"Cucciolo dalmata che gioca al riporto\"<\/code> \u00e8 l'esempio corretto. E una stringa di venti parole che ripete \"cucciolo\", \"cagnolino\" e \"cibo per cani\" \u00e8 classificata come keyword stuffing<\/a>, quindi come violazione delle norme antispam.<\/p>\n\n\n\n

Che alt scrivere, immagine per immagine<\/h2>\n\n\n\n

Le regole generali reggono finch\u00e9 l'immagine \u00e8 una fotografia dentro un articolo. Sulle altre categorie servono decisioni diverse, e sono quelle che gli audit trovano sbagliate pi\u00f9 spesso.<\/p>\n\n\n\n

Tipo di immagine<\/th>Cosa deve contenere l'alt<\/th>Esempio<\/th><\/tr><\/thead>
Foto informativa<\/td>L'informazione che l'immagine porta al testo<\/td>Cucciolo dalmata che gioca al riporto<\/td><\/tr>
Decorativa (sfondi, texture, separatori)<\/td>Niente: attributo vuoto<\/td>alt=\"\"<\/code><\/td><\/tr>
Immagine-link<\/td>La destinazione del link, non l'immagine<\/td>Torna alla home di Visilay<\/td><\/tr>
Icona-pulsante<\/td>L'azione che si attiva al clic<\/td>Stampa il documento<\/td><\/tr>
Logo<\/td>Il nome per esteso e il testo contenuto<\/td>Logo Visilay<\/td><\/tr>
Grafico o infografica<\/td>Sintesi del dato, pi\u00f9 descrizione estesa nel testo o in una tabella HTML<\/td>Errori di accessibilit\u00e0 per home page, dal 2019 al 2026<\/td><\/tr>
Immagine che contiene testo<\/td>Il testo riportato parola per parola<\/td>Il testo dello slogan, trascritto<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

Sul grafico vale la pena insistere. Un alt di una riga non trasferisce quello che un lettore vedente ricava da una curva. Le tecniche del W3C per il criterio 1.1.1<\/a> prevedono infatti due pezzi: una descrizione breve nell'alt e una lunga altrove nella pagina. Una tabella HTML con gli stessi numeri del grafico risolve il problema meglio di un alt di trecento caratteri, e ha il vantaggio collaterale di essere leggibile anche dai motori.<\/p>\n\n\n\n

I 125 caratteri non sono una regola<\/h2>\n\n\n\n

Quasi tutte le guide italiane ripetono il limite dei 125 caratteri come se fosse scritto da qualche parte. Non lo \u00e8: n\u00e9 le WCAG n\u00e9 la documentazione di Google fissano una lunghezza massima per l'attributo alt<\/code>. \u00c8 una convenzione nata dal comportamento di alcuni screen reader che troncano le stringhe lunghe, e come convenzione funziona bene: costringe a scegliere l'informazione principale invece di elencare tutto.<\/p>\n\n\n\n

Trattarla come una regola, per\u00f2, porta a due errori opposti. Tagliare a met\u00e0 la descrizione di un'infografica per stare nel budget, e riempire di parole un alt che avrebbe potuto essere di quattro parole perch\u00e9 \"c'\u00e8 ancora spazio\".<\/p>\n\n\n\n

Quante immagini restano senza alt<\/h2>\n\n\n\n

Il WebAIM Million 2026<\/a> analizza con il motore WAVE le home page del primo milione di siti della classifica Tranco. La rilevazione \u00e8 di febbraio 2026, il campione \u00e8 globale e comprende 11.314 home page su dominio .it<\/code> e 12.615 pagine in lingua italiana.<\/p>\n\n\n\n