<a>

Sommario

L' elemento HTML <a> (o l' elemento Ancora HTML) definisce un collegamento ipertestuale, il nome dell' obbiettivo di destinazione per un collegamento ipertestuale, o entrambi.

• Aree tematiche Contenuti del flusso, contenuto delle espressioni, contenuto interattivo, contenuto tangibile.
• Contenuto consentito Trasparente, contenente sia contenuti del flusso sia contenuto delle espressioni.
• Omissione TagNessuno, sia il tag di apertura, sia quello di chiusura sono obbligatori.
• Elementi padre consentiti qualsiasi elemento che accetta contenuto delle espressioni, o qualsiasi elemento che accetta contenuto del flusso.
• Interfaccia DOM HTMLAnchorElement

Attributi

Questo elemento include gli attributi globali.

charset Obsolete since HTML5

Questi attributi definiscono la codifica dei caratteri della risorsa linkata. Il valore è una lista di caratteri delimitata da spazi- e/o virgole - fissa come definito in RFC 2045. Il valore di default è ISO-8859-1.

Nota: Questo attributo è obsoleto in HTML5 e non dovrebbe essere usato. Per ottenere un effetto simile, usare l'header HTTP Content-Type sulla risorsa linkata.

coords HTML 4 only, Obsolete since HTML5

Per l' uso con le forme degli oggetti, questo attibuto usa una lista di numeri separata da virgole per definire le coordinate dell'oggetto nella pagina. Il valore di questo attributo dipende dal valore dell'attributo shape.

