La balise HTML <address>
La balise HTML <address> fournit les coordonnées de l'auteur ou du propriétaire d'un document ou d'un article.
La balise <address> fournit les coordonnées de l'auteur ou du propriétaire d'un document ou d'un article. Elle peut contenir une adresse e-mail, un numéro de téléphone, une adresse postale, un lien vers le site de l'auteur, des identifiants sur les réseaux sociaux, et ainsi de suite.
Cette page explique ce que <address> signifie vraiment sur le plan sémantique, où la placer, l'erreur courante à éviter et comment la combiner avec <footer>.
Ce que <address> signifie réellement
La chose la plus importante à comprendre est que <address> n'est pas un conteneur générique pour toute adresse postale. Elle balise spécifiquement les coordonnées de :
- l'ancêtre
<article>le plus proche — c'est-à-dire l'auteur de cet article, ou - l'ensemble du document, lorsque son ancêtre le plus proche est l'élément
<body>— c'est-à-dire le propriétaire de la page.
La portée d'un bloc <address> dépend donc de l'endroit où vous le placez :
- À l'intérieur de
<body>(généralement dans le<footer>de la page) → il fait référence à l'auteur ou au propriétaire de l'ensemble du document. - À l'intérieur d'un
<article>→ il fait référence à l'auteur de cet article.
N'utilisez pas <address> pour une adresse postale quelconque faisant simplement partie du contenu de la page — par exemple une adresse courrier dans un article de blog, l'emplacement d'un lieu sur une page d'événements, ou l'adresse d'un magasin dans une description de produit. Il ne s'agit pas de coordonnées pour l'auteur du document ou de l'article ; ces éléments doivent donc être en texte brut (ou encadrés dans un <p>). Une utilisation incorrecte de <address> communique des informations inexactes aux technologies d'assistance et aux moteurs de recherche.
Syntaxe
La balise <address> fonctionne par paires. Le contenu se place entre la balise ouvrante (<address>) et la balise fermante (</address>).
La plupart des navigateurs ajoutent un saut de ligne avant et après l'élément et affichent le texte en italique. Vous pouvez modifier ce style avec CSS.
Notez que <address> ne doit pas contenir de titres (<h1>–<h6>), d'éléments de sectionnement tels que <article> ou <section>, ni d'autres éléments <address>, <header> ou <footer>.
Coordonnées au niveau du document
Lorsque les informations de contact s'appliquent à l'ensemble de la page, placez <address> à l'intérieur de <body> — généralement dans le pied de page :
<!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>Auteur d'un article
Pour baliser les coordonnées de l'auteur d'un article spécifique, placez <address> à l'intérieur de l'élément <article> de cet article (généralement dans le <footer> de l'article). Il s'agit de l'utilisation canonique et sémantiquement correcte de la balise :
<!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>Utiliser <address> dans le pied de page
Lorsque les informations sur l'auteur ou le propriétaire concernent l'ensemble du site, vous pouvez inclure <address> avec d'autres informations à l'intérieur du <footer> de la page. Dans ce cas, l'adresse représente les coordonnées du propriétaire du site — ce à quoi <address> est précisément destinée. Une simple adresse postale d'entreprise sans contexte d'auteur ou de propriétaire ne devrait pas figurer dans <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>Attributs
La balise <address> ne possède aucun attribut spécifique. Elle prend en charge uniquement les Attributs globaux et les Attributs d'événement.