Criterio WCAG 1.1.1 · Livello A CRITICO
Immagini senza testo alternativo
Uno screen reader non può "vedere" un'immagine: legge il testo alternativo. Se manca, annuncia il vuoto — o peggio, il nome del file.
Cos'è
Ogni immagine che veicola informazione deve avere un attributo alt che ne descriva il contenuto. Vale per le foto prodotto, le icone che fanno da pulsante, i loghi e i banner. Le immagini puramente decorative sono l'eccezione: vanno marcate come tali con un alt vuoto, così la tecnologia assistiva le salta.
Chi ne è penalizzato
Quando questo requisito non è rispettato, una parte reale dei tuoi visitatori non riesce a usare il sito:
- Chi naviga con uno screen reader: senza alt, prodotti, prezzi e icone "acquista" diventano invisibili.
- Chi ha una connessione lenta e vede l'alt al posto dell'immagine non caricata.
- La tua SEO: Google usa l'alt per capire e indicizzare le immagini, e le mostra in Google Immagini.
- Criterio
- WCAG 2.1 — 1.1.1 Contenuto non testuale
- Livello
- A
- Norma UE
- EN 301 549 §9.1.1.1
- Italia
- D.Lgs. 82/2022 (recepimento EAA)
Come appare l'errore
Questa immagine prodotto non ha alcun testo alternativo. Per chi usa uno screen reader, è come se non esistesse.
<img src="/img/sneaker-01.jpg">Come si corregge
Aggiungi un alt che descriva ciò che conta dell'immagine, in modo sintetico e concreto.
<img src="/img/sneaker-01.jpg"
alt="Sneaker in pelle bianca, vista laterale">
<!-- Immagine solo decorativa: alt vuoto, così viene ignorata -->
<img src="/img/onda-decorativa.svg" alt="">Regola pratica: descrivi la funzione, non l'aspetto. Per un'icona-lente che apre la ricerca, l'alt giusto è "Cerca", non "icona lente d'ingrandimento".
Vuoi sapere se il tuo sito ha questo problema?
Scansiona il tuo sito gratis →Domande frequenti
Cosa devo scrivere esattamente nell'alt?
Descrivi ciò che l'immagine comunica nel contesto della pagina, in modo breve. Per una foto prodotto: cosa si vede. Per un'icona che è un pulsante: l'azione che compie. Evita "immagine di…": lo screen reader annuncia già che è un'immagine.
Le immagini decorative vanno descritte?
No. Se un'immagine è puro abbellimento e non aggiunge informazione, mettile un alt vuoto (alt=""). Così la tecnologia assistiva la ignora invece di leggere un nome di file inutile.
Le icone contano come immagini?
Sì, quando trasmettono un significato o fanno da pulsante. Un'icona-cuore che salva tra i preferiti ha bisogno di un nome accessibile, esattamente come una foto.