Gli heading tag sono i marcatori HTML <h1>, <h2>, <h3>, fino a <h6>, utilizzati per creare gli elementi di intestazione di una pagina. Se vuoi chiarire la differenza tra tag, elemento e attributo, è utile partire proprio da questa distinzione: l’H1 identifica normalmente il tema principale, gli H2 introducono le sezioni e gli H3 sviluppano le relative sottosezioni.
Questa struttura aiuta chi legge a orientarsi e consente alle tecnologie assistive di navigare più facilmente fra le parti della pagina. Anche per la SEO gli heading sono utili, ma è importante evitare una semplificazione molto comune: non esiste una formula del tipo “più keyword negli H2 = ranking migliore”.
Google raccomanda piuttosto di utilizzare le parole che le persone cercherebbero in posizioni prominenti della pagina, fra cui il titolo e l’heading principale, mantenendo sempre il contenuto descrittivo e utile. È lo stesso principio che applichiamo più in generale nell’ottimizzazione SEO: prima viene la chiarezza della pagina, poi le micro-ottimizzazioni.
Vediamo quindi come costruire una gerarchia H1-H6 corretta, quale differenza c’è tra H1 e title, quando usare più livelli di heading e quali errori evitare.
Heading tag: cosa sono e a cosa servono
In HTML esistono sei livelli di intestazione:
| Elemento | Funzione tipica |
|---|---|
<h1> | titolo principale della pagina |
<h2> | sezione principale |
<h3> | sottosezione di un H2 |
<h4> | livello subordinato a un H3 |
<h5> | ulteriore livello di approfondimento |
<h6> | livello più profondo disponibile |
Il numero non indica semplicemente quanto grande debba apparire il testo. Indica soprattutto la posizione dell’intestazione nella struttura del documento.
Pensa alla pagina come a un documento organizzato per capitoli e sottocapitoli. Se l’H1 identifica il documento, un H2 apre un suo argomento principale. Un H3 approfondisce quell’H2; terminato l’approfondimento, puoi tornare tranquillamente a un nuovo H2.
Una struttura semplice potrebbe essere:
<h1>Guida alla fotografia digitale</h1> <h2>Come scegliere una fotocamera</h2> <h3>Sensore</h3> <h3>Obiettivi</h3> <h2>Come impostare l'esposizione</h2> <h3>Apertura</h3> <h3>Tempo di scatto</h3> <h3>ISO</h3>
Questa gerarchia comunica una relazione. Sensore e Obiettivi appartengono alla sezione Come scegliere una fotocamera; non sono sezioni principali parallele.
Il W3C raccomanda di nidificare gli heading secondo il loro livello proprio perché questa struttura rende più comprensibile l’organizzazione del contenuto.
I sei livelli HTML da H1 a H6
Avere a disposizione sei livelli non significa che una pagina debba utilizzarli tutti.
Un articolo relativamente semplice può richiedere soltanto:
H1 ├── H2 ├── H2 │ ├── H3 │ └── H3 └── H2
Un documento tecnico molto articolato può invece arrivare a H4 o H5.
La domanda corretta non è:
Quanti H2 o H3 devo inserire?
ma:
Quali relazioni devo rappresentare tra le diverse parti del contenuto?
Se non esiste una sottosezione reale, non serve inventare un H3. Allo stesso modo, non bisogna creare un H4 soltanto per cambiare dimensione al testo.
Heading tag e header tag non sono la stessa cosa
C’è anche una piccola ambiguità terminologica che vale la pena chiarire.
Gli heading tag sono:
<h1> <h2> <h3> <h4> <h5> <h6>
L’elemento HTML:
<header>
è invece un elemento differente. Può rappresentare il contenuto introduttivo di una pagina o di una sezione e può contenere un heading, un logo, elementi di navigazione o altre informazioni.
Quindi:
<header>
<h1>Nome della pagina</h1>
</header>
contiene sia un header sia un heading H1, ma i due elementi non hanno la stessa funzione.
Come funziona la gerarchia H1, H2, H3, H4, H5 e H6
La gerarchia degli heading descrive come una sezione dipende da quella che la precede.
Per questo non ha senso trattare H1-H6 come sei semplici formati tipografici.
H1: il titolo principale della pagina
Nella maggior parte delle normali pagine editoriali, l’H1 dovrebbe identificare chiaramente l’argomento principale.
Per esempio:
<h1>Come scegliere un hosting WordPress</h1>
fa capire immediatamente quale sia il tema della pagina.
Un H1 come:
<h1>La guida definitiva</h1>
fornisce invece pochissimo contesto se viene valutato da solo.
La documentazione Google Search Essentials raccomanda di utilizzare parole che le persone userebbero per cercare il contenuto nelle aree prominenti della pagina, come il title e il main heading.
Questo non significa dover inserire meccanicamente una focus keyword identica. L’obiettivo è fare in modo che il titolo principale rappresenti davvero ciò che il lettore troverà.
H2: le sezioni principali
Gli H2 organizzano normalmente le grandi parti del contenuto.
Supponiamo che l’H1 sia:
<h1>Come creare un ecommerce</h1>
Potremmo avere:
<h2>Scegliere la piattaforma</h2> <h2>Organizzare il catalogo</h2> <h2>Configurare pagamenti e spedizioni</h2> <h2>Ottimizzare l'ecommerce per la SEO</h2>
Sono quattro aspetti autonomi dello stesso argomento.
Non esiste però un numero ideale di H2 per articolo. Una pagina deve avere quelli necessari a rappresentare correttamente il proprio contenuto.
La vecchia idea di aggiungere un heading ogni determinato numero di parole nasce spesso dalle euristiche dei plugin editoriali. Può ricordarti di evitare muri di testo, ma non è una regola HTML e non è una prescrizione di Google.
H3 e livelli successivi: quando servono davvero
Un H3 ha senso quando devi suddividere ulteriormente il contenuto introdotto da un H2.
Per esempio:
<h2>Configurare i metodi di pagamento</h2> <h3>Carta di credito</h3> <h3>PayPal</h3> <h3>Bonifico bancario</h3>
Gli H3 non sono “heading meno importanti” in senso qualitativo. Sono heading di livello subordinato.
Lo stesso principio prosegue con H4, H5 e H6.
Se sotto:
<h3>Carta di credito</h3>
devi distinguere:
<h4>Pagamenti ricorrenti</h4> <h4>Rimborsi</h4>
l’H4 ha una funzione strutturale reale.
Se invece vuoi semplicemente far apparire una frase più piccola o più grande, stai risolvendo un problema grafico: devi intervenire con CSS o con gli stili del tema, non cambiare il livello semantico dell’heading.
Si possono saltare i livelli degli heading?
Come regola pratica, evita di saltare un livello quando stai creando una sottosezione.
Questa struttura:
<h1>Titolo</h1> <h2>Sezione</h2> <h3>Sottosezione</h3>
è chiara.
Questa:
<h1>Titolo</h1> <h3>Sottosezione</h3>
lascia invece un livello intermedio mancante e può rendere meno intuitiva la gerarchia, soprattutto per chi utilizza tecnologie assistive.
Attenzione però a non trasformare l’ordine numerico in una sequenza obbligatoria fino a H6. Dopo un H3 puoi tranquillamente tornare a un H2:
<h1>Titolo</h1> <h2>Prima sezione</h2> <h3>Primo dettaglio</h3> <h3>Secondo dettaglio</h3> <h2>Seconda sezione</h2>
Il nuovo H2 chiude semplicemente il gruppo di sottosezioni precedente e apre una nuova sezione dello stesso livello.
La documentazione MDN sugli elementi heading consiglia di mantenere una gerarchia coerente e di non utilizzare i livelli degli heading per ridimensionare il testo.
H1 e tag title: qual è la differenza
Uno degli equivoci più frequenti consiste nel considerare H1 e <title> come lo stesso elemento.
Non lo sono.
Il tag title si trova nell’<head> del documento:
<head>
<title>Heading tag: come usare H1, H2 e H3</title>
</head>
L’H1 si trova invece nel contenuto visibile della pagina:
<body>
<h1>Heading tag: cosa sono e come usare H1, H2 e H3 correttamente</h1>
</body>
Le due informazioni possono essere simili, ma svolgono funzioni diverse.
| Elemento | Dove si trova | Funzione principale |
|---|---|---|
<title> | <head> HTML | identifica il documento e fornisce una fonte per il title link nei risultati |
<h1> | contenuto della pagina | identifica normalmente il titolo principale visibile del contenuto |
Questo significa anche che il testo mostrato da Google come titolo di un risultato non è automaticamente l’H1 della pagina.
L’H1 è visibile nella pagina, il title appartiene al documento
Il title deve funzionare anche quando viene letto fuori dal contesto della pagina, per esempio nei risultati di ricerca o nella scheda del browser.
L’H1 può invece essere leggermente più descrittivo perché il visitatore vede già il sito, il layout, le breadcrumb e altri elementi di contesto.
Per esempio:
Title: Heading tag: come usare H1, H2 e H3 correttamente H1: Heading tag: cosa sono e come usare H1, H2 e H3 correttamente
Non c’è alcun problema nel differenziarli quando la differenza migliora chiarezza e pertinenza.
Google può usare l’H1 per generare il title link?
Sì, ma questo va interpretato correttamente.
Google spiega nella documentazione sui title link che il titolo mostrato nei risultati può essere generato utilizzando diverse fonti, tra cui:
- l’elemento
<title>; - il titolo principale visibile;
- gli heading;
- altro testo grande e prominente;
- anchor text e altri segnali disponibili.
Quindi l’H1 può contribuire alla generazione del title link.
Non significa:
H1 = title mostrato da Google
né significa che sia possibile controllare in modo assoluto il testo che Google mostrerà.
Una forte incoerenza tra title, H1 e contenuto può rendere meno chiaro quale sia il titolo principale della pagina. È quindi utile che questi elementi esprimano la stessa promessa editoriale, pur senza essere necessariamente identici.
H1 e title devono contenere la stessa keyword?
Non esiste l’obbligo di inserire una stringa identica in entrambi.
Se una query descrive naturalmente l’argomento, è normale che il termine principale compaia sia nel title sia nell’H1. Ma la priorità resta la chiarezza.
Confronta:
Title: Heading tag: come usare H1, H2 e H3 H1: Heading tag: cosa sono e come usare H1, H2 e H3 correttamente
con:
Title: Heading tag heading HTML H1 tag H2 tag SEO H1: Heading tag heading HTML H1 tag H2 tag
Il secondo esempio non diventa migliore perché contiene più varianti.
Nella SEO on-page title, H1, heading e contenuto devono collaborare per rendere riconoscibile il topic della pagina, non diventare copie costruite per accumulare keyword.
Si possono usare più H1 nella stessa pagina?
Qui serve distinguere ciò che è tecnicamente possibile da ciò che conviene fare nella pratica.
La presenza di più H1 non deve essere trattata come una presunta penalizzazione SEO automatica. Ma per una normale pagina, articolo o landing page è generalmente preferibile avere un H1 principale chiaramente riconoscibile e organizzare le sezioni successive con H2, H3 e livelli inferiori.
La documentazione MDN raccomanda proprio questo approccio: un singolo H1 che descrive il contenuto della pagina e una gerarchia dei successivi livelli senza salti inutili.
Cosa è cambiato rispetto al vecchio modello HTML
In passato si trovavano spesso guide che suggerivano di inserire un nuovo H1 dentro ogni elemento <section> o <article>, affidandosi a un presunto algoritmo automatico di outline del documento.
È una base poco utile per progettare oggi una pagina.
Per un normale contenuto editoriale questa struttura:
<h1>Guida a WordPress</h1> <h2>Come installare WordPress</h2> <h2>Come scegliere un tema</h2> <h2>Come installare un plugin</h2>
è molto più semplice da comprendere rispetto a una pagina costruita con diversi H1 paralleli.
Il punto non è quindi “Google punisce più H1”.
Il punto è:
qual è la gerarchia che rappresenta meglio il documento per utenti, browser e tecnologie assistive?
Nella maggior parte dei casi la risposta è un H1 principale seguito dai livelli subordinati necessari.
Multiple H1: SEO e accessibilità sono due problemi diversi
È importante non mescolare due piani.
Dal punto di vista SEO, non abbiamo una regola Google secondo cui la semplice presenza di un secondo H1 comporti una penalizzazione.
Dal punto di vista della struttura e dell’accessibilità, avere un titolo principale riconoscibile e livelli coerenti rende invece il documento più semplice da interpretare e navigare.
Quindi non serve andare nel panico se un template produce accidentalmente due H1. Va però verificato perché esistono e se rappresentano davvero due elementi di pari livello oppure se il markup dovrebbe essere corretto.
Heading tag e SEO: cosa conta davvero
Gli heading sono una componente della struttura on-page, ma il loro valore SEO viene spesso raccontato attraverso formule troppo semplici.
Google conferma che le parole utilizzate nel titolo e nell’heading principale sono posizioni descrittive importanti. Conferma inoltre che gli heading possono essere una delle fonti utilizzate per comprendere quale testo rappresenti il titolo principale della pagina.
Da questo però non deriva una formula matematica:
keyword in H2 → aumento ranking
né:
più heading → pagina più ottimizzata
Il modo più utile di pensare agli heading è considerarli segnali di organizzazione e information scent: aiutano a rendere riconoscibili argomento principale, sezioni e sottosezioni.
Gli heading aiutano a rendere comprensibile la struttura della pagina
Un buon set di heading permette a una persona di scorrere rapidamente la pagina e capire:
- qual è l’argomento;
- quali aspetti vengono affrontati;
- dove si trova la risposta che cerca;
- come sono collegate le sezioni.
Prova a leggere soltanto H1, H2 e H3 della tua pagina.
Se ottieni qualcosa come:
Guida alla SEO on-page Cos'è la SEO on-page Come ottimizzare il title Come organizzare H1 e heading Come ottimizzare le immagini Come gestire i link interni Conclusione
il percorso è abbastanza comprensibile.
Se trovi:
Guida completa Perché è importante Alcuni consigli Altre cose da sapere Il metodo migliore Conclusione
gli heading forniscono molto meno information scent.
Keyword negli heading: utili quando descrivono davvero la sezione
Una keyword può comparire in un H2 o H3 quando è il termine corretto per descrivere ciò che segue.
Se una sezione parla della differenza tra H1 e title, l’heading:
H1 e tag title: qual è la differenza
è naturale e preciso.
Non c’è alcuna ragione di evitarlo per paura di ripetere una keyword.
Il problema nasce quando l’heading viene costruito al contrario: prima si decide quale stringa bisogna inserire, poi si inventa una sezione per ospitarla.
Questo approccio produce facilmente ridondanze e micro-sezioni senza valore. Una buona ottimizzazione on-page parte dall’intento e dalla struttura del contenuto, non dalla densità di una frase chiave.
Non esiste un numero ideale di H2 o un heading ogni 300 parole
Plugin e strumenti editoriali possono usare soglie per segnalare blocchi di testo molto lunghi.
Sono euristiche.
Una pagina di 800 parole può avere tre H2 ed essere perfettamente organizzata. Una guida tecnica molto più estesa può richiederne dieci o quindici.
Lo stesso vale per gli H3.
La regola pratica è:
aggiungi un heading quando introduce una sezione o sottosezione reale, non quando un contatore ti dice che sono trascorse troppe parole.
Heading e accessibilità: perché la gerarchia conta anche per gli utenti
La struttura degli heading non riguarda soltanto Google.
Gli heading marcati correttamente possono essere utilizzati dalle tecnologie assistive per comprendere l’organizzazione della pagina e permettere agli utenti di spostarsi tra le diverse sezioni.
Il W3C sottolinea proprio il valore degli heading per la navigazione e la comprensione della struttura.
Come gli screen reader utilizzano le intestazioni
Una persona che utilizza uno screen reader non è obbligata ad ascoltare ogni parola della pagina dall’inizio alla fine.
Può utilizzare gli heading come punti di navigazione, in modo concettualmente simile a chi scorre visivamente una pagina osservandone titoli e sottotitoli.
Una gerarchia come:
H1 Hosting WordPress
H2 Cos'è un hosting WordPress
H2 Come scegliere il piano
H3 Spazio e traffico
H3 Backup
H3 Supporto
H2 Quanto costa
fornisce una mappa relativamente chiara.
Una sequenza casuale di H1, H5, H2 e H6 rende invece più difficile ricostruire le relazioni.
Le linee guida W3C sugli heading consigliano inoltre intestazioni concise e descrittive del contenuto che segue.
Heading descrittivi e information scent
La stessa caratteristica migliora anche l’esperienza di chi non utilizza tecnologie assistive.
Un heading come:
Come controllare gli heading di una pagina web
anticipa esattamente cosa troverai.
Un heading come:
Alcune cose da verificare
richiede invece di leggere il paragrafo successivo per capire se la sezione sia pertinente.
Questa è una buona ragione per scrivere heading specifici anche indipendentemente da qualsiasi ipotesi sul ranking.
Come usare correttamente gli heading: esempio HTML completo
Mettiamo insieme i principi visti finora.
Supponiamo di dover scrivere una pagina su come scegliere un hosting WordPress.
Una struttura coerente potrebbe essere:
<h1>Come scegliere un hosting WordPress</h1> <p>Introduzione...</p> <h2>Quali caratteristiche valutare</h2> <h3>Prestazioni</h3> <p>...</p> <h3>Backup</h3> <p>...</p> <h3>Supporto tecnico</h3> <p>...</p> <h2>Hosting condiviso, VPS o cloud</h2> <h3>Quando basta un hosting condiviso</h3> <p>...</p> <h3>Quando serve una VPS</h3> <p>...</p> <h2>Quanto costa un hosting WordPress</h2> <p>...</p> <h2>Conclusione</h2> <p>...</p>
La logica può essere letta senza conoscere lo stile CSS del sito.
Un esempio di struttura da evitare
Considera invece:
<h1>Come scegliere un hosting WordPress</h1> <h4>Prestazioni</h4> <p>...</p> <h2>Backup</h2> <p>...</p> <h6>Supporto</h6> <p>...</p> <h3>Quanto costa</h3> <p>...</p>
Qui i numeri non rappresentano relazioni comprensibili.
Prestazioni, Backup, Supporto e Quanto costa potrebbero essere tutte sezioni principali, oppure alcune potrebbero appartenere a una sezione superiore. Dal markup non è chiaro.
Il problema non è aver infranto una presunta formula SEO. È aver costruito una struttura semanticamente poco leggibile.
Lo stile grafico va gestito con CSS, non cambiando livello heading
Un H2 può essere piccolo. Un H4 può essere grande.
HTML e CSS svolgono lavori differenti:
HTML → significato e struttura CSS → presentazione
Se vuoi che un H2 appaia meno evidente:
h2 {
font-size: 1.5rem;
}
Non trasformarlo in H5 soltanto perché il browser applica a H5 una dimensione che ti piace di più.
Lo stesso principio vale nei page builder e nei temi WordPress: scegli il livello heading per il suo ruolo nel documento e gestisci separatamente tipografia, colore, peso e spaziatura.
Come controllare gli heading di una pagina web
Non basta guardare la dimensione visuale dei titoli.
Per sapere se una pagina è strutturata correttamente devi controllare il markup effettivamente generato.
Verifica dal browser e dal codice HTML
Puoi farlo direttamente dal browser.
Apri la pagina, fai clic con il tasto destro sull’intestazione che vuoi controllare e scegli Ispeziona.
Nel pannello degli strumenti per sviluppatori potresti trovare:
<h2 class="section-title">Heading tag e SEO</h2>
oppure:
<div class="section-title">Heading tag e SEO</div>
Visivamente potrebbero sembrare identici, ma semanticamente non lo sono.
Puoi inoltre controllare l’intero documento cercando:
<h1 <h2 <h3
e ricostruire la gerarchia.
Per una verifica più rapida esistono anche estensioni browser e strumenti di crawling che estraggono gli heading delle pagine. Il principio però resta lo stesso: controlla l’HTML realmente renderizzato, non soltanto ciò che sembra un titolo nell’editor.
Come gestire H1, H2 e H3 in WordPress
Nel Block Editor di WordPress puoi inserire un blocco Titolo/Heading e scegliere il livello da H1 a H6.
La documentazione ufficiale del blocco Heading specifica che, nella maggior parte dei casi, il titolo della pagina viene utilizzato come H1 e i successivi heading partono da H2. Il comportamento può però variare in funzione del tema o del template.
Questa ultima precisazione è importante.
Non assumere automaticamente:
ho impostato il titolo in WordPress, quindi il markup sarà sicuramente corretto.
Tema, page builder, template personalizzati e blocchi possono modificare il risultato finale.
Se stai costruendo un articolo e il template genera già il titolo come H1, normalmente inizierai il body con H2:
Titolo del post → H1 generato dal template Prima sezione → H2 Sottosezione → H3 Seconda sezione → H2
Se utilizzi Elementor, Divi o un altro builder, il principio non cambia: assegna i livelli in base alla gerarchia e verifica il frontend finale.
Errori comuni con gli heading tag
Molti problemi nascono dal trattare gli heading come elementi grafici o come contenitori per keyword.
Usare gli heading soltanto per ingrandire il testo
È probabilmente l’errore più semplice da riconoscere.
Se una frase deve essere grande ma non introduce una sezione, non dovrebbe diventare automaticamente un H2.
Puoi utilizzare:
- classi CSS;
- stili tipografici;
- componenti grafici;
- blocchi specifici del tema o del builder.
La scelta di H1-H6 deve restare legata alla struttura.
Inserire keyword forzate negli H2 e H3
Non serve ripetere “heading tag” in ogni heading di una pagina sugli heading.
La ripetizione può anzi rendere i titoli meno informativi:
Heading tag: cosa sono Heading tag: vantaggi Heading tag: H1 Heading tag: H2 Heading tag: SEO Heading tag: errori
è meno naturale di:
Heading tag: cosa sono e a cosa servono H1 e tag title: qual è la differenza Si possono usare più H1? Heading e accessibilità Errori comuni con gli heading
La seconda struttura comunica meglio anche a chi scansiona velocemente la pagina.
Creare troppi livelli senza una vera struttura
Arrivare fino a H5 o H6 non rende un articolo più completo.
Se una sezione contiene:
H2
H3
H4
H5
H6
chiediti se quella profondità rappresenti davvero il contenuto oppure se stai frammentando eccessivamente una spiegazione che sarebbe più comprensibile in prosa.
Una struttura semanticamente perfetta sulla carta può comunque essere editorialmente debole se crea decine di micro-sezioni.
Confondere H1, title e header
Sono tre elementi diversi:
<title>...</title> <h1>...</h1> <header>...</header>
Il title identifica il documento nel suo <head> ed è una delle principali fonti utilizzate per il title link.
L’H1 è normalmente il titolo principale visibile del contenuto.
<header> è un contenitore semantico per contenuti introduttivi o di navigazione e può contenere un H1, ma non lo sostituisce.
Tenere distinti questi tre concetti evita molti degli errori che si incontrano ancora nelle vecchie guide HTML e SEO.
Se durante il controllo scopri che gli heading sono soltanto uno dei numerosi problemi strutturali del sito, una SEO audit permette di valutarli insieme a title, meta, linking interno, indicizzazione e altri elementi on-page e tecnici, invece di correggere ogni componente in isolamento.
Conclusione
Gli heading tag funzionano bene quando rappresentano la struttura reale del contenuto.
Per una normale pagina editoriale, partire da un H1 principale, utilizzare H2 per le sezioni e H3-H6 soltanto quando esistono vere sottosezioni produce una gerarchia semplice da comprendere e mantenere.
Il punto più importante è però non trasformare questa logica in un’altra formula SEO. Non esiste un numero ideale di H2, non serve aggiungere un heading ogni determinato numero di parole e non è necessario ripetere la keyword in ogni intestazione.
Usa gli heading per dire chiaramente di cosa parla una sezione e quale relazione ha con ciò che la contiene. Gestisci dimensioni e aspetto con CSS, controlla il markup effettivamente generato dal tuo CMS e mantieni coerenti H1, title e contenuto senza obbligarli a essere copie identiche.
È una soluzione più solida sia per chi legge la pagina sia per chi deve comprenderne la struttura.