Guida all'HTML
a cura di Riccardo Guido e Gregorio Teti

Creare un Link

Innanzitutto il Link o Anchor è un collegamento, l'esempio più semplice è il collegamento ad un'altra pagina, <A  con gli eventuali attributi tra cui il più importante è HREF>
Esempio:
OperazioneCodiceEsempio:
Codice precedente
Corpo del testo
Collegamento
Chiudi corpo del testo
Chiude la pagina
...
<BODY>
<A HREF="NomePagina.htm"></A>
</BODY>
</HTML>

È importante ricordarsi che nell'esempio "NomePagina.htm" è un URL relativo, quindi se entrambe le pagine Index.htm (supponiamola la pagina principale dove noi abbiamo messo il Link che la collega al nostro esempio) e NomePagina.htm sono nella stessa Directory allora il Browser aprirà la pagina, se fossero in directory diverse vi segnalerà che la pagina non è disponibile. Quindi se create un Link ponetevi sempre questa domanda: In quale cartella è presente la pagina che ho aperto? Poi verificate dove questa cartella è posizionata rispetto alla cartella principale dove è contenuto tutto il vostro progetto e verificate che la cartella che contiene NomePagina.htm sia presente anch'essa. A questo punto diventa facile creare l'indirizzo corretto; Es. La Cartella "A" contiene la Cartella "B" (in cui troviamo index.htm) e la Cartella "C" (in cui troviamo NomePagina.htm), il percorso sarà: <A HREF="../C/NomePagina.htm">.

Inserire un'immagine

Ricordandosi quello che è stato detto per il Link circa i collegamenti relativi, per immettere un'immagine utilizziamo il Tag IMG, quindi avremo: <IMG  con l'attributo SRC>
Esempio:
OperazioneCodiceEsempio:
Codice precedente
Corpo del testo
Immagine
Chiude corpo del testo
Chiude la pagina
...
<BODY>
<IMG SRC="immagine.gif">
</BODY>
</HTML>

Naturalmente vi consiglio inserire anche gli attributi WIDTH(larghezza) e HEIGHT(altezza) dell'immagine e possibilmente in percentuale onde evitare distorsioni dell'immagine a risoluzioni diverse. Vi consiglio anche di inserire un'immagine in una tabella, in questo modo riusciremo a gestire con più facilità il posizionamento e dell'eventuale testo che la circonda.

Creare una lista

Se abbiamo l'esigenza di creare una pagina Web con molti collegamenti ad altre pagine possiamo sintetizzare i vari collegamenti creando una lista, che si comporta come un vero e proprio Sommario.Il tag che richiama la funzione Lista è UL, per una lista generica OL per una lista ordinata; quindi avremo: <UL  ... /UL>
Esempio:
OperazioneCodiceEsempio:
Codice precedente
Corpo del testo
Apre la lista
Titolo
Elemento 1
Elemento 2
Elemento 3
Chiude la Lista
Chiude la pagina
...
<BODY>
<OL>Nipoti di Paperino
<LI>Qui</LI>
<LI>Quo</LI>
<LI>Qua</LI>
</OL>
</BODY>
</HTML>

La lista nell'esempio è molto semplice, con un pó di fantasia possiamo renderla più complessa e creare un vero e proprio sommario. Immettendo l'attributo type nel tag OL (o UL) possiamo modificare la rappresentazione degli elementi "indice" nella Lista; nel nostro caso possiamo sostituire "1","2","3" con i numeri romani (Es.<OL type="I","II","III">, oppure mettere riferimenti grafici tipo il cerchietto <OL type="circle" >

< Indietro

< Menu Principale >

Avanti >