HTML/Links

I links o àncore sono l'elemento principale di un sito web. I link permettono di passare da un documento ad un altro in maniera molto semplice: cliccando su un collegamento ipertestuale. I link sono costituiti da due componenti: il contenuto e la risorsa.

Il contenuto può essere definito come la parola che risulta cliccabile o, come vedremo più avanti, un'immagine.
La risorsa è la pagina, il file, a cui punta l'url del contenuto.

Collegamenti esterni

Il tag da usare per i link è <a> ... </a> ma da solo non serve a nulla; è fondamentale l'attributo HREF (acronimo che sta per Hypertext REFerence) La sintassi per creare un collegamento ipertestuale è molto semplice ed è la seguente: <a href="qui va inserito l'url">e qui la parola che risulterà cliccabile</a>.

Ecco un esempio:

<body>
   <a href="http://it.wikibooks.org">Homepage di Wikibooks</a>
</body>

Segnalibri o etichette

I segnalibri o etichette sono collegamenti che non rimandano a una pagina esterna come abbiamo visto in precedenza, bensì a un contenuto disponibile nella stessa pagina. La loro sintassi è leggermente più complicata dei collegamenti esterni. Per prima cosa, si deve creare un collegamento simile a quello appena visto, ma solamente con l'attributo name, il quale farà sì che il collegamento non venga visto come un reale link ma, al contrario, come un'àncora che useremo per definire un collegamento a quel determinato testo della pagina.

Ecco l'esempio:

<body>
  <a href="#wiki">Vai al paragrafo su Wikibooks</a>
  <a name="wiki">Questo non è un link ma il testo a cui siamo stati rimandati</a>
</body>

Ricapitolando: per poter realizzare un collegamento interno bisogna eseguire le seguenti operazioni:

Definire l'àncora attraverso l'attributo name.
Richiamarla da un altro link inserendo come valore dell'attributo href il valore dell'attibuto name preceduto dal segno #.

È possibile anche creare in questo modo link vuoti richiamando un'àncora senza valore (ad esempio per creare un link in fondo alla pagina che vi faccia tornare automaticamente all'inizio della stessa) in questo modo:

<body>
  <a href="#">Questo link è vuoto</a>
</body>

Posta elettronica

Attraverso un link è possibile anche far aprire il client di posta dell'utente affinché questo possa inviare una e-mail con il campo A: precompilato. Ovviamente l'indirizzo di posta elettronica che comparirà in tale campo sarà quello che andremo a specificare nel codice HTML. Ecco la sintassi: <a href="mailto:indirizzo mail">Parola da visualizzare</a>

ed ecco un esempio pratico:

<body>
   <a href="mailto:prova@prova.it">Inviami una e-mail!</a>
</body>

Volendo è possibile stabilire anche l'oggetto e il testo del messaggio di posta. Sarà sufficiente seguire quest'altro esempio:

<body>
   <a href="mailto:prova@prova.it?subject=Oggetto&body=Corpo del Messaggio">Prova ad inviarmi una e-mail da qui</a>
</body>

Attributi dei link

Di seguito trovate una tabella riassuntiva degli attributi associabili al tag <a>

Attributo	Valori	Significato
`target`	Qualsiasi parola/codice riservato	Specifica dove visualizzare la risorsa del link. Può essere uno dei seguenti: il nome assegnato ad un frame (vedi capitolo sui Frames), il codice riservato _self che si riferisce allo stesso frame in cui è contenuto il link, il codice riservato _parent che si riferisce al frameset genitore, il codice riservato _top per aprirlo nella pagina originale, senza frame il codice riservato _blank per aprirlo in una nuova finestra del browser
`title`	Qualsiasi lettera/parola	Il valore di questo attributo sarà mostrato quando il cursore si fermerà sopra il link. Utile per offrire informazioni aggiuntive sul link.
`accesskey`	Una singola lettera	Determina le scorciatoie da tastiera. La combinazione di tasti da premere dipende dal browser. Usando la famiglia Mozilla/Firefox bisogna premere ALT+SHIFT+valore, con Internet Explorer diventa, ALT+valore, mentre col Mac CTRL+valore. Gli altri browser utilizzeranno, solitamente, una di queste soluzioni.
`hreflang`	Diversi valori, ad es.: ita, eng, ecc.	Indica la lingua del documento, utile se si ha un sito multilingua. Facilita anche l'indicizzazione da parte dei motori di ricerca.

I seguenti attributi possono essere specificati nel tag <body> della pagina e permettono di personalizzare il colore dei link nella pagina. Il loro uso è però sconsigliato in favore dei CSS

Attributo	Valori	Significato
`link`	Qualsiasi colore	Definisce il colore di tutti i link presenti nella pagina; il tipo di colore può essere specificato sia col nome inglese, sia col relativo codice esadecimale.
`alink`	Qualsiasi colore	Definisce il colore dei link attivi (si intendono attivi i collegamenti al momento del click); come il precedente, può essere espresso sia col nome in inglese che col relativo valore esadecimale.
`vlink`	Qualsiasi colore	Definisce il colore dei link già visitati dall'utente; può essere espresso anche qui sia col nome in inglese che tramite valore esadecimale.