From Microformats Wiki
hcard-examples-in-wild /
Jump to navigation Jump to search

<entry-title>hCard Examples in the wild</entry-title>

Want hCardsHave hCards

This page is an informative section of the hCard specification.

The following sites have published hCards, and thus are a great place to start for anyone looking for examples "in the wild" for inspiration, or try parsing and indexing.

Turkish business telephone directory website [1] implements valid hCard and hReview-Aggregate for companies, contact information with geo tags and user comments.

examples by category

Want hCard? Get started with writing an hCard using the hCard creator to write up some contact information, validate and publish it, or following the hCard authoring tips to add hCard markup to your current site. Check out this section for similar examples of types of pages that benefit from hCard markup.

This section organizes examples into several rough categories as follows. If an example fits in more than one category, use the *last* matching category in this list that matches the specific hCard example(s) in the wild that you are trying to categorize.

  1. Individuals - one card per person, perhaps sort alphabetically by "family-name". People with their own hCards (typically) on their own site.
  2. Organizations - one card per organization, alphabetical by "fn". Organizations with their own hCard(s) (typically) on their own site.
  3. Institutions - which list more than one person, with a count estimating the # of hCards, e.g. 40k for Avon. Also indicate complexity of information supplied, eg. just name+number vs. complete details. Alphabetically sorted by "org" with perhaps a few individuals listed in a single sub-bullet, comma delimited, sorted by "family-name".
  4. Online Profiles - which host profiles for more than one person, with a count estimating the # of hCards, e.g. 10m+ for Flickr.com. Alphabetically sorted by company / service name.
  5. Online Venues - which provide listings for businesses or organizations, with a count estimating the # of venues, e.g. ~10k for Upcoming.org. Alphabetically sorted by service/site name, with perhaps a few specific venues listed in a single sub-bullet, comma delimited, sorted by "fn".
  6. Event Speakers - event pages where the speaker for the event is marked up with hCard.
  7. Speakers Listings - event sites' speakers pages where the speakers are marked up with hCard. Sort by date, sub-grouped by year. Most recent first. Perhaps a few individuals listed in a single sub-bullet each event, comma delimited, sorted by "family-name".
  8. Group Blogs - blogs with multiple authors marked up with hCard
  9. Wiki templates - community wikis that have templates that automatically generate hCards on pages
  10. Authors - pages about some other thing, such as books, perhaps reviews etc., which have marked up their authors with hCard
  11. Search Results - results pages from search engines (either generic or for people/organizations) that return people marked up with hCards.
  12. Listing Contact - contact information for a listing like a job posting, for sale offering, etc.

In addition there is a separate "UTF8 Examples" section that can be used to put another link to any hCard examples in the wild which exercise various non-ASCII7 / non-english characters for various property values.

As each section itself become quite large (we might be there already, once we sort through the above "Reviewed Examples"), it will probably be moved to a separate page, leaving its heading here in place, and replacing its contents here with a link to the separate page and perhaps a stats summary.


Groupings alphabetically by "family-name".

Nicely styled:

  • Nick Doty's home page has a very cleanly designed hCard with a map background indicating his current general geographic location.
  • Jared Hanson's home page has a beautiful hCard with numerous ways of contacting him, and live updating of his online status on various messaging networks (uses javascript).
  • Tim Van Damme's home page is a beautiful hCard (click the "About" tab to have Operator recognize it if it's not immediately active).

Simple web pages (sorted by family name)







  • Paul Roub has an hCard for himself on his blog's home page.





  • Aviran Zazon has an hCard on his company personal webpage (Staff).

Hidden! Invisible data is strongly discouraged, these examples have been grouped here in the hopes that the authors will someday make their hCards visible:

  • A.J. Brown's home page includes a hidden hCard at the bottom of the page.

Former. URLs that seem to have broken.

  • http://rogieking.com/#contact Rogie King's contact info was marked up with hCard and very nicely styled. (missing as of 2013-03-15)
  • http://tomleo.com/about.html Tom Leo's about page had an hCard. (missing as of 2009-08-23)
  • http://bogomil.info?l=en/ Bogomil Shopov had an hCard for himself (missing as of 2011-125)


Sites for specific organizations with their own hCard on home page, or contact/about page(s). Grouped by country, sorted alphabetically (US first by convention). When this section gets too big we can make a separate business directory page.

US orgs

Australia orgs

  • B&R Data Systems is an organisation hCard. We have also used the technorati tool to download as a vCard, which I think is useful for a business.

