Categoria: Sviluppo

Controllo struttura delle intestazioni HTML

Idea internaManca uno strumento?

Delinea le intestazioni H1-H6 e segnala i problemi strutturali

Incolla HTML per vedere le sue intestazioni da H1 a H6 come schema del documento, e segnalare un H1 mancante, H1 multipli, livelli di intestazione saltati e intestazioni vuote. Funziona interamente nel tuo browser.

Numero di H11Problemi2
Schema delle intestazioni
  • H1 How local browser tools work
  • H2 Why run tools in the browser
  • H4 A skipped level
  • H2 Another section
  • H3 (intestazione vuota)
Problemi
  • Un'intestazione H3 non ha testo.
  • Il livello dell'intestazione passa da H2 a H4, saltando un livello.

Tutto ciò che c'è in questa pagina viene elaborato nel tuo browser. Niente viene caricato.

A cosa serve

Sia i lettori di schermo che i motori di ricerca si affidano ai livelli delle intestazioni per capire la struttura di una pagina, quindi un H1 mancante, due H1 in competizione, o un salto diretto da H2 a H4 possono rendere una pagina ben scritta più difficile da navigare. Questo strumento estrae ogni intestazione dall'HTML incollato nell'ordine del documento, la mostra come schema indentato e segnala i problemi strutturali che è facile introdurre per errore modificando un template.

Come si usa

  1. Incolla l'HTML di una pagina o di un articolo nel campo di input.
  2. Controlla lo schema delle intestazioni per confermare che corrisponda alla struttura prevista della pagina.
  3. Correggi eventuali problemi segnalati, come un H1 mancante o un livello di intestazione saltato.

Privacy

Questo strumento funziona interamente nel tuo browser. Quello che inserisci non viene mai caricato, salvato o condiviso: chiudendo la scheda sparisce.

Domande frequenti

Il mio HTML viene caricato da qualche parte?
No. Il documento viene solo letto come testo da un tokenizer nella scheda del tuo browser; nulla viene renderizzato o inviato a un server.
Perché è importante un livello di intestazione saltato?
Gli utenti di tecnologie assistive spesso navigano saltando tra intestazioni di un dato livello; un salto da H2 direttamente a H4 può far sembrare che una sezione sia stata saltata o rendere confusa la struttura da seguire.
Un attributo alt vuoto è la stessa cosa di un'intestazione vuota?
No, sono cose non correlate. Un'intestazione vuota, come un <h3></h3> senza testo, è sempre un errore ed è segnalata come tale qui; un attributo alt vuoto su un'immagine è un pattern diverso, spesso intenzionale, coperto dallo strumento Controllo testo alt delle immagini.