Doctype in Html

In questa lezione del corso Html ti parlo del doctype

Il doctype (acronimo di Document Type Declaration) è una dichiarazione presente all'inizio di un documento HTML o XML che specifica il tipo di documento e la versione del markup utilizzata.

A cosa serve?

Il doctype aiuta i browser a interpretare correttamente il contenuto della pagina e a visualizzarlo in modo conforme agli standard.

Pertanto, devi inserirlo nella prima riga del documento, prima del tag <html>.

Ti faccio un esempio pratico.

In un documento HTML5 il doctype si presenta in questo modo

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

Il doctype indica al browser che il documento è una pagina HTML5.

In questo modo il browser si predispone per interpretarlo al meglio.

Nota. In HTML5 la dichiarazione del doctype è facile da ricordare e molto più semplice rispetto alle versioni precedenti di HTML (Html 4, 3, ecc.) perché richiede una dichiarazione del sistema o del tipo di documento. Ad esempio, nell'HTML 4.01 la stringa del doctype era qualcosa del genere

esempio doctype del HTML 4.01

Un esempio di documento HTML5

Ecco un esempio di pagina HTML completa che include un doctype per HTML5 e una struttura di base per una pagina web con le tipiche sezioni header, nav, main e footer, e alcuni titoli e contenuti di esempio.

<!DOCTYPE html>
<html>
<head>
<title>Esempio di Pagina HTML</title>
</head>
<body>
<header>
<h1>Questo è un esempio di pagina HTML</h1>
</header>
<nav>
<ul>
<li><a href="#sezione-1">Sezione 1</a></li>
<li><a href="#sezione-2">Sezione 2</a></li>
<li><a href="#sezione-3">Sezione 3</a></li>
</ul>
</nav>
<main>
<section id="sezione-1">
<h2>Sezione 1</h2>
<p>Questo è il contenuto della sezione 1</p>
</section>
<section id="sezione-2">
<h2>Sezione 2</h2>
<p>Questo è il contenuto della sezione 2</p>
</section>
<section id="sezione-3">
<h2>Sezione 3</h2>
<p>Questo è il contenuto della sezione 3</p>
</section>
</main>
<footer>
<p>Questo è il footer della pagina</p>
</footer>
</body>
</html>