Struttura gerarchica del contenuto con tag di intestazione Hx

Pubblicato: 2018-01-30

Sommario

    L'uso delle intestazioni di contenuto nei siti Web è un argomento piuttosto popolare che ha portato numerosi miti che persistono ancora oggi. Cosa sono allora i tag di intestazione, perché vengono utilizzati e come implementare una struttura ottimale dei tag di intestazione su un sito web?

    • 1 Cosa sono le intestazioni?
    • 2 Utilizzare i contenuti importanti nei tag di intestazione Hx
    • 3 Cosa dice Google sui tag di intestazione Hx?
    • 4 Altre informazioni essenziali sui titoli dei contenuti

    Cosa sono le intestazioni?

    I tag di intestazione vengono utilizzati per presentare la struttura del contenuto agli utenti (anche i crawler del browser Web). Esistono sei dimensioni dell'intestazione, da H1 a H6 , sebbene la prima sia di maggiore rilevanza (è l'intestazione più importante), mentre H5 e H6 vengono utilizzate raramente.

    Poiché i tag di intestazione Hx contengono testo che è (dovrebbe essere) significativamente più grande del resto del contenuto , è un indizio visivo per gli utenti che consente loro di capire cosa descrivono i paragrafi sottostanti. L'utilizzo di intestazioni di varie dimensioni per rappresentare la struttura gerarchica semplifica la digestione del contenuto da parte degli utenti.

    Nella sintassi HTML, utilizziamo i tag tra parentesi <>:

     <h1>Titolo 1</h1>
    <h2>Titolo 2</h2>
    <h3>Titolo 3</h3>
    <h4>Titolo 4</h4>
    <h5>Titolo 5</h5>
    <h6>Titolo 6</h6>

    ma su un sito web sembreranno, ad esempio, così (ovviamente, a seconda di un foglio di stile):

    Esempi di utilizzo possono essere trovati qui: https://www.w3schools.com/html/html_headings.asp.

    Usa contenuti importanti nei tag di intestazione Hx

    Quando quasi ogni giorno porta nuovi post sul blog, notizie, guide o articoli di esperti, vale la pena attirare l'utente non solo con una bella foto o un titolo accattivante, ma anche con contenuti strutturati.

    Sfogliando un articolo specifico su un dispositivo mobile, i lettori spesso prestano attenzione principalmente ai titoli. A parte gli aspetti puramente estetici, una corretta struttura delle intestazioni facilita l'interpretazione e la digestione dei contenuti, quindi c'è la possibilità che un utente rimanga più a lungo su un determinato sito web.

    Non solo gli utenti possono trarre vantaggio da un sito Web ben strutturato, ma anche i crawler possono farlo perché anche il testo dell'intestazione è importante per loro. Ecco perché è così importante che i tag di intestazione includano parole chiave che saranno correlate al contenuto della pagina in termini di soggetto. Se puntiamo a una pagina specifica con parole chiave specifiche, è opportuno inserirle (anche in forma diversa) nelle intestazioni; possono naturalmente essere inseriti nel testo, ma entro un motivo.

    Una struttura dovrebbe essere chiaramente definita e le intestazioni dovrebbero differire per dimensioni l'una dall'altra. Sarebbe un errore modellarli allo stesso modo del corpo del testo o non distinguerli per importanza.

    Intestazioni Hx negli articoli

    Mentre scriviamo post sul blog, possiamo utilizzare in modo creativo i titoli. Dovresti definire la struttura dell'articolo prima di avviarlo. I titoli possono essere incroci che dividono singoli paragrafi (come in questo stesso articolo) e il più importante di essi <h1> può essere utilizzato per descrivere l'argomento. È spesso definito automaticamente in un modello di sito Web, quindi se non è il caso, vale la pena apportare una modifica discussa con un esperto SEO e uno sviluppatore web.

    Una struttura ben progettata di un articolo può renderlo più attraente. I contenuti interessanti inseriti nei titoli informeranno chiaramente i lettori (e i crawler) cosa dovrebbero aspettarsi da un determinato articolo.

    Quali tag di intestazione inserire nella home page del sito?

    Anche le home page (o qualsiasi altra pagina, ad esempio le pagine di servizio) dovrebbero avere una struttura gerarchica di intestazioni. Nella sezione <head>, è consigliabile posizionare H1, sotto H2, H3 e così via, anche se non c'è un numero massimo di tag di intestazione. Anche nel caso di H1 non è necessario limitarsi ad una singola intestazione (come spiegato più avanti).

    Tuttavia, è necessario ricordare che sezioni come "Chi siamo" o "Ulteriori informazioni" inserite nei titoli non aggiungono molto in termini di contenuto. Inoltre, usare titoli di minore importanza, ad esempio H5–H6, è praticamente inutile (tranne che per l'aspetto del layout di un articolo).

    Siti web di una pagina = un tag di intestazione H1?

    Nel caso di siti Web di una pagina, non è così ovvio come per gli articoli del blog. Nelle specifiche HTML5 (https://www.w3.org/TR/2014/REC-html5-20141028/sections.html), puoi trovare il tag <section> responsabile della definizione delle singole sezioni in un documento HTML. Una sezione di solito include un'intestazione, quindi ogni sezione può avere una struttura gerarchica diversa, ad esempio:

     <ID sezione="informazioni">
     <h1>Su di me</h1>
     <p>Un testo su di me :)</p>
     <h2>Mi chiamo Dawid...</h2>
     <p>Secondo paragrafo su di me. lol :)</p>
    </sezione>
    
    <ID sezione="portafoglio">
     <h1>Il mio portafoglio</h1>
     <p>I miei ultimi progetti...</p>
    </sezione>
    
    <sezione>
     <h1>Testimonianze</h1>
     <p>Opinioni di clienti soddisfatti...</p>
     <h2>Ultimi tweet</h2>
     <p>Tweet 1</p>
     <p>Tweet 2</p>
    </sezione>
    
    <sezione>
     <h1>Contatto</h1>
    </sezione>
    

    Come puoi vedere sopra, ogni sezione ha un'intestazione H1 diversa, quindi un'intestazione H2... Anche se puoi decidere di avere uno o più tag di intestazione H1 e successivamente H2, H3, ecc.

    Cosa dice Google sul tag Hx?

    I dipendenti di Google hanno detto molto sui tag di intestazione, ma vale la pena citare le loro ultime opinioni. Un anno fa, John Meuller ha scritto quanto segue sul forum di Google per i webmaster: https://productforums.google.com/forum/#!msg/webmasters/BmyI8YX_25A/81hZNQFJDQA

    “Non trattiamo HTML5 in modo diverso e avere più tag H1 su una pagina va bene. Sii ragionevole quando li usi, usali dove hanno senso. Non c'è sicuramente alcuna penalità per l'utilizzo di H1".

    Poco dopo, nell'aprile 2017, John ha risposto abbastanza brevemente su Twitter (https://twitter.com/JohnMu/status/852131231928135680) alla domanda su quante intestazioni H1 possono essere utilizzate su una singola pagina.

    Infine, nell'ambito della serie YouTube "SEO Snippets" sul Google Webmaster Channel, è stata caricata una breve guida su tale questione:

    Prova Senuto Inizia la tua prova gratuita

    Altre informazioni essenziali sui titoli dei contenuti

    Anche se i dipendenti di Google suggeriscono (almeno nelle loro dichiarazioni ufficiali) un approccio flessibile ai tag di intestazione, ci sono alcune regole che vale la pena seguire:

    • Non abusare delle intestazioni di una pagina
    • Usa i titoli dove ha senso e quando riflettono il testo sottostante per aiutare gli utenti a determinare dove inizia e dove finisce un determinato paragrafo
    • Non inserire interi paragrafi (tutto il contenuto) in un'intestazione
    • Non utilizzare solo parole chiave, soprattutto in forma innaturale
    • Non nascondere le intestazioni nel corpo del testo utilizzando la stessa dimensione del carattere sia per l'intestazione che per il corpo del testo
    • Mantieni ordinata la gerarchia della struttura
    • Forse usa il tag <strong> a volte invece di un tag di intestazione ????.

    Durante la creazione di contenuti, né sovra-ottimizzare né sotto-ottimizzare; invece, cerca un equilibrio e concentrati sui sentimenti degli utenti che digeriscono i contenuti del tuo sito Web, inclusi articoli, guide o altri post del blog. Dopotutto, le intestazioni sono determinanti per il posizionamento nei motori di ricerca di Google ed è per questo che non devi trascurarle.

    Prova Senuto Inizia la tua prova gratuita