From IndieWeb

indiecard is a brainstorming proposal for an open link-preview and cards standard based on using microformat root h-* class names on the body element, and re-using microformats properties such as p-name, p-summary, u-photo, u-featured to provide functionality equivalent to Facebook's OGP, Twitter Cards, and other proprietary/corp-driven efforts.


Ideas towards indie cards. Once tested/deployed, we should graduate these up to actual Why / How to sections.

How to markup

Make sure the first h-* item on your page represents the page.

Use <body class="h-*"> for the first h-* item on the page.

Use an explicit p-name if the implied one is not ideal/too long.

Use p-summary for more detail.

Use u-photo for an image.

How to be backward compatible

How to be backward compatible with other card/review consuming systems.

  • Use a good title element
  • ? Use meta description for the description / summary. (? for Facebook, Google Search)
  • Use an image early on in the page that is at least 200(?) pixels wide

How to parse an indiecard

In summary: Use first h-* item found on a page

Look at the first h-* item on the URL given, if it has a u-url defined that is *not* the current page, follow that link as it is more likely to have more data.

Use p-name, u-url, u-photo and p-summary, if present. unmung has an experimental parser.

See Also