Argomenti
L'HTML offre molti dei convenzionali idiomi di pubblicazione per documenti rich text (RTF) e documenti strutturati, ma quello che lo separa dalla maggior parte degli altri linguaggi di marcatura sono le sue caratteristiche per documenti ipertestuali ed interattivi. Questa sezione introduce il collegamento (o ipercollegamento, o collegamento Web), il costrutto ipertestuale di base. Un collegamento è una connessione da una risorsa Web ad un'altra. Sebbene sia un concetto semplice, il collegamento è stato una delle forze primarie che hanno portato al successo il Web.
Un collegamento ha due estremità -- chiamate ancore -- e una direzione. Il collegamento inizia dall'ancora sorgente e punta su quella di destinazione, che può essere una risorsa Web qualsiasi (ad es., un'immagine, un video clip, un frammento di suono, un programma, un documento HTML, un elemento interno ad un documento HTML, ecc.).
Il seguente brano HTML contiene due collegamenti, uno la cui ancora di destinazione è un documento HTML denominato "capitolo2.html" e l'altro la cui ancora di destinazione è un'immagine GIF denominata "foresta.gif":
<BODY> ...altro testo... <P>Potrai trovare maggiori informazioni nel <A href="capitolo2.html">capitolo due</A>. Vedere anche la <A href="../immagini/foresta.gif">mappa della foresta incantata.</A> </BODY>
Attivando questi collegamenti (ad es. premendo sul mouse, digitando sulla tastiera, impartendo comandi vocali) gli utenti possono visitare queste risorse. Da notare che gli attributi href in ogni ancora sorgente specificano gli indirizzi di destinazione con un URI.
L'ancora di destinazione del collegamento può essere un elemento contenuto in un documento HTML. L'ancora di destinazione deve avere un nome e per ogni URI indirizzato, l'ancora deve includere il nome del relativo identificatore di frammento.
Le ancore di destinazione nei documenti HTML possono essere specificate dall'elemento A (assegnandogli un nome con l'attributo name), o tramite qualsiasi altro elemento (assegnandogli un nome tramite l'attributo id).
Così, per esempio, un autore può creare un sommario le cui voci mettano in collegamento gli elementi di intestazione H2, H3, ecc., nello stesso documento. Usando l'elemento A per creare l'ancora di destinazione, scriveremo:
<H1>Sommario</H1> <P><A href="#sezione1">Introduzione</A><BR> <A href="#sezione2">Background</A><BR> <A href="#sezione2.1">Note personali</A><BR> ...il resto del sommario... ...il corpo del documento... <H2><A name="sezione1">Introduzione</A></H2> ...sezione 1... <H2><A name="sezione2">Background</A></H2> ...sezione 2... <H3><A name="sezione2.1">Note personali</A></H3> ...sezione 2.1...
Si può ottenere lo stesso effetto trasformando gli elementi di intestazione stessi in ancore:
<H1>Sommario</H1> <P><A href="#sezione1">Introduzione</A><BR> <A href="#sezione2">Background</A><BR> <A href="#sezione2.1">Note personali</A><BR> ...il resto del sommario... ...il corpo del documento... <H2 id="sezione1">Introduzione</H2> ...sezione 1... <H2 id="sezione2">Background</H2> ...sezione 2... <H3 id="sezione2.1">Note personali</H3> ...sezione 2.1...
Di gran lunga il più comune uso di un collegamento è recuperare un'altra risorsa del Web, come illustrato dai precedenti esempi. Tuttavia, gli autori possono inserire collegamenti nei loro documenti che esprimano altre relazioni tra risorse piuttosto che semplicemente "attivare questo collegamento per visitare quella risorsa correlata". I collegamenti che esprimono altri tipi di relazioni hanno uno o più tipi di collegamento specificati nelle proprie ancore sorgenti.
I ruoli di un collegamento definitoo dagli elementi A o LINK sono specificati mediante gli attributi rel e rev.
Per esempio, il collegamento definitoo con l'elemento LINK può descrivere la posizione del documento all'interno di una serie di documenti. Nel seguente brano, i collegamenti con il documento intitolato "Capitolo 5" puntano ai capitoli precedente e successivo:
<HEAD> ...altre informazioni della sezione HEAD... <TITLE>Capitolo 5</TITLE> <LINK rel="prev" href="capitolo4.html"> <LINK rel="next" href="capitolo6.html"> </HEAD>
Il tipo di collegamento del primo collegamento è "prev" e quello del secondo è "next" (due dei numerosi tipi di collegamento). I collegamenti specificati con LINK non sono presentati con il sommario del documento, sebbene l'interprete possa presentarli in altri modi (ad es., come strumenti di navigazione).
Anche se non vengono utilizzati per la navigazione, questi collegamenti possono essere interpretati in modi interessanti. Per esempio, un interprete che stampa una serie di documenti HTML come un singolo documento può utilizzare queste informazioni sui collegamenti come base per formare documenti lineari coerenti. Ulteriori informazioni inerenti l'uso dei collegamenti a beneficio dei motori di ricerca sono fornite di seguito.
Sebbene parecchi elementi e attributi creino collegamenti verso altre risorse (ad es., l'elemento IMG, l'elemento FORM, ecc.), questo capitolo tratta i collegamenti e le ancore creati tramite gli elementi LINK e A. L'elemento LINK può apparire solo nella sezione intestazione del documento. L'elemento A può apparire solo nel corpo del documento.
Quando l'attributo href dell'elemento A è impostato, l'elemento definisce l'ancora sorgente per il collegamento che può essere attivato dall'utente per recuperare una risorsa Web. L'ancora sorgente è la locazione dell'istanza A e l'ancora di destinazione è la risorsa Web.
La risorsa recuperata può essere gestita dall'interprete in vari modi: aprendo un nuovo documento HTML nella stessa finestra, aprendo un nuovo documento HTML in una finestra diversa, avviando un nuovo programma per la gestione della risorsa, ecc.. Dal momento che l'elemento A ha contenuto (testo, immagini, ecc.), l'interprete può presentare questo contenuto in modo tale da indicare la presenza di un collegamento (ad es., sottolineando il contenuto).
Quando gli attributi name o id dell'elemento A sono impostati, l'elemento definisce un'ancora che potrebbe essere la destinazione per altri collegamenti.
Gli autori possono impostare gli attributi name e href simultaneamente nella stessa istanza A.
L'elemento LINK definisce la relazione tra il documento corrente e un'altra risorsa. Anche se LINK non ha contenuto, le relazioni definitoe potrebbero essere presentate da alcuni interpreti.
L'attributo title può essere impostato per entrambi A e LINK per aggiungere informazioni sulla natura del collegamento. Questa informazione può essere pronunciata dall'interprete, presentata come estremo strumentale, causare un cambiamento nell'immagine del cursore, ecc..
Così, possiamo arricchire il precedente esempio fornendo un titolo ad ogni collegamento:
<BODY>
...altro testo...
<P>Troverai molto di più nel <A href="capitolo2.html"
title="Vai al Capitolo 2">capitolo due</A>.
<A href="./capitolo2.html"
title="Recupera il capitolo 2.">capitolo due</A>.
Vedere anche la <A href="../images/forest.gif"
title="Immagine GIF della foresta incantata">mappa della foresta incantata.</A>
</BODY>
Dal momento che i collegamenti possono puntare a documenti codificati con differenti codifiche dei caratteri, gli elementi A e LINK supportano l'attributo charset. Questo attributo permette agli autori di avvisare gli interpreti riguardo la codifica dei dati all'altra estremità del collegamento.
L'attributo hreflang fornisce agli interpreti informazioni inerenti il linguaggio della risorsa all'estremità del collegamento, giusto come l'attributo lang fornisce informazioni inerenti il linguaggio del contenuto di un elemento o del valore degli attributi.
Armati di queste nuove conoscenze, gli interpreti dovrebbero essere in grado di non presentare "immondizia" all'utente. Al contrario, essi possono localizzare le risorse necessarie per la corretta presentazione del documento o, se non possono localizzare la risorsa, dovrebbero almeno avvertire l'utente che il documento non può essere letto spiegandone il motivo.
<!ELEMENT A - - (%inline;)* -(A) -- ancora --> <!ATTLIST A %attrs; -- %coreattrs, %i18n, %events -- charset %Charset; #IMPLIED -- codifica dei caratteri della risorsa collegata -- type %ContentType; #IMPLIED -- tipo di contenuto -- name CDATA #IMPLIED -- denominazione dell'estremità finale del collegamento -- href %URI; #IMPLIED -- URI per la risorsa collegata -- hreflang %LanguageCode; #IMPLIED -- codice della lingua -- rel %LinkTypes; #IMPLIED -- tipi di collegamento successivo -- rev %LinkTypes; #IMPLIED -- tipi do collegamento precedente -- accesskey %Character; #IMPLIED -- carattere del tasto di scelta rapida -- shape %Shape; rect -- per l'uso con mappe sensibili dal lato cliente -- coords %Coords; #IMPLIED -- per l'uso con mappe sensibili dal lato cliente -- tabindex NUMBER #IMPLIED -- posizione nell'ordine di tabulazione -- onfocus %Script; #IMPLIED -- l'elemento ha ricevuto il focus -- onblur %Script; #IMPLIED -- l'elemento ha perso il focus -- >
Tag iniziale: richiesto, Tag finale: richiesto
Definizione degli attributi
Attributi definitoi altrove
Ogni elemento A definisce un'ancora
Gli autori possono anche creare un elemento A che non specifichi nessuna ancora, ovverosia, non deve specificare href, name, o id. Il valore per questi attributi può essere impostato successivamente per mezzo di scripts.
Nell'esempio che segue, l'elemento A definisce un collegamento. L'ancora sorgente è il testo "Sito Web del W3C" e quella di destinazione è "http://www.w3.org/":
Per maggiori informazioni inerenti il W3C, consultate il <A href="http://www.w3.org/">Sito Web del W3C</A>.
Questo collegamento designa la "Home Page" del "World Wide Web Consortium". Quando un utente attiva questo collegamento in un interprete, l'interprete recupererà la risorsa, in questo caso, un documento HTML.
Per maggiori informazioni inerenti il W3C, consultate il Sito Web del W3C.
~~~~~~~~~~~~~~~~
Per comunicare esplicitamente all'interprete quale sia la codifica dei caratteri della pagina di destinazione, impostare l'attributo charset:
Per maggiori informazioni inerenti il W3C, consultate il <A href="http://www.w3.org/" charset="ISO-8859-1">Sito Web del W3C</A>
Supponiamo di definire un'ancora denominata "ancora-uno" nel file "uno.html".
...testo precedente all'ancora... <A name="ancora-uno">Questa è la locazione della ancora uno.</A> ...testo successivo all'ancora...
Questo crea un'ancora intorno al testo "Questa è la locazione della ancora uno.". Di solito, il contenuto di A non viene presentato in nessun modo speciale quando A definisce solo un'ancora.
Avendo definitoo l'ancora, possiamo collegarci ad essa dal documento stesso o da un altro documento. Gli URI che designano le ancore contengono il carattere "#" seguito dal nome dell'ancora (l'identificatore di frammento). Qui troviamo alcuni esempi di tali URI:
Così, un collegamento definito nel file "due.html" nella stessa cartella di "uno.html" il riferimento all'ancora sarebbe il seguente:
...testo prima del collegamento... Per maggiori informazioni, si prega di consultare <A href="./uno.html#ancora-uno"> ancora uno</A>. ...testo dopo il collegamento...
L'elemento A nel seguente esempio specifica un collegamento (con href) e crea un nome d'ancora (con name) simultaneamente:
Sono appena rientrato dalle vacanze! Qui si trova la <A name="ancora-due" href="http://www.somecompany.com/People/Ian/vacation/family.png"> foto della mia famiglia al lago.</A>.
Questo esempio contiene un collegamento ad un tipo di risorsa Web differente (un'immagine PNG). L'attivazione del collegamento dovrebbe causare il recupero della risorsa dal Web (e possibilmente visualizzarla se il sistema è configurato per farlo).
Nota. Gli interpreti dovrebbero essere abilitati alla ricerca di ancore create da elementi A vuoti, ma alcuni falliscono nel fare questo. Per esempio, alcuni interpreti potrebbero non trovare la denominazione di ancora "empty-anchor" nel seguente frammento HTML:
<A name="empty-anchor"></A> <EM>...testo HTML...</EM> <A href="#empty-anchor">Collegamento ad un'ancora vuota</A>
Un nome di ancora è il valore dell'attributo name o dell'attributo id quando usati nel contesto delle ancore. I nomi di ancora devono osservare le seguenti regole:
Così, il seguente esempio è corretto nel rispetto dell'accoppiamento delle stringhe e deve essere considerato un accoppiamento eseguito dagli interpreti:
<P><A href="#xxx">...</A> ...seguito del documento... <P><A name="xxx">...</A>
ESEMPIO ILLEGALE:
Il seguente esempio è illegale rispetto all'unicità dal momento che i due nomi
sono uguali se non per il tipo di scrittura maiuscola/minuscola:
<P><A name="xxx">...</A> <P><A name="XXX">...</A>
Sebbene il seguente brano sia legale in HTML, il comportamento per l'interprete non è definito; alcuni interpreti potrebbero (non correttamente) considerare questo accoppiamento mentre altri interpreti potrebbero non farlo:
<P><A href="#xxx">...</A> ...seguito del documento... <P><A name="XXX">...</A>
I nomi di ancora dovrebbero essere ristretti ai soli caratteri ASCII. Si prega di consultare le appendici per ulteriori informazioni relative ai caratteri non ASCII nei valori degli attributi degli URI.
Collegamenti e ancore definiti dall'elemento A non devono essere annidati; un elemento A non deve contenere nessun altro elemento A.
Dal momento che la DTD definisce l'elemento LINK come vuoto, anche l'elemento LINK non può essere annidato.
L'attributo id può essere usato per creare un ancora al tag iniziale di qualsiasi elemento (incluso l'elemento A).
Questo esempio illustra l'uso dell'attributo id per posizionare un ancora in un elemento H2. L'ancora è collegata per mezzo dell'elemento A.
Potete leggere ulteriori informazioni a riguardo nella <A href="#section2">Sezione due </A>. ...più avanti nel documento <H2 id="section2">Sezione due</H2> ...più avanti nel documento <P>Si prega di riferirsi alla precedente <A href="#section2">sezione due</A> per ulteriori dettagli.
Il seguente esempio denomina l'ancora di destinazione mediante l'attributo id:
Sono appena rientrato dalle vacanze! Qui si trova la <A id="ancora-due">foto della mia famiglia al lago.</A>.
Gli attributi id e name condividono lo stesso spazio per il nome. Questo significa che non possono definire un'ancora con lo stesso nome nello stesso documento.
ESEMPIO ILLEGALE:
Il seguente brano è illegale in HTML dal momento che questi attributi
dichiarano lo stesso nome due volte nello stesso documento.
<A href="#a1">...</A> ... <H1 id="a1"> ...pagine e pagine... <A name="a1"></A>
A causa della sua specifica nella DTD HTML, l'attributo name può contenere riferimenti a caratteri. Così, il valore Dürst è valido valore per l'attributo name, come lo è Dürst . L'attributo id, invece, non può contenere riferimenti a caratteri.
Usare id o name? Gli autori dovrebbero considerare i seguenti aspetti quando decidono se usare id o name per i nomi delle ancore:
Un riferimento a una risorsa non disponibile o non identificabile è un errore. Sebbene possa variare il modo in cui gli interpreti gestiscono tale errore, noi raccomandiamo il seguente comportamento:
<!ELEMENT LINK - O EMPTY -- un collegamento indipendente dai media --> <!ATTLIST LINK %attrs; -- %coreattrs, %i18n, %events -- charset %Charset; #IMPLIED -- codifica dei caratteri della risorsa collegata -- href %URI; #IMPLIED -- URI per la risorsa collegata -- hreflang %LanguageCode; #IMPLIED -- codice della lingua -- type %ContentType; #IMPLIED -- Tipo di contenuto -- rel %LinkTypes; #IMPLIED -- Tipo di collegamento successivo -- rev %LinkTypes; #IMPLIED -- Tipo di collegamento precedente -- media %MediaDesc; #IMPLIED -- per la presentazione su questo media -- >
Tag iniziale: richiesto, Tag finale: proibito
Attributi definiti altrove
Questo elemento definisce un collegamento. A differenza di A, può apparire solamente nella sezione HEAD del documento, sebbene possa apparire un qualsiasi numero di volte. Sebbene LINK non abbia contenuto, esso convoglia informazioni di relazione che possono essere presentate dagli interpreti in vari modi (ad es., una barra degli strumenti con un menù a discesa di collegamenti).
Questo esempio illustra come diverse definizioni LINK possano apparire nella sezione HEAD del documento. Il documento corrente è "capitolo2.html". L'attributo rel specifica la relazione del documento collegato con quello corrente. I valori "Index", "Next", e "Prev" sono spiegati nella sezione relativa ai tipi di collegamento.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"> <HTML> <HEAD> <TITLE>Capitolo 2</TITLE> <LINK rel="Index" href="../indice.html"> <LINK rel="Next" href="capitolo3.html"> <LINK rel="Prev" href="capitolo1.html"> </HEAD> ...il resto del documento...
Gli attributi rel e rev giocano ruoli complementari -- l'attributo rel specifica un collegamento successivo e l'attributo rev specifica un collegamento precedente.
Consideriamo due documenti A e B.
Documento A: <LINK href="docB" rel="foo">
Ha esattamente lo stesso significato di:
Documento B: <LINK href="docA" rev="foo">
Entrambi gli attributi possono essere specificati simultaneamente.
Quando l'elemento LINK collega un foglio di stile esterno al documento, l'attributo type specifica il linguaggio del foglio di stile e l'attributo media specifica i medium o i media voluti per la presentazione. Gli interpreti possono risparmiare tempo recuperando dalla rete solo quei fogli di stile che si applicano al dispositivo corrente.
I tipi di media vengono ulteriormente discussi nella sezione sui fogli di stile..
Gli autori possono usare l'elemento LINK per fornire ai motori di ricerca una varietà di informazioni, inclusi:
Gli esempi qui di seguito illustrano come le informazioni sulla lingua, i tipi di media, e i tipi di collegamento possano essere combinati per migliorare la gestione dei documenti da parte dei motori di ricerca.
Nel seguente esempio, utilizziamo l'attributo hreflang per dire ai motori di ricerca dove trovare versioni in olandese, portoghese, e arabo di un documento. Si noti l'uso degli attributi dir e charset per il manuale in arabo, e l'uso dell'attributo lang per indicare che il valore dell'attributo title per l'elemento LINK che designa il manuale francese è in francese.
<HEAD>
<TITLE>Il manuale in inglese</TITLE>
<LINK title="Il manuale in olandese"
type="text/html"
rel="alternate"
hreflang="nl"
href="http://someplace.com/manual/dutch.html">
<LINK title="Il manuale in portoghese"
type="text/html"
rel="alternate"
hreflang="pt"
href="http://someplace.com/manual/portuguese.html">
<LINK title="Il manuale in arabo"
dir="rtl"
type="text/html"
rel="alternate"
charset="ISO-8859-6"
hreflang="ar"
href="http://someplace.com/manual/arabic.html">
<LINK lang="fr" title="La documentation en Français"
type="text/html"
rel="alternate"
hreflang="fr"
href="http://someplace.com/manual/french.html">
</HEAD>
Nel seguente esempio, diciamo ai motori di ricerca dove trovare la versione stampata di un manuale.
<HEAD>
<TITLE>Manuale di riferimento</TITLE>
<LINK media="print" title="Il manuale in postscript"
type="application/postscript"
rel="alternate"
href="http://someplace.com/manual/postscript.ps">
</HEAD>
Nel seguente esempio, diciamo ai motori di ricerca dove trovare il frontespizio di una raccolta di documenti.
<HEAD>
<TITLE>Manuale di riferimento -- Pagina 5</TITLE>
<LINK rel="Start" title="La prima pagina del manuale"
type="text/html"
href="http://someplace.com/manual/start.html">
</HEAD>
Ulteriori informazioni vengono date nelle note in appendice su aiutare i motori di ricerca nell'indicizzazione del vostro sito Web.
<!ELEMENT BASE - O EMPTY -- URI di base del documento --> <!ATTLIST BASE href %URI; #REQUIRED -- URI che agisce come URI di base -->
Tag iniziale: richieto, Tag finale: proibito
Definizioni degli attributi
Attributi definiti altrove
In HTML, collegamenti e riferimenti a immagini esterne, applet, programmi di elaborazione dei moduli, fogli di stile, ecc. sono sempre specificati da un URI. URI relativi sono risolti in accordo ad un URI di base, che può provenire da una varietà di fonti. L'elemento BASE permette agli autori di specificare esplicitamente un URI di base del documento.
Quando presente, l'elemento BASE deve apparire nella sezione HEAD del documento HTML, prima di ogni elemento che si riferisca a risorse esterne. Le informazioni di percorso specificate dall'elemento BASE influenzano solo gli URI del documento dove l'elemento appare.
Per esempio, date le seguenti dichiarazioni BASE e A :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"> <HTML> <HEAD> <TITLE>I nostri prodotti</TITLE> <BASE href="http://www.aviary.com/products/intro.html"> </HEAD> <BODY> <P>Avete visto le nostre <A href="../cages/birds.gif">gabbie per uccelli</A>? </BODY> </HTML>
L'URI relativo "../cages/birds.gif" viene risolto in:
http://www.aviary.com/cages/birds.gif
L'interprete deve calcolare l'URI di base per risolvere l'URI relativo in accordo con [RFC1808], sezione 3. Quanto segue descrive come [RFC1808] si applichi specificamente all'HTML.
Gli interpreti devono calcolare l'URI di base conformemente alle seguenti precedenze (in ordine decrescente di priorità):
Inoltre, gli elementi OBJECT e APPLET definiscono attributi che hanno la precedenza sul valore impostato dall'elemento BASE. Si consultino le definizioni di questi elementi per maggiori informazioni riguardo ad aspetti degli URI specifici ad essi.
Gli elementi di collegamento specificati dalle intestazioni HTTP sono gestiti esattamente come elementi LINK che compaiono esplicitamente in un documento.