Il tag <BODY> in Html

In questa lezione ti spiego cos'è tag <body> del linguaggio HTML e come utilizzarlo correttamente in una pagina web.

<body> ... </body>

Il tag <body> è uno dei componenti più importanti del documento ipertestuale perché contiene il contenuto visibile di una pagina web.

Tutto ciò che inserisci tra i tag di apertura e chiusura del <body> viene visualizzato sul browser dell'utente.

Dove va inserito il tag <body>?

Il tag <body> devi inserirlo all'interno del tag <html>.

<!DOCTYPE html>
<html>
<head>
...
</head>
<body>
...
</body>
</html>

Si chiama <body> perché è il corpo del documento e va inserito subito dopo la sezione <head>.

Per ricordarlo immagina il documento html come al corpo di una persona con una testa (head) e un corpo (body)

A cosa serve il tag <body>?

Oltre a contenere i contenuti visibili del documento, il tag <body> contiene anche i tag del linguaggio Html che ti permettono di organizzare e formattare il testo e gli elementi multimediali della pagina web.

Quindi, è essenziale per ottenere una pagina web ben strutturata e facile da leggere per gli utenti.

Nota. Le informazioni nella sezione <body> sono il contenuto vero e proprio della pagina. Al suo interno si trovano le informazioni che l'utente desidera leggere. Pertanto, è di fondamentale importanza organizzare bene il contenuto del tag <body>. Da questo deriva la buona o cattiva esperienza dell'utente sulla pagina.

La sezione <body> svolge anche un ruolo fondamentale nel fornire le informazioni ai motori di ricerca per classificare e indicizzare la tua pagina web.

Quando un motore di ricerca scansiona la pagina, cerca di capire gli argomenti trattati analizzando il contenuto (testo, immagini, video, ecc.) della sezione <body>

Pertanto, il tag <body> è un elemento chiave per la SEO (Search Engine Optimization) del tuo sito.

Nota. Il tag <body> può contenere diversi elementi importanti per l'ottimizzazione sui motori di ricerca. Ad esempio i tag degli header <h1>, <h2>, <h3> , quello dei paragrafi <p> , delle immagini <img>, dei video <video> e molti altri ancora. Questi elementi forniscono informazioni aggiuntive ai search engine sui contenuti della tua pagina e li aiutano a classificarli in base alla loro rilevanza e pertinenza.

Ecco un esempio pratico di pagina web completa

<!DOCTYPE html>
<html>
<head>
<title>titolo della pagina</title>
</head>
<body>
<header>
<h1>Il mio sito web</h1>
</header>
<main>
<section>
<h2>Chi siamo</h2>
<p>Nigiara è una guida al web... </p>
</section>
</main>
<footer>
<p>© 2023 Il mio sito web.</p>
</footer>
</body>
</html>

In questo esempio, il tag <body> del documento HTML contiene tutto il contenuto principale della pagina.

All'interno del tag <body> il testo è suddiviso in varie sezioni <header>, <main>, <footer>, <section> per strutturare bene il contenuto e facilitare l'indicizzazione da parte dei motori di ricerca.

Quali sono gli attributi del tag <body>

Il tag <body> non ha molti attributi specifici.

Puoi comunque associargli gli attributi globali che possono essere utilizzati con qualsiasi elemento HTML.

Ecco alcuni degli attributi globali che possono essere utilizzati con il tag <body>:

class
Specifica una o più classi per applicare uno stile CSS specifico al contenuto all'interno del tag <body>.
id
Specifica un identificatore unico il tag <body>.
style
Indica uno o più attributi di stile CSS da applicare al contenuto all'interno del tag <body>.
title
Ti permette di associare un titolo al tag <body>.

Nota. Generalmente si utilizza il tag <body> senza indicare alcun attributo. Puoi comunque associargli uno stile direttamente nel foglio di stile CSS attribuendo al tag body delle proprietà specifiche, senza bisogno di usare una classe, un identificatore o l'attributo style.