Tag HTML <address>
Il tag HTML <address> fornisce le informazioni di contatto dell'autore o del proprietario di un sito o di un articolo.
Il tag <address> fornisce le informazioni di contatto per l'autore o il proprietario di un documento o di un articolo. Può contenere un indirizzo email, un numero di telefono, un indirizzo fisico, un collegamento al sito dell'autore, handle sui social media e così via.
Questa pagina spiega cosa significa realmente <address> dal punto di vista semantico, dove posizionarlo, gli errori comuni da evitare e come combinarlo con <footer>.
Cosa significa davvero <address>
La cosa più importante da capire è che <address> non è un contenitore generico per qualsiasi indirizzo postale. Esso contrassegna specificamente i dettagli di contatto per:
- l'antenato più vicino
<article>— ovvero l'autore di quell' articolo, oppure - il documento nel suo insieme, quando l'antenato più vicino è l'elemento
<body>— ovvero il proprietario della pagina.
Quindi la portata di un blocco <address> dipende da dove viene inserito:
- All'interno di
<body>(di solito nel<footer>della pagina) → si riferisce all'autore o al proprietario dell'intero documento. - All'interno di un
<article>→ si riferisce all'autore di quell'articolo.
Non usare <address> per un indirizzo postale generico che è semplicemente parte del contenuto della pagina — ad esempio un indirizzo di posta in un post di blog, la posizione di un luogo in una pagina di eventi, o l'indirizzo di un negozio nella descrizione di un prodotto. Questi non sono dati di contatto dell'autore o del proprietario del documento, quindi dovrebbero essere testo semplice (o racchiusi in un <p>). Un uso improprio di <address> fa sì che il markup comunichi qualcosa di falso alle tecnologie assistive e ai motori di ricerca.
Sintassi
Il tag <address> va in coppia. Il contenuto si inserisce tra il tag di apertura (<address>) e quello di chiusura (</address>).
La maggior parte dei browser aggiunge un'interruzione di riga prima e dopo l'elemento e renderizza il testo in corsivo. È possibile sovrascrivere questo stile con CSS.
Si noti che <address> non deve contenere intestazioni (<h1>–<h6>), elementi di sezionamento come <article> o <section>, né altri elementi <address>, <header> o <footer>.
Informazioni di contatto a livello di documento
Quando le informazioni di contatto si applicano all'intera pagina, inserire <address> all'interno di <body> — tipicamente nel footer della pagina:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<address>
Author: W3docs team<br />
<a href="mailto:[email protected]">Contact Author</a>
</address>
</body>
</html>Autore di un articolo
Per contrassegnare i dettagli di contatto dell'autore di un singolo articolo, inserire <address> all'interno dell'elemento <article> di quell'articolo (di solito nel <footer> dell'articolo). Questo è l'uso canonico e semanticamente corretto del tag:
<!DOCTYPE html>
<html>
<head>
<title>Article author</title>
</head>
<body>
<article>
<h2>Understanding Semantic HTML</h2>
<p>Semantic elements describe their meaning to both the browser and the developer...</p>
<footer>
<p>Posted on June 17, 2026.</p>
<address>
Written by Jane Doe.<br />
Contact: <a href="mailto:[email protected]">[email protected]</a><br />
<a href="https://example.com/jane">example.com/jane</a>
</address>
</footer>
</article>
</body>
</html>Uso di <address> nel footer della pagina
Quando i dettagli dell'autore/proprietario appartengono all'intero sito, è possibile includere <address> insieme ad altre informazioni all'interno del <footer> della pagina. In questo caso l'indirizzo è informazione di contatto per il proprietario del sito — che è esattamente lo scopo di <address>. Un semplice indirizzo postale aziendale senza contesto di autore o proprietario non apparterrebbe a <address>:
<!DOCTYPE html>
<html>
<head>
<style>
.header{
height: 40px;
padding: 20px 20px 0;
background: #e1e1e1;
}
.main-content{
height: 60vh;
padding: 20px;
}
footer{
padding: 10px 20px;
background: #666666;
color: white;
}
a{
color: #00aaff;
}
</style>
</head>
<body>
<div class="header">Header / Menu</div>
<div class="main-content">
<h1>Main content</h1>
<p>This is some paragraph. </p>
</div>
<footer style="display:flex; justify-content:space-between; align-items:flex-end;">
<p style="margin:0;">Company © W3docs. All rights reserved.</p>
<address>
Contact us: <a href="mailto:[email protected]">[email protected]</a>
</address>
</footer>
</body>
</html>Attributi
Il tag <address> non ha attributi specifici. Supporta solo gli Attributi Globali e gli Attributi degli eventi.