2 - Struttura tipica di un documento

Un documento HTML è un normalissimo file di testo che presenta nel suo interno delle istruzioni che ne determinano l'aspetto estetico finale, permettendo diversi tipi di formattazione e l'inclusione di immagini, suoni, collegamenti (links) con altri documenti, etc.
La struttura tipica di un documento HTML assume la forma seguente:



Iniziamo con il notare che tutte le istruzioni HTML (generalmente chiamate tags) vengono racchiuse fra parentesi angolate, nella forma <istruzione>, e che vengono generalmente terminate da un'istruzione del tipo </istruzione>.
In questo modo è possibile definire delle porzioni di documento tutte contenute all'interno di una successione <istruzione>....</istruzione> e che risentono dell'influenza di tale istruzione.
E' possibile inoltre nidificare le istruzioni, ovvero contenere delle istruzioni in altre istruzioni, ottenendo qualcosa del tipo <istruzione1><istruzione2>....</istruzione2></istruzione1>, come si puo' osservare nella struttura in fig.1, dove troviamo un'istruzione <HTML> che racchiude in se due sottosezioni create dalle istruzioni <HEAD> e <BODY>, la prima delle quali contiene anche un'istruzione <TITLE>.
Esaminiamo ora nel dettaglio la struttura tipica rappresentata in fig.1

Un documento inizia sempre con il tag <HTML> e termina con il corrispondente </HTML>, ad indicare che tutto ciò che si trova compreso fra queste due istruzioni dev'essere considerato come un documento in formato HTML.
All'interno troviamo due sezioni, una d'intestazione <HEAD> ... </HEAD> ed una di corpo vero e proprio <BODY> ... </BODY>.
La prima contiene quelle informazioni che sono necessarie per classificare il documento, delle quali la più importante è quella relativa al titolo, che dev'essere racchiuso fra i tags <TITLE> ... </TITLE> e che verrà evidenziato dal browser che visualizzerà il documento, generalmente scrivendolo nella barra del titolo della finestra di visualizzazione. Le norme ufficiali che definiscono lo standard HTML non prevedono un limite alla lunghezza del titolo del documento, tuttavia si raccomanda di non eccedere i 64 caratteri, in quanto alcuni browser potrebbero non visualizzarlo correttamente.
L'intestazione può contenere anche altre informazioni, ma di questo discuteremo più in dettaglio in seguito.
Il corpo del documento invece viene racchiuso all'interno dei tags <BODY> ... </BODY> ed è composto dal testo vero e proprio e da numerose altre istruzioni di formattazione, d'inclusione immagini, di richiamo documenti esterni, etc.


UN BREVE RIPASSO

Di già?? Si, così veniamo alle finalità di questa fiumana di parole: mettervi in grado di confezionare un bel sito, con tanta bella grafica e con un occhio sempre puntato ai problemi di connessione.
Vogliamo fare un esempio? E allora, si parte!!
Prendete l'editor di testi, create un documento di testo nuovo e scrivete:
<HTML>
<HEAD>
<TITLE>File di prova</TITLE>
</HEAD>
<BODY>

</BODY>
<HTML>

E salvatelo come "base.html". Questo file sarà proprio il punto di partenza su cui svilupperemo tutto il corso. Il primo tag (html) avvisa il nostro browser che quello che si troverà di fronte sarà un file HTML generico.
Il secondo e il quarto delimitano l'intestazione (head) del documento, mentre i tag titolo (title) avvisano il browser che quello sarà il nome della pagina, da scrivere sulla barra, appunto, del titolo. La vostra finestra del browser si aprirà infatti con un bel "File di prova".
Terminata l'intestazione, inizia il corpo del documento, che non a caso è delimitato dalla coppia di tag body (in inglese, corpo). Tutte le modifiche e le aggiunte che andremo a fare, le faremo tra i tag <body> e </body>. Leggetela bene la frase che precede, perché se qualcuno mi manda una mail chiedendomi "perché io aggiungo le istruzioni alla fine del documento, e il browser non me le visualizza?", lo bacchetto sulla tastiera!!
Ripeto: tutto, e sottolineo TUTTO ciò che segue, andrà aggiunto e/o sostituito SOLO ed ESCLUSIVAMENTE tra i tag corpo. Chiaro?
Un piccolo trucco: ricordatevi che quando modificate una pagina per poi farla visualizzare al browser, dovete sempre salvarla e che, solo allora, dovrete premere il pulsante "aggiorna" (o reload, che tutti i broswer hanno) per far sì che il medesimo la ricarichi da capo senza ricorrere alla sua cache (memoria tampone).