The <address> tag is used to define a contact address on a website.
It is generally used to specify contact information related to:
- a author;
- an organization;
- or a web page.
Although it can contain text, links, or even tags like <a>, it is designed to indicate information associated with a physical or electronic contact, such as a postal address, an email address, or a phone number.
In other words, whenever you have an address to display on your website (hello "Contact" page 😋), be sure to use the <address> tag!
Â
Structure and Syntax of the <address> Tag
The syntax of the <address> tag is simple and consists of an element that surrounds the contact information.
It is therefore a tag that works in pairs:
- An opening tag
<address>; - A closing tag
</address>.
Here's a small example:
<address>
<p>Believemy</p>
<p>229 rue Saint-Honoré, 75001 Paris FRANCE</p>
<p>Email : <a href="mailto:hello@believemy.com">hello@believemy.com</a></p>
</address>
Try it yourself! 😉
As you can see, we can include links in our address!
Â
Use Cases
1. To display an author's address
<address>
<p>Contact the author at the following address: <a href="mailto:author@example.com">author@example.com</a>.</p>
</address>Â
2. To display a company's address
<address>
<p>Believemy</p>
<p>229 rue Saint-Honoré, 75001 Paris FRANCE</p>
<p>Email : <a href="mailto:hello@believemy.com">hello@believemy.com</a></p>
</address>Â
3. To display a customer service phone number
<address>
<p>Contact our customer service at the following number: <a href="tel:+33123456789">Call</a>.</p>
</address>Â
Browser Compatibility
The <address> tag is supported by all modern browsers.
It is important to note that, although the tag is very useful for SEO and accessibility, it should not be used excessively or for information that is not directly related to contact.
| Element | Google Chrome | Safari | Mozilla Firefox | Edge |
| <address> | Yes | Yes | Yes | Yes |