Home   Informatica   (X)Html   10. Lezione: i link

10. Lezione: i link

Scritto da sergio il 27/05/2009 15:17:08

Una delle caratteristiche principale dei documenti web, anzi direi proprio la caratteristica fondamentale, e' quella di essere legati tra loro. Una parola particolare di un documento puo' richiamare un intero altro documento. E' la definizione del cosidetto "ipertesto", cioe' la possibilita' di "navigare" tra le informazioni contenute nei documenti selezionando determinate parole, porzioni di testo, immagini o altri elementi che vedremo, che richiamano altri documenti web.
Questi elementi vengono definiti tramite il tag <a> (anchor) e tramite l'attributo "href" viene definita la destinazione della navigazione. Il testo che viene scritto all'interno del tag (tra <a> e </a>) e' l'elemento "ancorato", cioe' l'ipertesto.

Ecco un semplice esempio:

Code:

<a href="http://www.vastacom.org">Visitate il sito di VastaCom!</a>


Questo e' un vero e proprio link "esterno", viene cioe' definita un navigazione ad una altro sito di cui viene specificata la URL.

Possiamo con lo stesso sistema definire invece dei link "interni" al nostro sito (dove per sito intendiamo una raccolta di pagine o documenti web collegati tra loro):

Code:

<a href="pagina2.htm">vai alla pagina 2...</a>


Immaginiamo di avere una "pagina1.htm" e di averci inserito questo link alla pagina 2 per impostare una navigazione sequenziale al nostro sito, ma possiamo anche immaginare un piccolo menu':

Code:

<h5>Menu' Principale</h5>
<ul>
   <li><a href="pagina1.htm">Voce 1</a></li>
   <li><a href="pagina2.htm">Voce 2</a></li>
   <li><a href="pagina3.htm">Voce 3</a></li>
</ul>


Possono essere definiti anche dei link all'interno del singolo documento web, che rimandano, cioe', a specifiche posizioni del documento:

Code:

<a href="#footer">Vai in fondo alla pagina</a>
...
<a name="footer">Siamo in fondo alla pagina</a>


In questo caso il primo tag <a> definisce il link per "andare in fondo alla pagina", cioe' posizionare il documento all'altezza del segnaposto "footer". Il secondo tag <a> definisce il segnaposto "footer" con il testo al suo interno.
Ovviamente per rendersi conto del funzionamento dell'esempio dovreste inserire un po' di righe al posto dei puntini... altrimenti non vedrete lo scrolling della pagina verso il basso...

Alla prossima!!

Ultimo aggiornamento 11/01/2020 10:41:10