hCard
status
authors
Description
hCard is a 1 to 1 representation of the properties and values of vCard (IETF RFC 2426) in HTML. hCard extends the limited scope of vCard, essentially people, to include companies, organizations and places.
Usage
hCard allows publishers to markup details (particularly, but not exclusively, contact details) for people, organizations, companies and places.
hCards have a root element with a class value of “vcard”, and a required subproperty of “fn” (formatted name), for the name of the entity represented by the hCard. Where an hCard is for an organization, the organization fn also includes a class value of “org” to specify this.
Optional subproperties include
Naming and personal details
- N (name)
- This is for the structured name of the entity, and must take one or more subproperties from the following list
- honorific-prefix
- given-name
- additional-name
- family-name
- honorific-suffix
- nickname
- for a nickname
- bday
- birthday, typically uses the abbr design pattern to have both humanly friendly and machine readable values - see the abbr design pattern for more
- photo
- an image element with a class of “photo”
- url
- a url for the person or organization
Contacting
- adr
- (address) (see the adr microformat entry - adr is a subproperty of hCard)
- geo
- a longitude and latitude for the person, place or organization represented by the hCard. See the geo microformat entry for details - geo is a subproperty of hCard
Organizational details
- org
- Where the hCard is for a person, an organization the person works at, or has some other role with
- Where the hCard is for an organization, the name of the organization. In this case, the element with a class value of “fn” must also have a class value of “org”.
- role
- the role a person plays within the organization specified by the org property
- title
- the title a person has at the the organization specified by the org property
- logo
- an image element with a class value of logo specifies a graphic image for the entity represented by the hCard. For companies it will typically be the company logo. For an individual it may be an “avatar”. See also the photo, property, for photographic images of people.
Other properties
Because hCard is vCard in HTML, it acquires all the vCard properties. Some of these are not commonly used (even by applications which support vCard), and so are probably going to be rarely used ibn hCard as well. They are included here for completeness. The descriptions are largely taken from the vCard specification
- agent
- To specify information about another person who will act on behalf of the entity represented by the hCard
- categories
- In effect tags for the hCard, and impleemnted using the rel-tag microformat
- key
- specifies the public key or authentication certificate associated with the entity the hCard represents
- class
- specify the access classification for the hCard - for example public, private or confidential
- label
- specifies the formatted text corresponding to delivery address of the entity represented by the hCard
- mailer
- specify the type of electronic mail software that is used by the entity represented by the hCard
- note
- specifies supplemental information or a comment that is associated with the hCard
- rev
- A date/time value specifying revision information about the hCard
- sound
- specify a digital sound content information that annotates some aspect of the hCard. By default this type is used to specify the proper pronunciation of the name type value of the hCard
- tz
- specify information related to the time zone of the entity represented by the hCard
Examples
an hCard for a person
<div class=”vcard”>
<span class=”fn n”><span class=”given-name”>William</span> <span class=”additional-name”>Henry</span> <span class=”family-name”>Gates</span> <span class=”honorific-suffix”>III</span></span> (born <abbr class=”bday”title=”1955-10-28″>October 28, 1955</abbr>)
<div class=”adr”>
<p><span class=”street-address”>1835 73rd Ave NE</span>,</p>
<p><span class=”locality”>Medina</span>,</p>
<p><span class=”region”>WA</span> <span class=”postal-code”>98039</span></p>
<p class=”country-name”>USA</p>
</div>
<p><span class=”title”>Chairman</span>, <span class=”org”>Microsoft</span></p>
<p><a href=”http://www.microsoft.com/billgates/” class=”url”>http://www.microsoft.com/billgates/</a></p>
<p><a href=”mailto:bill@microsoft.com” class=”email”>bill@microsoft.com</a></p>
</div>
an hCard for an organization
<div class=”vcard”>
<p class=”fn org”>Web Directions Conference Pty Ltd
<a href=”http://suda.co.uk/projects/X2V/get-vcard.php?uri=http://microformatique.com/book/chapter7/index.html”>
<img src=”images/vcard-add.png” alt=”download vcard icon”></a></p>
<div class=”adr”>
<p class=”street-address”>8/54 Mitchell St</p>
<p><span class=”locality”>Bondi</span> <span class=”region”>NSW</span> <span class=”postal-code”>2026</span></p>
<p class=”country-name”>Australia</p>
</div>
<p>Phone/Fax: <span class=”tel”><span class=”type”>Work</span>: <span class=”value”>61 2 9365 5007</span></p>
<p>Email: <a class=”email” href=”mailto:info@webdirections.org”>info@webdirections.org</a></p>
</div>
Tools
Authoring
- Dreamweaver microformats toolbar from the Web Standards Project by Drew Mclellan, supports creating hCard: http://www.webstandards.org/action/dwtf/microformats/
- hCard creator from Microformats.org: http://microformats.org/code/hcard/creator
- Chris Casciano has a plug in for Texpattern with the decidedly geeky name of pnh_mf for more easily marking up microformatted content, including hCard: http://placenamehere.com/TXP/pnh_mf/
Services using
- Technorati Microformats Search: http://kitchen.technorati.com
- Pingerati: http://pingerati.net
- X2V: http://suda.co.uk/projects/X2V/

