HTML.itHTML.it


 I TAG dell'HTML: come scriverli


Struttura di un tag

Abbiamo detto che all'interno di ogni pagina è presente una serie di marcatori (i TAG), a cui viene affidata la visualizzazione e che hanno differenti nomi a seconda della loro funzione. I tag vanno inseriti tra parentesi uncinate (<TAG>), la chiusura del tag viene indicata con una "/" (è il simbolo comunemente detto "slash". Quindi: </TAG>). Il contenuto va inserito tra l'apertura e la chiusura del tag medesimo, secondo questa forma:

<TAG attributi>contenuto</TAG>

Ecco un esempio, con una sintassi che serve a disporre un testo giustificato a destra:

<P align="right">testo</P>

dall'esempio è evidente che la struttura di un attributo è: attributo="valore"

Quindi in definita la struttura di un tag sarà:

<TAG attributo_1="valore1" attributo_2="valore2">contenuto</TAG>

Alcuni particolari tag non hanno contenuto - perché ad esempio indicano la posizione di alcuni elementi (come il tag delle immagini) -, conseguentemente questi tag non hanno neanche chiusura. La loro forma sarà dunque:

<TAG attributi>

Ecco un esempio di immagine:
<IMG widht="20" height="20" SRC="miaImmagine.gif" ALT="alt">
come si vede il tag non viene chiuso. Questo tipo di tag viene detto "empty", cioè "vuoto".

Annidamento e indentazione

Una caratteristica importante del codice HTML è che i tag possono essere annidati l'uno dentro l'altro. Anzi molto spesso è necessario farlo.

Ad esempio:
<TAG1 attributi>
	contenuto 1
	
	<TAG2>
		contenuto 2
	</TAG2>

</TAG1>
Potremmo quindi avere ad esempio:
<P align="right">
	testo 1
		
		<P align="left">
			testo 2
		</P>

</P>
L'annidamento ci permette quindi di attribuire formattazioni successive al testo che stiamo inserendo.

Come si può vedere già nell'esempio, è una buona norma utilizzare dei caratteri di tabulazione (il tasto tab a sinistra della lettera Q) per far rientrare il testo ogni volta che ci troviamo in presenza di un annidamento e man mano che entriamo più in profondità nel documento.

In pratica apertura e chiusura del tag si trovano allo stesso livello, mentre il contenuto viene spostato verso destra di un tab: non si tratta soltanto di un fattore visivo, ma l'allineamento di apertura e chiusura tag viene mantenuto anche se scorriamo in verticale il documento con il cursore.

Questa procedura si chiama indentazione, e grazie ad essa il codice HTML risulta più leggibile. Si confronti ad esempio:
<P align="right">testo 1<P align="left">	testo 2	</P></P>
con:
<P align="right">
	
	testo 1
		<P align="left">
			testo 2
		</P>

</P>
per il browser i due esempi sono equivalenti, ma per l'utente umano è evidente che la differenza è notevole: pensate ad una pagina complessa visualizzata in un unico blocco di testo: sarebbe del tutto illeggibile!


    Torna a inizio pagina