Testo alternativo mancante
Silktide individua nelle tue pagine le immagini completamente prive di testo alternativo. Il testo alternativo è la descrizione scritta letta ad alta voce al posto di un'immagine, quindi le immagini che ne sono prive non hanno alcun significato per le persone che non possono vederle.
<!-- Problema: attributo alt assente -->
<img src="apple.png">
<!-- Corretto: testo alt descrittivo -->
<img src="apple.png" alt="Una mela rossa">
<!-- Valido anche: elemento esplicitamente decorativo -->
<img src="decorative-swirl.png" alt="">
Perché è importante
Un non ha nulla da annunciare per un'immagine priva di : nel migliore dei casi legge il nome del file, che raramente è utile e spesso è fuorviante. Le persone cieche o ipovedenti perdono qualsiasi informazione comunicata dall'immagine e, se l'immagine è un grafico, un pulsante o un collegamento, potrebbero non riuscire a usare affatto la pagina.
Il testo alt viene visualizzato anche quando le immagini non vengono caricate e aiuta i motori di ricerca a comprendere le tue immagini, quindi correggerlo porta vantaggi a ogni visitatore.
Come risolvere il problema
- Aggiungi un testo alternativo a ogni immagine nel tuo : la maggior parte
dei CMS dispone di un campo apposito ovunque inserisci un'immagine. Nel codice, usa
l'attributo
altcome mostrato sopra. - Descrivi le informazioni o lo scopo dell'immagine, non il suo aspetto. Per un'immagine che funge da collegamento o pulsante, descrivi la destinazione o l'azione che svolge.
- Se l'immagine è puramente , assegnale un
alt=""vuoto, in modo che i lettori di schermo la ignorino. Non inventare testo riempitivo: sentire "grafica decorativa a spirale" è peggio che non sentire nulla.
WebAIM pubblica una guida completa su come scrivere testi alternativi.
Come Silktide esegue questo controllo
- Individua ogni immagine in ciascuna pagina.
- Ignora le immagini che non necessitano di testo alternativo: immagini senza sorgente, immagini di 1 pixel o meno (solitamente pixel di tracciamento) e immagini nascoste ai lettori di schermo.
- Ignora le immagini contrassegnate come decorative con un attributo
role="presentation", poiché sono deliberatamente nascoste alla . - Segnala ogni immagine rimanente priva dell'attributo
alt.
Un'immagine con un alt="" vuoto supera questo controllo, ma viene trattata in
Immagini decorative, dove ti viene chiesto di confermare che sia
veramente decorativa. Il testo alt presente ma non utile viene trattato in
Testo alt debole.
Risoluzione dei problemi
L'immagine è decorativa: perché viene segnalata?
Un'immagine viene trattata come decorativa solo quando il codice lo specifica, tramite un
alt="" vuoto o role="presentation". Un'immagine completamente priva dell'attributo alt
è ambigua: la tecnologia assistiva non può distinguere tra "decorativa" e "dimenticata", quindi
non supera questo controllo. Aggiungi l'attributo vuoto per rendere esplicita l'intenzione.
L'immagine proviene da un servizio di terze parti
Le immagini generate da servizi incorporati, come le mappe, potrebbero non essere modificabili da te. Le impostazioni del tuo sito web possono escludere i contenuti di terze parti da questo controllo oppure puoi singoli risultati che non puoi modificare.