Articles

Intestazioni HTML: La guida completa all’aggiunta di titoli per la struttura del documento

Intestazioni di contenuto

I sei tag di intestazione sono una parte importante della scrittura di contenuti HTML. Oltre al bisogno un po ‘ ovvio che riempiono (le persone a volte vogliono mettere i titoli in cima alle cose), i tag del titolo hanno anche valore SEO, ti aiutano a essere uno scrittore più organizzato e rendono le pagine più user-friendly.,

Tag headline e SEO

Ci sono due cose che un motore di ricerca sta cercando di capire sulla tua pagina:

  • Di cosa si tratta?
  • Quanto è buono?

Generalmente, i collegamenti a una pagina vengono utilizzati come misura della qualità (quanto è buono) e l’analisi on-page viene utilizzata per capire di cosa tratta la pagina. (C’è qualche sovrapposizione qui ovviamente: Google dà alcuni giudizi sulla qualità di una pagina guardando la pagina, e cerca anche di capire di cosa si tratta la pagina guardando ciò che dicono le altre pagine quando si collegano ad essa.,) Una delle (molte) cose che Google e altri motori di ricerca guardano determinano il contenuto di una pagina sono le parole che appaiono all’interno dei tag di intestazione. Ecco perché, se stai cercando di classificare parole o frasi particolari, è davvero un’idea includere quelle parole e frasi nei tag del titolo.

Scrittura più organizzata

Quando le persone scrivono senza usare tag headline (ad esempio, quando scrivono a mano o in editor visivo come MS Word), spesso scrivono solo in lunghi flussi di testo ininterrotti che vanno avanti troppo a lungo., O, peggio ancora, potrebbero aggiungere titoli visivi (con grassetto, maiuscole, testo più grande o qualcos’altro. Questo è molto comune, poiché le persone sanno istintivamente che dovrebbero suddividere il testo in blocchi più piccoli. Il problema è che non è quindi chiaro come le diverse sezioni siano correlate l’una all’altra. La sezione intestata con carattere 15pt dovrebbe essere una sottosezione dei titoli delle parti con carattere grassetto 14pt? Spesso, anche lo scrittore non lo sa perché non ci hanno davvero pensato.,

Tag headline crea una gerarchia di contenuti

In una pagina con un singolo contenuto (che dovrebbe essere la maggior parte delle pagine), il titolo principale per quel contenuto dovrebbe essere un tag<h1>. Le sezioni principali all’interno di quel contenuto dovrebbero essere titolate con <h2>. Le sottosezioni all’interno di tali sezioni dovrebbero essere intestate con <h3> e così via. Dovrebbe essere possibile estrarre un contorno dai tag del titolo. (In realtà, lo facciamo-guarda il widget Contenuti nella parte superiore della pagina.,) Questa struttura rende la scrittura più organizzata, che (almeno il 99% delle volte) rende anche la scrittura migliore.

Protip: Molti di noi che scrivono online mappano prima i titoli e poi compilano le sezioni. È solo una delineazione vecchio stile, ma sicuramente può rendere la scrittura molto più veloce e il risultato finale è di solito molto più coerente rispetto a quando hai appena iniziato in alto e sperato di arrivare da qualche parte prima di aver finito.

I titoli sono buoni per gli utenti

Ecco un piccolo segreto sporco sui contenuti online: i lettori scremano. Quasi nessuno legge ogni parola di un articolo online., E c’è molto poco che puoi fare al riguardo. Di certo non puoi fermarlo. Ma si può fare in modo che skimmer avranno qualcosa a cui aggrapparsi come i loro occhi si muovono verso il basso la pagina. I titoli, se sono ben distribuiti e pertinenti al loro contenuto, danno agli skimmer un sacco di piccoli modi per tornare nel testo dell’articolo. Rompono anche l’articolo in pezzi apparentemente digeribili, in modo che uno skimmer ansioso non sia reso ansioso da una lunga colonna di testo ininterrotto.,

E non dimenticare di collegare

A partire da HTML5, puoi collegarti a qualsiasi elemento di una pagina aggiungendo un segno hash (#) eid dell’elemento. (In passato, si poteva solo collegare agli elementi di ancoraggio.) Aggiungendo un id a ogni titolo della tua pagina, puoi consentire alle persone di collegarsi a qualsiasi posto nel tuo documento. (Di nuovo, guarda come funzionano i link al contenuto nella parte superiore della pagina.,) Questi collegamenti nel documento possono essere estremamente utili, specialmente se fornisci contenuti di riferimento di qualsiasi tipo, o se i tuoi articoli sono particolarmente lunghi.

Utilizzando i tag headline per strutturare il contenuto

In generale, ci sono due tipi di pagine di contenuto: pagine di contenuto singolo (che presentano un singolo pezzo di contenuto) e pagine indice (che elencano un gruppo di contenuti). Le pagine indice includono la pagina principale del blog di un sito, gli archivi di categorie e tag, le pagine dell’autore che elencano tutti gli articoli scritti dall’autore e così via., Poi c’è anche il contenuto (barre laterali, widget, piè di pagina) che appare su quasi tutte le pagine e che non è realmente “contenuto.”Il modo in cui si utilizzano i tag del titolo in queste situazioni può avere un impatto sul SEO e sull’usabilità.

<h1> e <h2> elementi

Su singole pagine di contenuti di tutto il sito, il titolo di quel particolare pezzo di contenuto quasi sempre nel <h1> tag vicino alla parte superiore del <body>., Quindi, come menzionato sopra, le tue sezioni all’interno dell’articolo possono utilizzare i tag <h2>.

<main><article> <h1>All About Headlines</h1> . . . <h2>Headlines and SEO</h2> . . . <h2>Headlines and Structure</h2> . . . </article></main> 

In una pagina indice, di solito ha senso inserire il titolo del sito in un tag<h1>, o inserire il nome dell’indice lì: il nome della categoria, il nome dell’autore o qualsiasi altra cosa che definisce quella pagina. Quindi i titoli di tutti i singoli pezzi che sono elencati dovrebbero avere un elemento<h2> per i loro titoli.,

In passato è stato comune usare un tag <h2> per il titolo del sito quando appare su pagine a contenuto singolo.

<header> <h2>HTML Code Tutorials</h2> <nav><!-- menu --></nav> </header> <main> <h1>Actual Title of This Page</h1? . . . </main> 

Le opinioni sono contrastanti su questo, ma la tendenza è sempre meno. Più persone stanno semplicemente mettendo il titolo (e, più probabilmente, un logo img) nell’intestazione e salvando i tag del titolo per specifici contenuti sulla pagina. Parte della vostra considerazione per se fare questo avrà probabilmente a che fare con quanto sia importante il titolo del proprio sito in relazione ai vostri obiettivi SEP.,

Widget e altri “non contenuti”

Fino a poco tempo fa era comune usare<h3>o<h4> elementi per i titoli dei widget nelle barre laterali. Molti sistemi di gestione dei contenuti semplicemente farlo automaticamente, quindi potrebbe non importa a voi. Ma è qualcosa a cui potresti voler pensare se stai progettando il markup dell’intera pagina da zero. Vuoi che i tuoi elementi del titolo suggeriscano che il vero significato della tua pagina è “Login” o “Iscriviti alla Mailing List”?, (Ovviamente, questo è parzialmente evitato posizionando la barra laterale in un elemento<aside>.)

Adam è uno scrittore tecnico specializzato in documentazione per sviluppatori e tutorial.