CODEWITHSUNDEEP
html
Canser Yanbakan
Canser Yanbakan

Reputation: 3870

Correct usage of HTML5 <address> element?

I'm searching for correct usage of <address> element.

For example, i have to show more than one address, so i need to write them in an address element or seperate for each other?

<p>BLA BLA CO.</p>
<address>
    <span class="full-address">XXX ST. XXX ETC.</span>
    <span class="city">IZMIR</span>
    <span class="town">Bornova</span>
    <span class="phone">+11 111 111 1111</span>
    <span class="fax">+11 111 111 1112</span>
</address>

<p>OTHER BLA CO.</p>
<address>
    <span class="full-address">XXX ST. XXX ETC.</span>
    <span class="city">IZMIR</span>
    <span class="town">Bornova</span>
    <span class="phone">+11 111 111 1111</span>
    <span class="fax">+11 111 111 1112</span>
</address>

What is the correct usage of this?

Upvotes: 7

Views: 4464

Answers (2)

Abhitalks
Abhitalks

Reputation: 28387

In your use-case, it probably is incorrect usage.

As per the official refs:

The address element must not be used to represent arbitrary addresses (e.g. postal addresses), unless those addresses are in fact the relevant contact information. (The p element is the appropriate element for marking up postal addresses in general.)

Ref, Living standard: https://html.spec.whatwg.org/multipage/semantics.html#the-address-element

Ref, Spec HTML4.01: http://www.w3.org/TR/html401/struct/global.html#h-7.5.6

Ref, Recomendation HTML5: http://www.w3.org/TR/html5/sections.html#the-address-element

.

You are presenting several postal addresses, and so it seems a p is more appropriate here. Regarding address, it represents contact information for its nearest article or body and is also allowed in footer.

Upvotes: 9

Der Vampyr
Der Vampyr

Reputation: 951

Well, depending on this source the <address> tag is not an actually address in your usecase. Its more like a pointer to the page author. Means, it should contain your own address.

Additional info by w3schools

  • The <address> tag defines the contact information for the author/owner of a document or an article.

  • If the <address> element is inside the <body> element, it represents contact information for the document.

  • If the <address> element is inside an <article> element, it represents contact information for that article.

Upvotes: 2

Related Questions