England orgs

France orgs

Spain orgs

Germany orgs

  • Hohenstaufen Gymnasium Kaiserslautern has hCard contact info
    • suboptimal: adr subproperties are not recognized due to lack of explicit "adr" property.
      • evidence that has helped drive the flatter design of microformats2 including h-card which permits adr properties, e.g. 'street-address' directly inside the hCard instead of requiring an explicit 'adr' in the hierarchy. - Tantek 01:46, 17 May 2012 (UTC)

Georgia orgs

Israel orgs

Italy orgs

Netherlands orgs

  • Kinderdagverblijf Kabouterbos, a day care / nursery that uses an hCard for their contact information (footer).
  • Simourix At the top of each page you'll find our hcard. Only the address, phone number and email address are visible, but the actual hcard contains much more info.

Mis-sorted - this should be moved to a search results section:

Old: (these sites used to have hCard, some may have gone offline)

  • http://technorati.com Technorati (2004-2011)
    • http://technorati.com/about/ about, http://technorati.com/press/ press, and http://technorati.com/about/contact.html contact pages with hCard and have "Add to Address Book" links with the http://feed.technorati.com/contacts/ Technorati Contacts Feed service.
  • http://technorati.jp Technorati Japan (2004-2011)
    • http://technorati.jp/about/contact.html contact page marked up with hCard.

Romanian orgs

Russia orgs

Scotland orgs

Uruguay orgs

  • Cubox labs has a nice contact info hCard on their blog home page with address, email, telephone, twitter, github.


  • Mozilla's WebFWD experts and team pages have hCards, including microformats2 h-card markup.
  • O'Reilly's Conferences Team page has hCards for their team (~14) with a link to "Download the below contact info in vcf format" that uses the old Technorati contacts feed service to convert the hCards into vCards.
    • needs updating to use H2VX instead of Technorati
    • suboptimal: The "org" shouldn't be hidden with "display:none". Instead, use the include-pattern to include the "org" from text elsewhere on the page (to avoid duplicating the text).

with some problems:


  • 2005-2010(?) http://technorati.com/about/staff.html Technorati's Staff page had hCards for its employees (~31)
    • E.g. http://technorati.com/about/staff.html?s=matthew_levine#matthew_levine Matthew Levine, http://technorati.com/about/staff.html?s=ryan_king#ryan_king Ryan King, etc.

Online Profiles

Online Venues

Event Venues

Event Speakers

Speakers Listings

  • ... lots more to add from events since 2007, e.g. every dConstruct etc.


To Do: check 2007 presentations as they likely contain links to conferences that marked up their speakers page(s) with hCard.


To Do: check 2006 presentations as they likely contain links to conferences that marked up their speakers page(s) with hCard.


To Do: check 2005 presentations as they likely contain links to conferences that marked up their speakers page(s) with hCard.

Group Blogs

  • The IBM Shortcuts Podcast has authors marked up with hCard but has some problems:
    • hidden: The root hCard element as well as every property contained therein is made invisible through a style attribute containing "position:absolute; visibility:hidden".

Wiki Templates


Search Results

  • University of Bath Person Finder results are encoded with hCards so you can easily create a vCard from any result.
    • invalid: attempt to use Implied-N optimization where that's not possible,
    • suboptimal: honorific-prefix could be explicitly marked up
      • Error appears for external users only. Won't be fixed any time soon. -- PhilWilson 00:03, 28 Jan 2006 (GMT)
  • YourTraces SocialSearch Try high results (hohe Relevanz) to get only websites marked with hcard as a person.

Listing Contact

Contact information for listings, e.g. job postings, items for sale, etc.

UTF8 Examples

These examples all contain one or more characters in UTF8 that are outside the ASCII7 range and make for excellent test cases to make sure you are handling UTF8 properly throughout your hCard parsing and transforming. And especially if you are generating vCards, these test cases will help you make sure you are generating UTF8 vCards in such a way that can be recognized by UTF8 supporting vCard applications. Sorted roughly alphabetically (per Unicode).

nickname only

These UTF8 examples only have UTF8 for the "nickname" property and are thus are a bit easier for testing than the previous examples.

non-HTML examples


Examples that used to have one or more hCards but now don't seem to have any. If you do find one, please include direct links to at least two (assuming there are two or more) pages at the referenced site that have one or more hCards.

related pages

The hCard specification is a work in progress. As additional aspects are discussed, understood, and written, they will be added. These thoughts, issues, and questions are kept in separate pages.