HTML Uniform Resource Locator
Un Uniform Resource Locator (URL) è un riferimento a una risorsa web. Scopri la sintassi degli URL, le differenze tra assoluti e relativi e la codifica.
Un Uniform Resource Locator (URL), comunemente chiamato indirizzo web, è un riferimento a una risorsa web che ne specifica la posizione nella rete informatica e il meccanismo per recuperarla. Un URL è un tipo speciale di Uniform Resource Identifier (URI), sebbene i due termini vengano talvolta usati in modo intercambiabile. Nella maggior parte dei browser web, l'URL di una pagina viene visualizzato sopra la pagina stessa nella barra degli indirizzi.
Un URL può essere composto da parole o da un indirizzo IP (Internet Protocol). In genere gli utenti digitano il nome perché è più facile da ricordare rispetto ai numeri.
Questa pagina spiega l'anatomia di un URL, come si comportano gli URL assoluti e relativi negli attributi HTML, come funzionano le parti query e frammento, la codifica degli URL e gli schemi che incontrerai più spesso.
Sintassi degli URL
La sintassi generale di un indirizzo web completo è:
scheme://host:port/path?query#fragmentAnatomia di un URL
Secondo RFC 3986 — la specifica che definisce gli URL — un URL è composto dai componenti seguenti. Non esiste un componente separato per il "nome del file": il nome del file è semplicemente l'ultimo segmento del percorso (path).
| Componente | Cosa specifica |
|---|---|
| scheme | Il protocollo o tipo di servizio da utilizzare, come http, https o mailto. |
| host | Il nome di dominio (ad esempio www.w3docs.com) o l'indirizzo IP del server. |
| port | Il numero di porta sull'host. È opzionale; 80 è il valore predefinito per http e 443 per https. |
| path | La posizione della risorsa sul server, incluse eventuali cartelle e il nome del file. Se omesso, viene utilizzata la radice del server (/). |
| query | Parametri opzionali passati alla risorsa, scritti come coppie key=value. |
| fragment | Un identificatore opzionale (ancora) che punta a una parte specifica della risorsa. |
Un URL completo, scomposto
Considera questo indirizzo:
https://www.w3docs.com:443/learn-html/page.html?tab=1#introÈ composto dalle seguenti parti:
| Parte | Valore | Significato |
|---|---|---|
| scheme | https | Usa il protocollo HTTP sicuro. |
| host | www.w3docs.com | Il server da contattare. |
| port | 443 | La porta sul server (443 è il valore predefinito per https, quindi di solito viene omessa). |
| path | /learn-html/page.html | La cartella e il file da richiedere. |
| query | tab=1 | Un parametro inviato alla risorsa. |
| fragment | intro | Scorrere fino all'elemento con id="intro" dopo il caricamento della pagina. |
URL Assoluti e Relativi
In HTML, un URL può essere scritto per intero (assoluto) oppure in forma parziale (relativo). Per un URL relativo, il browser integra le parti mancanti — schema, host e directory di base — dall'URL della pagina corrente.
Questo è rilevante ovunque si faccia riferimento a un'altra risorsa: nei link <a href>, nelle immagini <img src> e nei fogli di stile <link href>.
Supponiamo che la pagina corrente sia https://example.com/learn-html/page.html:
| Nel documento | Si risolve in | Tipo |
|---|---|---|
href="https://example.com/page" | https://example.com/page | Assoluto |
href="/path/page" | https://example.com/path/page | Relativo alla radice (parte dalla radice dell'host) |
href="../sibling" | https://example.com/sibling | Relativo (sale di una cartella) |
href="page2.html" | https://example.com/learn-html/page2.html | Relativo (stessa cartella) |
<!-- Absolute URL: includes the scheme and host -->
<a href="https://example.com/page">External page</a>
<!-- Root-relative: starts at the site root -->
<img src="/images/logo.png" alt="Logo" />
<!-- Relative: relative to the current page's folder -->
<link rel="stylesheet" href="../css/style.css" />Usa gli URL relativi per i collegamenti interni al proprio sito (continuano a funzionare anche se il sito viene spostato su un nuovo dominio) e gli URL assoluti per puntare a risorse esterne. Consulta HTML Links per ulteriori informazioni sui collegamenti.
Il Componente Query
La stringa di query viene inserita dopo un ? e trasporta dati alla risorsa come coppie key=value. Più parametri vengono uniti con &:
https://www.w3docs.com/search?q=html&page=2Qui q=html e page=2 sono due parametri separati. I server (e JavaScript) leggono questi valori per decidere cosa restituire — ad esempio, un termine di ricerca e un numero di pagina.
Il Frammento (Ancora)
Il frammento viene inserito dopo un # e punta a una parte specifica di una pagina. Il browser scorre fino all'elemento il cui id corrisponde al frammento. Viene gestito interamente nel browser e non viene mai inviato al server.
<!-- Links to the element with id="section2" on the same page -->
<a href="#section2">Jump to Section 2</a>
<h2 id="section2">Section 2</h2>Codifica degli URL
Gli URL possono essere trasmessi su Internet solo utilizzando il set di caratteri ASCII. Se un URL contiene caratteri al di fuori di tale set — o caratteri che hanno un significato speciale in un URL — quei caratteri devono essere codificati.
Nella codifica degli URL (detta anche codifica percentuale) un carattere viene sostituito con un % seguito dal suo valore esadecimale a due cifre. Gli URL non possono contenere spazi, quindi uno spazio diventa %20 (oppure, nelle stringhe di query, un segno +):
Before: https://www.w3docs.com/search?q=hello world
After: https://www.w3docs.com/search?q=hello%20worldI caratteri riservati come ?, &, =, # e / hanno un significato strutturale in un URL, quindi quando compaiono all'interno di un valore devono essere codificati in percentuale (ad esempio & diventa %26). Alcune sostituzioni comuni:
| Carattere | Codificato |
|---|---|
| spazio | %20 |
& | %26 |
# | %23 |
? | %3F |
= | %3D |
Schemi Comuni
Lo schema indica al browser quale protocollo o servizio utilizzare. I più comuni sono elencati di seguito.
| Schema | Utilizzato per |
|---|---|
http | Pagine web comuni (non cifrate). |
https | Pagine web sicure (cifrate). Lo standard per il web moderno. |
mailto: | Apre il client di posta elettronica dell'utente, es. mailto:[email protected]. |
tel: | Avvia una telefonata sui dispositivi supportati, es. tel:+15551234567. |
data: | Incorpora piccole risorse inline, es. un'immagine in base64. |
ftp | Download o upload di file. |
file | Un file sul computer locale. |
<a href="mailto:[email protected]">Email us</a>
<a href="tel:+15551234567">Call us</a>Per ragioni di sicurezza i browser moderni limitano gli schemi ftp: e file:: il supporto a ftp: è stato rimosso dalla maggior parte dei browser, e i link file: a file locali in genere non funzionano da una pagina servita tramite http/https.