--- title: slug: Web/HTML/Element/a tags: - Ancora - Collegamento - Elemento - HTML - Link - Web translation_of: Web/HTML/Element/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.

Attributi

Questo elemento include gli attributi globali.

{{htmlattrdef("charset")}} {{obsoleteGeneric("inline","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.

{{htmlattrdef("coords")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","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 {{htmlattrxref("shape", "a")}}.

Valore dell'attributo {{htmlattrxref("shape", "a")}}

 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.
{{htmlattrdef("datafld")}} {{Non-standard_inline}}
Questo attributo specifica il nome della colonna di tale oggetto origine dati che fornisce i dati associati.

Nota:

{{htmlattrdef("datasrc")}} {{Non-standard_inline}}
Questo attributo indica l'ID oggetto origine dei dati che fornisce i dati e che è legato a questo elemento.

Nota:

{{htmlattrdef("download")}} {{HTMLVersionInline(5)}}
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.
{{htmlattrdef("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 {{htmlattrxref("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.

{{htmlattrdef("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 {{htmlattrxref("href", "a")}}.
{{htmlattrdef("media")}} {{HTMLVersionInline(5)}}
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.
{{htmlattrdef("methods")}} {{Non-standard_inline}}
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)
{{htmlattrdef("name")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","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.

{{htmlattrdef("ping")}} {{HTMLVersionInline(5)}}
Se questo attributo è presente, viene mandata una notifica all'URL specificato quando l'utente segue il link.
{{htmlattrdef("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 {{htmlattrxref("href", "a")}}.
{{htmlattrdef("rev")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","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.
{{htmlattrdef("shape")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","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 {{htmlattrxref("coords", "a")}}.
{{htmlattrdef("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: Usare questo attributo solo se è presente anche l'attributo {{htmlattrxref("href", "a")}}.
{{htmlattrdef("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 http://www.w3.org/TR/html4/references.html#ref-MIMETYPES.
 
Usare questo attributo solo se è presente anche l'attributo {{htmlattrxref("href", "a")}}.
{{htmlattrdef("urn")}} {{Non-standard_inline}}
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="http://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 {{htmlattrxref("target", "a", "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

MDN

Spesso si creano collegamenti o pulsanti che aprono 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:nowhere@mozilla.org">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 {{HTMLElement("canvas")}} sotto forma di immagine, si può creare un link con l'attributo {{htmlattrxref("download", "a")}} 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

Specifica Stato Commento
{{SpecName('HTML WHATWG', 'text-level-semantics.html#the-a-element', '<a>')}} {{Spec2('HTML WHATWG')}}  
{{SpecName('HTML5 W3C', 'the-a-element.html#the-a-element', '<a>')}} {{Spec2('HTML5 W3C')}}  
{{SpecName('HTML4.01', 'struct/links.html#h-12.2', '<a>')}} {{Spec2('HTML4.01')}}  

Compatibilità dei Browser

{{CompatibilityTable}}

Funzionalità Chrome Firefox (Gecko) Internet Explorer Opera Safari
Supporto di base {{CompatVersionUnknown}} {{CompatGeckoDesktop("1.0")}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}
href="#top" {{CompatVersionUnknown}} {{CompatGeckoDesktop("10.0")}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}
{{htmlattrxref("download","a")}} 14 {{CompatGeckoDesktop("20.0")}} {{CompatNo}} 15 {{CompatNo}}
{{htmlattrxref("ping", "a")}} {{CompatVersionUnknown}} Disabilitato di default {{CompatNo}} {{CompatVersionUnknown}} {{CompatNo}}
Funzionalità Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Supporto di base {{CompatVersionUnknown}} {{CompatGeckoMobile("1.0")}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}
href="#top" {{CompatVersionUnknown}} {{CompatGeckoMobile("10.0")}} {{CompatVersionUnknown}} {{CompatVersionUnknown}} {{CompatVersionUnknown}}
{{htmlattrxref("download","a")}} {{CompatVersionUnknown}} {{CompatGeckoMobile("20.0")}} {{CompatNo}} {{CompatUnknown}} {{CompatUnknown}}
{{htmlattrxref("ping", "a")}}   Disabilitato di default      

 

Nota riguardo a Gecko

Click e focus

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

Cliccando su un {{HTMLElement("a")}} gli si assegna il focus?

Browser Desktop Windows 8.1 OS X 10.9
Firefox 30.0 Sì Sì
Chrome ≥39 (Chromium bug 388666) Sì Sì
Safari 7.0.5 N.a. Solo quando ha l'attributo {{htmlattrxref("tabindex")}}
Internet Explorer 11 Sì N.a.
Opera 12 Sì Sì

Toccando un {{HTMLElement("a")}} gli si assegna il focus?

Browser Mobili iOS 7.1.2 Android 4.4.4
Safari Mobile Solo quando ha l'attributo {{htmlattrxref("tabindex")}} N.a.
Chrome 35 ??? Solo quando ha l'attributo {{htmlattrxref("tabindex")}}

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 {{HTMLElement("a")}} sia usato con l'evento onclick. Per evitare che la pagina venga ricaricata, l'attributo {{htmlattrxref("href", "a")}} 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

{{HTMLRef}}