The semantically correct HTML element for adding contact information is the <address> tag. You can use it to provide the following contact information for example, for a single person, multiple people, or for an organization:
- Physical address;
- Contact or social media links;
- Email address;
- Phone number;
- Social media handle;
- Geographic coordinates;
- Any other type of contact information that's relevant to the context.
Please note that (as per the W3 spec), if the <address> element appears inside an <article> element (or its descendants), then it is considered as representing the contact information relevant to the article, otherwise the contact information applies to the document as a whole.
It is important to note that the <address> element must not contain any other information than the contact information, and it must not be used for contact information that's not relevant for the current document or article. For arbitrary addresses, you can use the <p> element for example.
For example, the following contact information is considered relevant to the document:
<body>
<footer>
<address>
<a href="mailto:[email protected]">[email protected]</a><br />
<a href="tel:+1234567891">(123) 456-7891</a>
</address>
<!-- ... -->
</footer>
</body>
The following contact information is considered relevant to the article:
<body>
<article>
<!-- ... -->
<address>
<a href="https://www.twitter.com/designcise">@designcise</a><br />
</address>
</article>
</body>
Hope you found this post useful. It was published . Please show your love and support by sharing this post.