Page 10 - Guida tascabile HTML5
P. 10
Una pagina completa
Iniziamo subito ad analizzare il codice sorgente di una semplice pagina HTML:
è un ottimo punto di partenza per prendere confidenza con la sintassi e introdurre i
primi concetti base.
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
</head>
<body>
<h1>La sintassi HTML</h1>
<p>I tag descrivono il ruolo di ogni elemento</p>
</body>
</html>
NOTA Provate a creare un documento testuale con questo contenuto, a salvarlo con
estensione .html e ad aprirlo con un browser per vedere l’effetto del markup.
I tag sono racchiusi tra i simboli di minore < e maggiore >, e prevedono, tranne
alcuni casi particolari, un’apertura e una chiusura: per esempio il testo compreso
tra <h1> e </h1> rappresenta un titolo (heading) di primo livello nel flusso del
documento. Il tag di chiusura si differenzia da quello di apertura per la presenza
del simbolo / (slash) dopo il simbolo <.
TERMINOLOGIA La dichiarazione nella prima riga, <!DOCTYPE html>, è indispensabile e
definisce il tipo di documento: con questa sintassi il browser farà correttamente
riferimento alle direttive della specifica HTML5 per interpretare il markup.
Il codice sorgente della pagina è all’interno del tag <html>, che si apre all’inizio
del documento e si chiude nell’ultima riga con </html>. All’interno di questo tag
sono nidificate le due sezioni principali che compongono ogni documento: la
sezione <head> raccoglie informazioni sul documento (i cosiddetti metadati),
mentre nella sezione <body> è presente il contenuto vero e proprio che verrà
visualizzato.
La Figura 1.1 mostra la resa grafica del documento in un browser.
