What is the best method to code physical address in html ? in Semantic, Accessible and SEO way
Asked
Active
Viewed 2,738 times
2 Answers
11
Use a Microformats vCard
<div class="vcard">
<span class="fn">Gregory Peck</span>
<a class="org url" href="http://www.commerce.net/">CommerceNet</a>
<div class="adr">
<span class="type">Work</span>:
<div class="street-address">169 University Avenue</div>
<span class="locality">Palo Alto</span>,
<abbr class="region" title="California">CA</abbr>
<span class="postal-code">94301</span>
<div class="country-name">USA</div>
</div>
<div class="tel">
<span class="type">Work</span> +1-650-289-4040
</div>
<div class="tel">
<span class="type">Fax</span> +1-650-289-4041
</div>
<div>Email:
<span class="email">info@commerce.net</span>
</div>
</div>
Accesible: √
Semantic: I guess..
SEO: √ Google announces support for microformats
More examples at http://microformats.org/wiki/hcard-examples
Also check out the Oomph Microformats toolkit that helps you displaying and consuming microformats.
Eduardo Molteni
- 38,786
- 23
- 141
- 206
-
Do we need to write css for all classes in my CSS file? and in vcard where i can put company name? and what is the benefit of formatting like this ? – Jitendra Vyas Dec 11 '09 at 09:55
-
You don't need to add all the classes, only the ones that will help you displaying it in a nice way. – Eduardo Molteni Dec 11 '09 at 09:56
-
4@Jitendra No. Classes are not required to have a specified style. – deceze Dec 11 '09 at 09:57
-
I think i will go for id in the onces that are not general. – Orson Dec 11 '09 at 10:09
-
+1 it seems best answer till now but i still have some confusion , in vcard where i can put company name? and what is the benefit of formatting like this ? – Jitendra Vyas Dec 11 '09 at 10:10
-
Use `fn` class in any element for the name, and `org` class for the company. You can put them together if you are showing a company address. – Eduardo Molteni Dec 11 '09 at 10:18
-
The mentioned Oomph toolkit has a tool to make them quickly – Eduardo Molteni Dec 13 '09 at 13:36
-3
<address> is exactly what you are looking for.
Boris Guéry
- 47,316
- 8
- 52
- 87
-
2`address` is **not** exactly what you are looking for. `address` is intended only to mark up contact info regarding the currently viewd page (like the Apache 404 default error pages and the "Apache X.X at ..." line. – Boldewyn Dec 11 '09 at 10:05
-
1The W3C specifications : >The ADDRESS element may be used by authors to supply contact information for a document It is not 'intended only'. I think the most important part is 'supply contact information', and it's what you should want when you provide an address. So it look semanticly correct to use `address` in those cases. – Boris Guéry Dec 11 '09 at 10:12
-
2from HTML 5 Spec: 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. http://dev.w3.org/html5/spec/Overview.html#the-address-element – Eduardo Molteni Dec 11 '09 at 10:13