![Page 1: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/1.jpg)
I collegamenti ipertestuali
![Page 2: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/2.jpg)
I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo
di destinazione ad un elemento visualizzato nella
pagina corrente che può essere una stringa di testo o
un'immagine.
![Page 3: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/3.jpg)
Questa associazione è basata sull'utilizzo del tag
<A HREF> dove A sta per ancoraggio ed
HREF è l'abbreviazione di Hypertext-Refernce (riferimento
ipertestuale).
![Page 4: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/4.jpg)
Per creare un collegamento verso un'altra pagina dello
stesso sito la sintassi è:<A HREF="pagina2.html">
Vai a pagina 2 </A>
![Page 5: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/5.jpg)
Affinché il collegamento funzioni è fondamentale scrivere il nome del file
di destinazione correttamente, rispettando maiuscole e minuscole. Nel caso in cui il file di destinazione non si trovi nella stessa directory del file di
posizione bisogna specificare anche il percorso completo.
![Page 6: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/6.jpg)
Il tag <A HREF> permette di puntare un collegamento
anziché ad una pagina web ad un'immagine. La sintassi è:
<A HREF="foto.jpg"> Vai a foto </A>
![Page 7: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/7.jpg)
Anche in questo caso bisogna specificare correttamente il nome dell'immagine e l'eventuale percorso; supponendo che l'immagine si trovi nella cartella images si dovrà scrivere:
<A HREF="images/foto.jpg"> Vai a foto </A>
![Page 8: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/8.jpg)
Se si vuole creare un collegamento ad un file da aprire o da scaricare come ad esempio un filmato o un pacchetto compresso la sintassi è:<A HREF="file.zip"> Scarica il file in formato zip </A>dove file.zip è il file che verrà scaricato sul computer di chi naviga.
![Page 9: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/9.jpg)
Per creare un collegamento verso un'altro sito web è sufficiente inserire nel tag <A HREF> l'indirizzo completo del sito in questione:<A HREF=http://www.gdesign.it> Principi di Web Design by GDC </A>
![Page 10: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/10.jpg)
Quando una pagina è molto lunga e suddivisa in sezioni
distinte si possono creare dei collegamenti all'interno della
stessa pagina che permettono al lettore di saltare facilmente da un punto all'altro del testo.
![Page 11: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/11.jpg)
Per creare i collegamenti interni bisogna innanzitutto definire le destinazioni (ancore) nei vari punti prescelti mediante il tag <A NAME="nome scelto dal
webmaster">.
![Page 12: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/12.jpg)
Supponiamo di aver definito due destinazioni all'interno della nostra pagina:<A NAME="sezione1"> Sezione 1 </A><A NAME="sezione2"> Sezione 2 </A>
![Page 13: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/13.jpg)
adesso possiamo creare i collegamenti che ci portano alle due destinazioni secondo la sintassi:<A HREF="#sezione1"> Vai alla sezione 1 </A><A HREF="#sezione2"> Vai alla sezione 2 </A>
![Page 14: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/14.jpg)
Si possono anche combinare collegamenti esterni ed interni, cioè definire un
collegamento ipertestuale che punta ad un'ancora specifica all'interno di un'altra
pagina web.<A HREF="pagina2.html#sezione1"> Vai
alla sezione 1 della pagina 2 </A>
![Page 15: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/15.jpg)
Naturalmente anche in questo caso bisogna
aver definito in precedenza l'ancora di
destinazione nella pagina2.html.
![Page 16: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/16.jpg)
È consigliabile inserire nelle proprie pagine web un indirizzo di posta
elettronica cui i visitatori possano rivolgersi. Allora si può inserire un indirizzo cliccabile, associato cioè alla casella e-mail corrispondente, in modo che l'invio del messaggio
sia quasi automatizzato.
![Page 17: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/17.jpg)
La sintassi è:<A HREF="mailto:[email protected]> Scrivimi per informazioni </A>
![Page 18: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/18.jpg)
Fin'ora abbiamo visto collegamenti associati ad un testo, ma i collegamenti possono essere associati anche ad un'immagine. Quindi è possibile avere un'immagine cliccabile che ci porti ad un'altra pagina web, a un sito, ad una sezione e via dicendo.
![Page 19: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/19.jpg)
Per associare un collegamento ad un'immagine si usa il tag <IMG SRC> con
l'attributo BORDER="0". Ad esempio:<A HREF="pagina2.html">
<IMG SRC="pagina2.gif" BORDER="0"></A>
![Page 20: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/20.jpg)
Se non si specifica l'attributo BORDER="0" l'immagine apparirà contornata da un
profilo colorato e ciò è sconsigliabile dal punto di
vista estetico.
![Page 21: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/21.jpg)
Quando si clicca su un collegamento in una pagina web, viene caricata la nuova destinazione (immagine, pagina o sito) nella stessa finestra del browser. Seguendo i vari collegamenti ipertestuali, il lettore potrebbe non ricordarsi più il punto di destinazione.
![Page 22: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/22.jpg)
Per prevenire questo inconveniente si può fare in modo che la destinazione del collegamento venga visualizzata in una
nuova finestra del browser che si sovrappone a quella di partenza. Per
ottenere questo risultato basta aggiungere al tag <A HREF> di partenza
l'attributo TARGET.
![Page 23: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/23.jpg)
Ad esempio:<A HREF="pagina2.html" TARGET="_blank"> Vai a pagina 2 </A>
![Page 24: I collegamenti ipertestuali. I collegamenti ipertestuali si creano associando l'indirizzo (percorso/nome file) del nodo di destinazione ad un elemento](https://reader035.vdocuments.pub/reader035/viewer/2022070313/5542eb75497959361e8de9f3/html5/thumbnails/24.jpg)
Il valore dell'attributo TARGET (nell'esempio:_blank) è un nome
convenzionale e può essere inventato di sana pianta senza alcun vincolo. Il suo effetto è di
aprire in ogni caso una finestra a sé stante.