Descrizione | identifica collegamento (link) fra la pagina corrente e altre pagine |
Tipo | elemento contenitore inline |
Attributi | href, target |
L'elemento <a> (anchor) consente di collegare fra loro diverse pagine html, creando in tal modo una struttura ipertestuale. Il collegamento viene applicato a una porzione di testo, che diviene in tal modo "cliccabile". Per esempio
viene visualizzato dal browser nel seguente modo:
Pagina principale di Programmiamo
Facendo clic col mouse sul testo sottolineato e in colore blu, viene aperta la pagina indicata nell'attributo href.
Il link può essere anche fatto su un'immagine (in questo caso cliccando sull'immagine si viene indirizzati alla pagina). Esempio:
<a href="index.html"><img src="foto.jpg" width="640" height="467" border="0"></a>
L'attributo border="0" serve per evitare che venga messo un bordo intorno all'immagine linkata.
ATTENZIONE: essendo un elemento inline, il tag <a> deve sempre essere racchiuso all'interno di un elemento di blocco (come <p> o <div>) e non deve mai essere scritto direttamente nel body.
L'attributo href (hypertext reference o riferimento ipertestuale) specifica l'indirizzo della pagina destinazione e deve essere indicato obbligatoriamente. L'indirizzo può essere costituito da un URL, cioè da un indirizzo internet completo, come nel caso considerato prima:
Se però la pagina linkata si trova nella stessa cartella in cui è situata la pagina html che contiene il link, è sufficiente indicare semplicemente il nome del file:
Questo modo di fornire l'indirizzo si dice relativo (in contrapposizione al precedente, che viene detto assoluto). In generale è preferibile usare indirizzi relativi. Se la pagina linkata si trova in una cartella diversa rispetto a quella della pagina corrente, si usa il simbolo di .. (doppio punto) per indicare la cartella parent (cioè "genitore") di quella corrente, cioè la cartella che contiene la cartella corrente. Si considerino gli esempi seguenti:
esempio indirizzo relativo | nota |
---|---|
href="pagina.html" | "pagina.html" si trova nella cartella corrente. |
href="schede/pagina.htm" | "pagina.html" si trova nella cartella 'schede' che è una sottocartella della cartella corrente. |
href="../schede/pagina.html" | "pagina.html" si trova nella cartella 'schede' che a sua volta si trova nella cartella di livello superiore (parent) della cartella corrente |
href="../../schede/pagina.html" | "pagina.html" si trova nella cartella schede, la quale a sua volta si trova "due livelli sopra" alla cartella corrente |
L'attributo target permette di specificare in quale finestra la pagina linkata deve essere aperta: di default infatti la pagina viene aperta all'interno del documento stesso, ma è possibile specificare che la pagina sia aperta in una nuova finestra indicando target="_blank":
Purtroppo l'uso di questo attributo (utile in molti casi) è deprecato in HTML 5 e produce errori di validazione. Per sostituirlo mantenendo la correttezza del codice, occorre usare un semplice codice javascript, come nell'esempio qui sotto:
Per maggiori dettagli sull'uso di onclick vedi la sezione dedicata al linguaggio javascript.
Un segnalibro (in inglese bookmark) è un riferimento interno a una pagina sul quale è possibile indirizzare un link. Per creare un segnalibro in qualsiasi punto di una pagina, si usa l'attributo id sull'elemento destinazione del segnalibro, come mostra l'esempio seguente:
L'attributo id è un attributo universale, che cioè può essere applicato a qualsiasi elemento del body di una pagina (es. a un paragrafo, a un header, a una immagine).
Il suo scopo, come si è detto, è quello di creare un segnalibro, cioè un punto di riferimento per un altro link. Se per esempio, in un altro punto della pagina, vogliamo richiamare il segnalibro precedente, dovremo scrivere:
Questo link viene visualizzato con la normale sottolineatura e, cliccandoci sopra, si viene indirizzati al punto nella pagina dove abbiamo messo il segnalibro. Si noti il cancelletto # davanti al nome del segnalibro.
L'uso di segnalibri è particolarmente utile nel caso di pagine lunghe, contenenti molti argomenti. In questi casi è consigliato mettere all'inizio della pagina un menu (per esempio una lista) con una serie di link interni che permettono di "saltare" direttamente ai diversi segnalibri.
Notiamo che è possibile linkare un segnalibro anche da un'altra pagina (diversa da quella che lo contiene). In questo caso bisogna premettere il nome (o il percorso) della pagina linkata, come nell'esempio qui sotto:
Vale la pena infine di notare che talvolta si incontrano pagine contenenti riferimenti vuoti, come in questo esempio:
Cliccando sul link, si viene reindirizzati all'inizio della pagina stessa.
Sito realizzato in base al template offerto da
http://www.graphixmania.it