Valore dell'attributo shape	Formato delle coordinate	Significato
circle	x,y,z	x e y indicano le coordinate (in pixel) del centro della circonferenza; z indica la lunghezza del raggio.
rect	x,y,w,h	x e y indicano le coordinate dell'angolo superiore sinistro del rettangolo; w e h indicano rispettivamente la larghezza e l'altezza del rettangolo.
polygon	x1,y1,x2,y2,...	Ogni coppia di coordinate x,y definisce un punto del poligono; due punti consecutivi (o l'ultimo e il primo) vengono uniti da una linea.

datafld

Questo attributo specifica il nome della colonna di tale oggetto origine dati che fornisce i dati associati.

Nota:

• Questo attributo è non-standard and non dovrebbe essere usato. Per ottenere un effetto simile, utilizzare un meccanismo come XMLHttpRequest per popolare dinamicamente la pagina.
• Questo attributo è implementato solo in Internet Explorer 4, 5, 6 e 7. (Microsoft's Data Binding: dataFld Property (MSDN))

datasrc

Questo attributo indica l'ID oggetto origine dei dati che fornisce i dati e che è legato a questo elemento.

Nota:

• Questo attributo è non-standard and non dovrebbe essere usato. Per ottenere un effetto simile, utilizzare un meccanismo come XMLHttpRequest per popolare dinamicamente la pagina.
• Questo attributo è implementato solo in Internet Explorer 4, 5, 6 e 7. (Microsoft's Data Binding: dataSrc Property (MSDN))

download HTML5

Questo attributo, se presente, indica che l' autore intende che il collegamento ipertestuale debba essere usato per scaricare una risorsa. Se l' attributo ha un valore, il browser dovrebbe interpretarlo come il nome del file da salvare in un file system locale. Non ci sono restrizioni sui valori consentiti, ma dovresti considerare che la maggior parte dei file system hanno delle limitazioni per quanto riguarda quale punteggiatura è supportata nei nomi del file, ed i browser sono predisposti ad aggiustare il nome del file di conseguenza.

Nota:

• Può essere usato con URL blob: e data:, così da poter scaricare contenuti generati usando JavaScript (ad esempio un'immagine creata in un applicazione di disegno).
• Se è presente l'header HTTP Content-Disposition e propone un diverso nome per il file, l'header ha la priorità su questo attributo.
• Se l'header HTTP Content-Disposition ha valore inline, in Firefox l'header ha la precedenza, mentre in Chrome l'attributo download.
• In Firefox 20 questo attributo è rispettato solo per link a risorse provenienti dalla stessa origine.

href

Questo è l'unico attributo richiesto per ancore che definiscono un collegamento ipertestuale. Esso indica il link obbiettivo, sia esso un URL o un frammento di URL. Un frammento di URL è un nome (un id) preceduto da un cancelletto (#), che specifica la posizione dell'obbiettivo nel documento corrente. Gli URL non sono limitati ai documenti web basati sul protocollo HTTP: possono essere usati con altri protocolli supportati dal browser, come file, ftp, e mailto.

Nota: Puoi usare il frammento apposito "top" per creare un collegamento per tornare in cima alla pagina; ad esempio <a href="#top">Torna all'inizio</a>. Questo comportamento è specificato in HTML5.

hreflang

Questo attributo indica la lingua della risorsa linkata. È puramente informativo. I valori permessi sono determinati dallo standard BCP47 per l'HTML5 e dallo standard RFC1766 per l'HTML4. Usa questo attributo solo se è presente anche l' attributo href.

media HTML5

Questo attributo specifica in quali dispositivi utilizzare il link. Il suo valore deve essere una media query. Questo attributo è utile principalmente quando vi è un collegamento ad un foglio di stile esterno che consente allo user agent di scegliere il più adatto per il dispositivo in uso.

Nota:

• In HTML 4 sono accettate solo descrizioni letterali (separate da uno spazio) del supporto, vale a dire media types and groups: print, screen, aural, braille, ... HTML 5 estende questo ad ogni tipo di media query, ossia un'estensione dei valori consentiti in HTML 4.
• I browser che non supportano le Media Queries CSS3 potrebbero non riconoscere il collegamento adeguato; non dimenticare di impostare collegamenti alternativi, usando l'insieme ristretto di media queries definite in HTML 4.

methods

Il valore di questo attributo fornisce informazioni sulle funzioni che possono essere eseguite su un oggetto. I valori generalmente sono dati dal protocollo HTTP quando viene utilizzato, ma potrebbe (per ragioni simili a quelle per l'attributo title) essere utile includere informazioni consultive in anticipo nel collegamento. Ad esempio, il browser potrebbe scegliere un rendering diverso di un collegamento in funzione dei metodi specificati, qualcosa che è ricercabile potrebbe avere un'icona diversa, o un link esterno potrebbe essere intrerpretato con l'indicazione di lasciare il sito corrente. Questo attributo non è ben compreso o supportato neanche dal browser che lo ha definito, Internet Explorer 4. Methods Property (MSDN)

name HTML 4 only, Obsolete since HTML5

Questo attributo è richiesto in un ancora che definisce una destinazione all'interno di una pagina. Il valore per il name è simile al valore per l' attributo id e deve essere un identificatore alfanumerico e univoco nel documento. Secondo la specifica specifiche HTML 4.01, l' id e il name possono entrambi essere applicati all'elemento <a>, finchè hanno lo stesso valore.

Nota: Questo attributo è obsoleto in HTML5, usare l' attributo globale id.

ping HTML5

Se questo attributo è presente, viene mandata una notifica all'URL specificato quando l'utente segue il link.

rel

Questo attributo specifica la relazione tra l'oggetto di destinazione e il collegamento stesso. Il suo valore è una lista di tipi di link separati da spazi. La relazione predefinita è void, ossia nessuna.

Usare questo attributo solo se è presente anche l'attributo href.

rev HTML 4 only, Obsolete since HTML5

Questo attributo specifica un collegamento inverso, la relazione inversa dell' attributo rel. È utile per indicare l'origine un oggetto, ad esempio il suo autore.

shape HTML 4 only, Obsolete since HTML5

Questo attributo è utilizzato per definire una regione selezionabile per un collegamento ipertestuale associata con una figura per creare una mappa immagine. I valori per l' attributo sono circle (cerchio), default (l'intera area a disposizione) polygon (poligono) e rect (rettangolo). Le coordinate della mappa sono definite dall'attributo coords.

target

Questo attributo specifica dove deve essere visualizzata la risorsa linkata. In HTML4, questo è il nome, o una parola chiave, per una cornice (frame). In HTML5, è il nome, o parola chiave, di un contesto di navigazione (browsing context) (per esempio un'ettichetta, una finestra o un frame in linea). Le seguenti parole chiave hanno uno speciale significato:

• _self: Carica il documento nello stesso frame. Questo è il valore predefinito.
• _blank: Carica il documento in una nuova finestra.
• _parent: Carica il documento nel frameset genitore del frame corrente. Se non c'è il genitore, questa opzione si comporta allo stesso modo di _self.
• _top: Carica il documento dentro la finestra originale completa (la scheda del browser), cancellando gli altri frame. Se non c'è il genitore, questa opzione si comporta allo stesso modo di _self.

Usare questo attributo solo se è presente anche l'attributo href.

type

Questo attributo specifica il tipo della risorsa linkata, sotto forma di tipo MIME. Solitamente è fornito solo come informazione secondaria, ma in futuro i browser potrebbero aggiungere un'icona che identifichi i tipi di file (ad esempio un piccolo altoparlante quando il tipo è audio/wav). Per una lista completa dei tipi MIME supportati, vedere https://www.w3.org/TR/html4/references.html#ref-MIMETYPES.

 

Usare questo attributo solo se è presente anche l'attributo href.

urn

Questo attributo presumibilmente supportato da Microsoft riferisce un nome uniforme di risorsa (uniform resource name (URN)) con il collegamento. Mentre era basato su lavori standard anni addietro, il significato di URN non è più ben definito, quindi questo attributo è insignificante. urn Property (MSDN)

Esempi

Collegamento ad un file esterno

<a href="https://www.mozilla.com/">Link esterno</a>

Risultato

Link esterno

Creare un'immagine cliccabile

Questo link aprirà la pagina https://developer.mozilla.org/ in una nuova finestra, per via dell'attributo target="_blank".

<a href="https://developer.mozilla.org/" target"_blank">
  <img src="https://mdn.mozillademos.org/files/6851/mdn_logo.png" alt="MDN">
</a>

Risultato

Creare un link ad un'email

Spesso si creano collegamenti o pulsanti che aprano il programma di email dell'utente. Per questo si usano i link mailto.

Per altri dettagli riguardanti  lo schema URL mailto, come ad esempio includere l'oggetto, del testo o altro contenuto, vedere i link Email o lo standard RFC 6068.

<a href="mailto:[email protected]">Invia un'email a nowhere</a>

Risultato

Invia un'email a nowhere

Usare l'attributo download per scaricare un <canvas> come PNG.

Se si vuole permettere all'utente di scaricare un elemento <canvas> sotto forma di immagine, si può creare un link con l'attributo download e il contenuto del <canvas> come URL del file:

<!-- HTML -->
<canvas id="my-canvas"></canvas>
<a id="download-image" download="disegno.png">Scarica l'immagine</a>

// JavaScript
var link = document.querySelector("#download-image");
var canvas = document.querySelector("#my-canvas");
link.addEventListener("click"; function () {
  link.href = canvas.toDataURL();
}, false);

Specifiche

Compatibilità dei Browser

Nota riguardo a Gecko

• A partire da Gecko 41 (Firefox 41.0, Thunderbird 41.0, SeaMonkey 2.38), un elemento <a> senza l'attributo href non è classificato come contenuto interattivo. Cliccando su di esso dentro un <label> viene attivato il contenuto etichettato (bug 1167816).

Click e focus

Un link ottiene il focus quando vi si clicca sopra in vari browser (come comportamento predefinito).

Cliccando su un <a> gli si assegna il focus?

Toccando un <a> gli si assegna il focus?

Note

Le seguenti sono chiavi di associazione riservate per due dei maggiori browser e non devono essere usate come valori di accesso: a, c, e, f, g, h, v, freccia sinistra e freccia destra.

L' HTML 3.2 definisce solo gli attributi name, href, rel, rev, e title.

L' attributo target non è definito nei browser che non supportano i frame, come Netscape 1. Inoltre, target non è consentito se si utilizza la variante rigorosa (strict) dell'XHTML, ma è limitata al frameset o alla forma "di transizione" (transitional).

Raccomandazioni JavaScript

Succede spesso che un tag <a> sia usato con l'evento onclick. Per evitare che la pagina venga ricaricata, l'attributo href viene spesso impostato a "#" o a "javascript:void(0)". Entrambi questi valori possono portare ad errori inaspettati quando si copiano e aprono link in una nuova scheda e/o finestra. Bisogna essere consapevoli di questo per ragioni di usabilità, e quando gli utenti usano il tag di ancoraggio, bisogna cercare di prevenire i comportamenti di default.

Vedi anche

• Altri elementi di espressione text-level semantics: <abbr>, <em>, <strong>, <small>, <cite>, <q>, <dfn>, <time>, <code>, <var>, <samp>, <kbd>, <sub>, <sup>, <b>, <i>, <mark>, <ruby>, <rp>, <rt>, <bdo>, <span>, <br>, <wbr>.