Skip to content

Know your hCard

hCard

status

Specification

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
email
(can take a type and value, or just a value).Types may be one of the following - INTERNET, x400, pref, or “other IANA registered address types”
tel
A contact telephone number. May have multiple numbers, and can take a type and value, or just a value. Types may be one of the following - voice, home, msg, work, pref, fax, cell, video, pager, bbs, modem, car, isdn, pcs

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

Services using