From IndieWeb
h-cite icon
h-cite icon

h-cite is the microformats2 vocabulary for marking up citations and references on web sites.

IndieWeb Uses

There are several IndieWeb uses of h-cite:

  • photo - information on an embedded photo. For example, if it has a different author than the post.
  • reply-context - summary display of the original post that a reply/comment is in-reply-to.
  • comments - comments shown below a post that have been federated/syndicated in from their original reply permalink.
  • like - context about the thing you liked, similar to a reply-context.
  • repost - context about the thing you reposted, like what resonated with you and you wished to draw the reader's attention to through the repost.
  • appearances — markup books, papers, films that listed in your appearances

Notes on markup and usability

  • blockquote and cite tags - when quoting other blog posts, it's good to provide a fully marked up citation using h-cite and the blockquote and cite HTML tags.
  • Citation user interface - it is suggested to provide an explicit <cite class="h-cite"> markup in an input text box at the bottom of blog posts. This allows others to easily copy and paste your content into their follow-up blog posts or responses.
    • Tantek provides such input boxes with citation markup to copy/paste in the footer of every article he publishes, e.g. [1]


Q: When making a mentions stream, should I use h-cite around each entry?

A: If you are displaying the entire entry, then it does not need an h-cite. If you are citing a summary of the entry — e.g. name, URL, and dt-published — then an h-cite is appropriate.

IndieWeb Examples

Christian Weiske

Christian Weiske uses h-cite to mark up books he has in his library - http://cweiske.de/books.htm

gRegor Morrill

gRegor Morrill: I've published h-cite on:

Sara Jakša

add yourself!

See Also