Verifica intestazioni e testo alternativo
Verifichi la gerarchia delle intestazioni e il testo alternativo delle immagini su una pagina, senza registrazione.
Strumento
Questo strumento scarica una volta dal nostro server l'indirizzo inserito, estrae tutte le intestazioni da h1 a h6 nell'ordine del documento e le mostra come struttura rientrata; elenca ogni tag img con il testo alternativo, gli attributi width e height, il contrassegno loading="lazy", la presenza in un elemento picture e l'esistenza di un srcset. In alto compaiono il numero di intestazioni, di h1, di immagini, di immagini senza attributo alt e di parole nel testo visibile; sotto, i risultati e cosa fare per ciascuno. La tabella delle immagini può essere copiata come CSV.
La gerarchia delle intestazioni conta per tre lettori: chi scorre la pagina con lo sguardo distingue le sezioni dalle intestazioni, chi usa uno screen reader si sposta nella pagina dall'elenco delle intestazioni, e il motore di ricerca legge l'organizzazione del contenuto dalla stessa struttura. Lo strumento segnala separatamente la mancanza di h1, più di un h1, i livelli saltati (h4 subito dopo h2, per esempio), le intestazioni vuote e duplicate, quelle più lunghe di 70 caratteri e una prima intestazione che non sia h1. Un solo h1 non è un obbligo ma la scelta comune e sicura; lo standard HTML ne consente più d'uno, ma un'unica intestazione principale è più chiara per screen reader e motori di ricerca. Il testo alternativo dice a chi non vede l'immagine cosa trasmette e aiuta la ricerca per immagini a capire il contenuto; lo strumento classifica come mancanti le immagini senza alcun attributo alt, come decorative quelle con alt vuoto, e come da rivedere gli alt più lunghi di 125 caratteri o uguali al nome del file.
Lo strumento legge solo l'HTML restituito dal server; intestazioni e immagini aggiunte nel browser con JavaScript, immagini di sfondo CSS e gallerie caricate da script restano invisibili. Non verifica se le immagini si caricano davvero, né il loro peso o la compressione, e solo una persona può giudicare se il testo alternativo corrisponde davvero all'immagine. Il risultato resta 10 minuti nella memoria del server per lo stesso indirizzo, poi viene cancellato; non viene letto nulla oltre all'indirizzo inserito.
Domande frequenti
Usare più di un h1 è un errore?
No, lo standard HTML consente più h1 e Google ha dichiarato che questo da solo non è un problema di posizionamento. Un solo h1 rende comunque più chiaro l'argomento principale per chi usa uno screen reader e per i motori di ricerca; per questo un unico h1 è la scelta comune e sicura.
Devo scrivere il testo alternativo per un'immagine decorativa?
Dia all'immagine decorativa un alt vuoto (alt=""), così lo screen reader la salta. Non rimuova del tutto l'attributo, altrimenti alcuni screen reader leggono il nome del file. Per un'immagine informativa scriva una frase breve che dica cosa mostra.
Lo strumento vede intestazioni e immagini create con JavaScript?
No, viene letto solo il primo HTML restituito dal server. Nelle pagine che costruiscono il contenuto nel browser con script, la struttura e l'elenco delle immagini possono risultare incompleti; confronti il risultato con l'output di «visualizza sorgente pagina» del browser.
Perché chiede width e height?
Il browser calcola le proporzioni da questi due valori e riserva lo spazio prima del caricamento, così il contenuto non scivola verso il basso mentre carica. Con CSS può comunque dimensionare l'immagine in modo flessibile; gli attributi dichiarano solo le proporzioni.
