©
Giselda
De
Vita
-‐
2015
1
• In informatica, un collegamento
ipertestuale (in inglese hyperlink, spesso
abbreviato in link, usato anche in italiano)
è un rinvio da un'unità informativa su
supporto digitale ad un'altra
(fonte Wikipedia)
©
Giselda
De
Vita
-‐
2015
2
• I collegamenti ipertestuali furono concepiti negli anni
sessanta; la loro diffusione esplose con l'espansione di
Internet e del World wide web, dove i collegamenti
ipertestuali uniscono come una miriade di fili gli
innumerevoli siti della rete.
• Con la diffusione di massa di Internet, i collegamenti
ipertestuali sono stati associati indissolubilmente al
tag HTML <a>, come in questo esempio:
<a href="http://it.wikipedia.org">Wikipedia</a>
• che, se cliccato, conduce alla risorsa indicata
dall'Uniform Resource Locator (URL) href=http://
it.wikipedia.org
(fonte Wikipedia)
©
Giselda
De
Vita
-‐
2015
3
Parte
Des4nazione
Cliccabile
De=a
Anchor
text
©
Giselda
De
Vita
-‐
2015
4
• Il testo che contiene un collegamento o
link a un'altra pagina è denominato in
inglese anchor text.
• I motori di ricerca tengono molto conto
di questo fattore. I termini che fanno
da ancora vengono considerati quasi
come se fossero delle parole chiave.
(fonte Wikipedia)
©
Giselda
De
Vita
-‐
2015
5
Fonte: http://hellointernet.org/web101/whatsTheWeb.html
©
Giselda
De
Vita
-‐
2015
6
Un link può puntare verso qualsiasi tipo di
risorsa identificata da una URL:
• Una ulteriore pagina WEB
• Immagine .gif, .jpg, .png
• Documento pdf, doc
• Animazioni flash
• Audio, video o codice java
©
Giselda
De
Vita
-‐
2015
7
Le risorse possono essere gestite:
• direttamente dal browser, nel caso di
altre pagine html e immagini
• da plugin audio e video, flash e java
©
Giselda
De
Vita
-‐
2015
8
• I plugin sono componenti software che permettono di
usufruire di contenuti speciali presenti nelle pagine web,
che il browser non è in grado di gestire di default. Infatti
sono programmi di terze parti, creati da aziende esterne, e
non dal browser.
• I plugin più comuni:
– plugin di Adobe Flash Player (per visualizzare file Flash)
– plugin di Adobe PDF (per gestire file PDF online)
– plugin di Adobe Shockwave (visualizza giochi e video
Shockwave)
– plugin di Java (per gestire qualsiasi applet in Java: giochi
online, chat e molti altri contenuti speciali interattivi sono
creati in JAVA)
– plugin di Quicktime (lettore multimediale creato da Apple)
– plugin di Silverlight (per video o applicazioni web interattive)
– plugin di Windows Media Player (per file audio)
– plugin di Microsoft (per la gestione di file di Office, ma anche
per meeting online ed altri specifici contenuti)
©
Giselda
De
Vita
-‐
2015
9
https://www.mozilla.org/en-US/plugincheck/
©
Giselda
De
Vita
-‐
2015
10
• I tag che si adoperano per creare link
sono <a> e </a>.
• Il tag <a> definisce l'inizio del link,
mentre </a> ne indica la fine.
• Tutto quello che sta tra questi due tag si
comporterà come un link.
©
Giselda
De
Vita
-‐
2015
11
• La destinazione del link si aggiunge al
tag <a> usando href=http://www.nomesito.com
• Nell’esempio sottostante la parola qui
diventa un link per google.
Clicca <a href="http://www.google.com">qui</a> per
andare su Google.!
©
Giselda
De
Vita
-‐
2015
12
Ci sono tre tipi di link:
• Link interni che si agganciano alla pagina
corrente
• Link locali per altre pagine dello stesso
sito
• Link esterni, o globali, per pagine al di
fuori del sito.
©
Giselda
De
Vita
-‐
2015
13
• I link interni alle pagine vengono anche
chiamate anchor
• Le ancore puntano una zona all'interno di
una pagina.
• L'ancora viene creata usando il tag <a>
e name
<a name="capitolo1">Capitolo 1</a>
"
©
Giselda
De
Vita
-‐
2015
14
• Creata l’ancora, normalmente si crea il
link ricordando di inserire il carattere #
prima del nome indicato nell’ancora.
Clicca <a href=”#capitolo1">qui</a>
per leggere il Capitolo 1."
©
Giselda
De
Vita
-‐
2015
15
Salvare
come
link_interno.html
©
Giselda
De
Vita
-‐
2015
16
• Per testare i link interni rimpicciolire la
finestra del browser
©
Giselda
De
Vita
-‐
2015
17
• Per far riferimento ad una pagina HTML
del nostro sito, che si trova nella stessa
cartella, basterà usare un path “relativo”
e quindi solo il nome del file
<a href="pagina.html">collegamento</a>!
©
Giselda
De
Vita
-‐
2015
18
Salvare
come
link_locale.html
©
Giselda
De
Vita
-‐
2015
19
Cliccando
sul
link
©
Giselda
De
Vita
-‐
2015
20
• Per default, i link si aprono nella finestra
o schermata corrente.
• Per far aprire il link in un'altra finestra,
si usa l’attributo target
• Proviamo ad aprire il link in una nuova
finestra:
<a href=”link_interno.html" target="_blank">"
©
Giselda
De
Vita
-‐
2015
21
©
Giselda
De
Vita
-‐
2015
22
Aperto
Nuovo
TAB
Cliccando
sul
link
©
Giselda
De
Vita
-‐
2015
23
• Anche un'immagine può funzionare come
un link
• Il metodo è lo stesso che si usa per i
testi.
!
!<a href=“link_interno.html"> " ""
" "<img src="rainbow.gif">"
"</a> "
©
Giselda
De
Vita
-‐
2015
24
©
Giselda
De
Vita
-‐
2015
25
©
Giselda
De
Vita
-‐
2015
26
