hCard essentials
You can code your own hCard very easily. There are two requirements:
- Contact information must be contained within a page element that has the id="vcard" and a unique class
- The full name of the person or organization must be identified with class="fn" or class="org fn"
If you want to add more information to an hCard, follow these guidelines:
| Description | hCard identifier |
|---|---|
| Full Name is defined as one given name and one family name. | class="fn" |
| Given name | class="given-name" |
| Additional (Middle) name | class="additional-name" |
| Family name | class="family-name" |
| Profile photograph must be used on an img tag | img class="photo fn" |
| Related website | a class="url fn" |
| Organization | a class="org" |
| a class="email" | |
| Address | class="adr" |
| Address tags may contain other tags | class="street-address" or class="locality" (city) or class="region" (state) or class="postal-code" or class="country-name" |
| Telephone | class="tel" |
Additional Resources
- hCard on microformats.org
- hCard Creator
- hCard examples
- My hCard