Corso SEO & HTML: #12 Tag Body

2021-08-25 11:04:58

Il Tag Body è il corpo della pagina HTML. Tutto quello che scrivi nel Tag Body sarà visibile al tuo pubblico (o quasi). Come sfruttare al massimo lato SEO?

« Corso SEO & HTML: #11 Style CSS

  • Body HTML, cos'è?
  • Quale struttura deve avere il Tag Body in HTML5?
  • Che novità ci sono nel HTML5 e come migliorano il posizionamento dei siti web nelle ricerche internet?

In questa rubrica sulla SEO dedicata alla scrittura di codice HTML ti spiego con parole semplici quali sono i tag HTML fondamentali di ogni pagina web per farti capire come è fatto un sito web in modo da sfruttare al meglio le conoscenze sulla SEO ed essere in prima pagina su Google, senza farti necessariamente diventare un webmaster o un hacker!

Tag Body

Il corpo della pagina web, la parte visibile del tuo sito

Abbiamo già visto — nelle prime battute di questo Blog sulla SEO — che il file HTML è costituito da Tags, incastonati uno dentro l'altro in modo gerarchico.

Il tag che racchiude tutte le cose in un file HTML si chiama proprio <html> che è composto a sua volta da due altri tags: <head> e <body>. 

Visita questo URL per tornare a vedere questa parte: TAG HEAD  E BODY

Mentre il tag <head> contiene cose invisibili e utili solo al browser e agli spider, tutto quello che scrivi nel tag <body> viene visualizzato sul browser dei visitatori del tuo sito (o quasi).

Come abbiamo visto nel file HTML di esempio:

che sul browser diventa:

Come puoi notare, in alto a sinistra, con un tipo di carattere predefinito del browser, tipicamente "Times new roman" detto anche "Serif", compare la scritta che è racchiusa tra il tag di apertura <body> e il tag di chiusura </body> .

Tag <body> e SEO

Come sfruttare al massimo il Tag Body per essere primi su Google

Mettiamoci per un attimo a fare il mestiere di un crawler di Google: quando lo spider va in cerca di informazioni per capire di cosa si parla in una pagina web, secondo te, da dove incomincia?

Come fa lo spider di Google a capire quale sia il testo con le parole chiave e quale sia il testo di riempimento?

Una generica pagina web solitamente ha una sezione di testa con titoli e sottotitoli che introducono l'argomento, magari ci sarà una tag-line, poi alcuni paragrafi che riportano testi più o meno pertinenti con l'argomento centrale.

Poi ci sarà un menu, in alto, di lato, o nascosto da un "Hamburger" (quell'icona formata dal tre linee orizzontali). Il menù spesso porta fuori strada il crawler, ma solitamente è uguale in tutto il sito web, quindi il crawler si accorge che quello è un menù perché lo vede tale e quale in tutte le pagine.

Lo stesso discorso vale per i banner pubblicitari che potrebbero essere presenti nella pagina web, che non devono essere presi in considerazione nel processo di indicizzazione delle pagine web.

Però noi possiamo aiutare attivamente il crawler, indicandogli con precisione quali sono le sezioni centrali e quali quelle di riempimento. Addirittura possiamo enfatizzare le parole chiave e le frasi chiave.

HTML5 ci viene incontro enormemente in questo compito, vediamo come.

Body HTML5

Struttura del tag body in HTML5

Diversamente da quanto accadeva in passato (fino all'HTML versione 4), HTML5 porta con sé una serie di innovazioni estremamente utili per portare il tuo sito web in prima pagina su Google, pertanto — se il tuo sito web non rispetta le linee guida di HTML5 o se non le sfrutta al massimo — faresti bene a rifare il sito con i nuovi "dettami".

Le vecchie versioni di HTML consentivano al webmaster di enfatizzare i titoli e i sottotitoli (mediante tag <h1>, <h2>, ... <hn>) e le parole chiave e le frasi chiave (mediante <b>, <i>, <u>).

Oggi invece esistono una serie di Tag HTML, che vedremo nel dettaglio nelle prossime settimane di questo Corso SEO, che spiegano al browser, ma soprattutto al crawler dei motori di ricerca, che ruolo ha ogni singola parte di HTML:

  • Tag Header: contiene l'intestazione
  • Tag Footer: contiene la chiusura (pié di pagina)
  • Tag Section: contiene una generica sezione della pagina web
  • Tag Article: contiene il corpo di un articolo (tipicamente di Blog)
  • Tag Nav: contiene i menu di navigazione
  • Tag Aside: rappresenta le barre laterali, solitamente utili per contenere elementi decorativi o di navigazione (widget)

Questi sono i principali Tag che servono a descrivere la struttura semantica di una pagina web, quindi non molto utili al browser ma di importanza enorme per il crawler che non deve "impazzire" per capire dove può trovare le informazioni importanti nella classificazione e nell'indicizzazione delle pagine web.

Prima dell'arrivo di HTML5 si usava un unico Tag per descrivere ognuna di queste parti: il Tag <div>, che però non informava il browser né tantomeno il crawler del motore di ricerca, sul significato intrinseco di quella particolare sezione di codice HTML.

Ovviamente più semplifichiamo la vita al motore di ricerca e più il motore di ricerca ce ne sarà grato, portandoci più in alto nella SERP (Search Engine Result Page) e fino in prima pagina su Google!


Conclusioni

Hai capito l'importanza di seguire uno schema gerarchico nelle tue pagine web, utilizzando all'interno del Tag <body> un certo ordine nell'inserimento dei vari elementi.

Dalla prossima settimana vedremo in questo Corso SEO uno alla volta tutti i Tag HTML5 di descrizione semantica delle pagine web, con particolare attenzione al tema SEO, in modo da portare i tuoi siti web in prima pagina su Google, quindi fai click su "Seguimi" per ricevere una notifica!

Ti do appuntamento alla prossima settimana, nel frattempo metti un like se questo articolo ti è stato utile e condividilo con tutti i tuoi amici che — come te — vogliono essere in prima pagina su Google, te ne saranno immensamente grati.

Se qualcosa non ti è chiaro, fammi le tue domande nei commenti, risponderò a tutti, oppure scrivimi in privato.

Iscriviti al Corso SEO Operativo per poter entrare nel gruppo privato dove parliamo ogni giorno di SEO e di come fare per essere in prima pagina su Google, a presto.

Corso SEO & HTML: #13 Tag Header »

Corso SEO Operativo: come funziona l'algoritmo di Google
Impara come funziona l'algoritmo di Google per creare i giusti contenuti e sarai sempre in prima pagina sui motori di ricerca!
by Emanuele Frisoni
6  
56