h-card - Revision history

Tantek: /* Properties */ editorial: more explicit clarification of existing functionality that all properties are optional and plural meaning they may have multiple instances, not that each property instance takes multiple values (no one has ever implemented that, fortunately)

2024-05-23T17:09:51Z

Properties: editorial: more explicit clarification of existing functionality that all properties are optional and plural meaning they may have multiple instances, not that each property instance takes multiple values (no one has ever implemented that, fortunately)

← Older revision		Revision as of 17:09, 23 May 2024
Line 97:		Line 97:

	== Properties ==		== Properties ==
	h-card properties, inside an element with class '''h-card'''. All properties are optional and may ~~be plural~~.		h-card properties, inside an element with class '''h-card'''. All properties are both optional and may have multiple instances, e.g. multiple name, url, photo etc. properties.
	* See [[microformats2-parsing]] to learn more about property classnames.		* See [[microformats2-parsing]] to learn more about property classnames.

Line 170:		Line 170:
	** Used by [https://vanderven.se/martijn/ Martijn van der Ven] with a clip of his given name.		** Used by [https://vanderven.se/martijn/ Martijn van der Ven] with a clip of his given name.
	** Needs a GitHub issue to track.		** Needs a GitHub issue to track.


	== Status ==		== Status ==

Btrem: Fix: replaces deprecated tag with

2022-11-30T23:42:04Z

Fix: replaces deprecated <source> tag with <syntaxhighlight>

← Older revision		Revision as of 23:42, 30 November 2022
Line 19:		Line 19:
	Here are a couple of minimal examples:		Here are a couple of minimal examples:

	<~~source~~ lang=~~html4strict~~>		<syntaxhighlight lang=html>
	<a class="h-card" href="https://tantek.com/">Tantek Çelik</a>,		<a class="h-card" href="https://tantek.com/">Tantek Çelik</a>,

Line 25:		Line 25:
	<a class="p-name p-org u-url" href="https://microformats.org/">microformats.org</a>		<a class="p-name p-org u-url" href="https://microformats.org/">microformats.org</a>
	</span>		</span>
	</~~source~~>		</syntaxhighlight>

	Parsed JSON:		Parsed JSON:
	<~~source~~ lang=javascript>		<syntaxhighlight lang=javascript>
	{		{
	"items": [		"items": [
Line 48:		Line 48:
	]		]
	}		}
	</~~source~~>		</syntaxhighlight>
	Note a single element was sufficient for the simple person example with implied name and URL properties, while for an organization, which requires a name and org, it needed explicit markup for the h-card and all properties, though still with only two elements.		Note a single element was sufficient for the simple person example with implied name and URL properties, while for an organization, which requires a name and org, it needed explicit markup for the h-card and all properties, though still with only two elements.

	Nested h-card example:		Nested h-card example:

	<~~source~~ lang=~~html4strict~~>		<syntaxhighlight lang=html>
	<div class="h-card">		<div class="h-card">
	<a class="p-name u-url"		<a class="p-name u-url"
Line 62:		Line 62:
	>Mozilla Foundation</a>)		>Mozilla Foundation</a>)
	</div>		</div>
	</~~source~~>		</syntaxhighlight>

	Parsed JSON:		Parsed JSON:
	<~~source~~ lang=javascript>		<syntaxhighlight lang=javascript>
	{		{
	"items": [{		"items": [{
Line 83:		Line 83:
	}]		}]
	}		}
	</~~source~~>		</syntaxhighlight>

	Note: the nested h-card has implied 'name' and 'url' properties, just like any other root-class-name-only h-card on an <code><a href></code> would.		Note: the nested h-card has implied 'name' and 'url' properties, just like any other root-class-name-only h-card on an <code><a href></code> would.
Line 183:		Line 183:
	<code>p-adr</code> can optionally embed an [[h-adr]] to cluster associated structured address properties. E.g. adding "p-adr" to the example earlier:		<code>p-adr</code> can optionally embed an [[h-adr]] to cluster associated structured address properties. E.g. adding "p-adr" to the example earlier:

	<~~source~~ lang=~~html4strict~~>		<syntaxhighlight lang=html>
	<div class="h-card">		<div class="h-card">
	<p class="p-name">Joe Bloggs</p>		<p class="p-name">Joe Bloggs</p>
Line 192:		Line 192:
	</p>		</p>
	</div>		</div>
	</~~source~~>		</syntaxhighlight>

	Q: Why would you use "p-adr" to cluster associated structured address properties?		Q: Why would you use "p-adr" to cluster associated structured address properties?
Line 278:		Line 278:
	For backward compatibility, you may wish to use classic [[hCard]] classnames in addition to the more future-proof h-card properties, for example:		For backward compatibility, you may wish to use classic [[hCard]] classnames in addition to the more future-proof h-card properties, for example:

	<~~source~~ lang=~~html4strict~~>		<syntaxhighlight lang=html>
	<p class="h-card vcard">		<p class="h-card vcard">
	<span class="p-name fn">Joe Bloggs</span>,		<span class="p-name fn">Joe Bloggs</span>,
Line 284:		Line 284:
	...		...
	</p>		</p>
	</~~source~~>		</syntaxhighlight>

	The class '''<code>vcard</code>''' is a ''backward compatible root class name'' that indicates the presence of an [[hCard]].		The class '''<code>vcard</code>''' is a ''backward compatible root class name'' that indicates the presence of an [[hCard]].

Barnabywalters: /* Implementations */ added some of the more notable indieweb software which publishes/consumes h-card

2021-06-22T18:52:15Z

Implementations: added some of the more notable indieweb software which publishes/consumes h-card

← Older revision		Revision as of 18:52, 22 June 2021
Line 259:		Line 259:
	Software implementations that publish or consume h-card, including themes, plugins, or extensions:		Software implementations that publish or consume h-card, including themes, plugins, or extensions:

	(This section is a stub that needs expansion! In practice, nearly every CMS on every [https://indieweb.org/ indie web] site supports publishing h-card by default.)		(This section is a stub that needs expansion! In practice, nearly every CMS on every [https://indieweb.org/ indie web] site supports publishing h-card by default, and most sites which support receiving webmentions parse h-card for authorship data.)

	When adding an implementation, please provide and link to its home page and open source repo if any.		When adding an implementation, please provide and link to its home page and open source repo if any.
Line 266:		Line 266:
	* [http://friendica.com/ Friendica] [https://github.org/friendica/friendica source code]		* [http://friendica.com/ Friendica] [https://github.org/friendica/friendica source code]
	* [https://github.com/dissolve/inkblot InkBlot]		* [https://github.com/dissolve/inkblot InkBlot]
			* [https://aperture.p3k.io/ Aperture] consumes h-card to show authorship information of feed posts ([https://github.com/aaronpk/Aperture/ source code])
			* [https://xray.p3k.app/ XRay] consumes h-card and flattens it into a more minimal format ([https://github.com/aaronpk/XRay/ source code])
			* [https://withknown.com/ Known] publishes and consumes h-card to show authorship of posts and responses
			* [https://brid.gy/ Bridgy] publishes microformats-2 versions of siloed content (including h-card for authorship) for consumption by mf2-consumers
			* [https://webmention.io/ webmention.io] consumes h-card for authorship data of incoming webmentions which it accepts on behalf of other sites
	* ...		* ...
	* ...		* ...

Barnabywalters: /* Examples in the wild */ linked to indieweb wiki examples

2021-06-22T18:42:55Z

Examples in the wild: linked to indieweb wiki examples

← Older revision		Revision as of 18:42, 22 June 2021
Line 218:		Line 218:

	== Examples in the wild ==		== Examples in the wild ==
			See also: [https://indieweb.org/h-card#IndieWeb_Examples h-card Examples on indieweb.org]

	Real world in the wild examples of sites and services that publish or consume h-card:		Real world in the wild examples of sites and services that publish or consume h-card:

Barnabywalters: /* Examples in the wild */ moved some examples to offline

2021-06-22T18:37:25Z

Examples in the wild: moved some examples to offline

← Older revision		Revision as of 18:37, 22 June 2021
Line 222:		Line 222:
	* ... add uses of h-card you see in the wild here.		* ... add uses of h-card you see in the wild here.
	* [http://www.securityjobslondon.co.uk Security Jobs London] uses h-card with legacy [[hCard]] fallback markup (to satisfy [https://search.google.com/structured-data/testing-tool Google's Structured Data Testing Tool]) in the footer of each page		* [http://www.securityjobslondon.co.uk Security Jobs London] uses h-card with legacy [[hCard]] fallback markup (to satisfy [https://search.google.com/structured-data/testing-tool Google's Structured Data Testing Tool]) in the footer of each page
	* App.net rolled out support for h-card and h-entry on all profile pages and permalink pages as of 2013-08-06 ([https://alpha.app.net/voidfiles example])
	* Brett Comnes marks up his posts with h-card ([http://bret.io/2013/06/29/getting-started-with-bower/ example])		* Brett Comnes marks up his posts with h-card ([http://bret.io/2013/06/29/getting-started-with-bower/ example])
	* Ben Werdmuller marks up his homepage and posts with h-card [http://werd.io/view/51d5097fbed7ded0633a5956 example])		* Ben Werdmuller marks up his homepage and posts with h-card [http://werd.io/view/51d5097fbed7ded0633a5956 example])
	* [https://joelpurra.com/ Joel Purra] uses a hidden h-card with legacy [[hCard]] fallback markup (to satisfy [https://search.google.com/structured-data/testing-tool Google's Structured Data Testing Tool]) on the front page		* [https://joelpurra.com/ Joel Purra] uses a hidden h-card with legacy [[hCard]] fallback markup (to satisfy [https://search.google.com/structured-data/testing-tool Google's Structured Data Testing Tool]) on the front page
	* Sandeep Shetty marks his homepage and posts up with h-card and h-entry ([sandeep.io/101 example])
	* [http://eschnou.com/ Laurent Eschenauer] marks his homepage profile up using h-card		* [http://eschnou.com/ Laurent Eschenauer] marks his homepage profile up using h-card
	* [http://tommorris.org/ Tom Morris] marks himself up with h-card as well as venues he’s checked into ([http://tommorris.org/posts/8408 example])		* [http://tommorris.org/ Tom Morris] marks himself up with h-card as well as venues he’s checked into ([http://tommorris.org/posts/8408 example])
Line 249:		Line 247:
	=== offline ===		=== offline ===
	* spreadly marks up share permalink pages with minimal h-cards inside h-entry		* spreadly marks up share permalink pages with minimal h-cards inside h-entry
			* App.net rolled out support for h-card and h-entry on all profile pages and permalink pages as of 2013-08-06 ([https://alpha.app.net/voidfiles example])
			* Sandeep Shetty marks his homepage and posts up with h-card and h-entry ([https://sandeep.io/101 example])

	== Validating ==		== Validating ==

Barnabywalters: /* Reserved properties */ removed example, clarified status of reserved properties

2021-06-22T18:33:45Z

Reserved properties: removed example, clarified status of reserved properties

← Older revision		Revision as of 18:33, 22 June 2021
Line 208:		Line 208:

	=== Reserved properties ===		=== Reserved properties ===
	~~Reserved~~ properties (not ~~used much~~, ~~if at all~~, ~~in practice):~~		The following properties were supported by the legacy hCard format, but were not carried over to h-card due to lack of real-world usage, or other problems. They are not part of h-card and should not be published, consumed, or proposed.

	* '''<code>p-organization-name</code>'''		* '''<code>p-organization-name</code>'''
	* '''<code>p-organization-unit</code>'''		* '''<code>p-organization-unit</code>'''
	* '''<code>p-tz</code>''' - timezone offset, ~~e.g.~~ <~~code~~>&~~lt;data class="~~p-tz~~" value="-0800"~~>~~PST<~~/~~data><~~/~~code>~~		* '''<code>p-tz</code>''' — timezone offset
			** <q>it's going to be a hard one to "get right", as the way timezones work in vcard/ical is very weird, and timezones as a whole are an iffy thing to denote (quite the disconnect between complexity, automated processing ability, actually representing what a user would want to show/display or already does on their homepage, and actually representing something useful to parse and do something with)</q>
			** <q>there's certainly no ecosystem of publishers & consumers supporting p-tz in any meaningful interoperable way</q> — [https://chat.indieweb.org/microformats/2021-06-22/1624385751126500 tantek in #microformats]
	* '''<code>dt-rev</code>'''		* '''<code>dt-rev</code>'''

Tantek: editorial: fragments for status and participate, dedup IRC line

2021-06-22T03:54:52Z

editorial: fragments for status and participate, dedup IRC line

← Older revision		Revision as of 03:54, 22 June 2021
Line 3:		Line 3:
	h-card is the [[microformats2]] update to [[hCard]].		h-card is the [[microformats2]] update to [[hCard]].

	;<span id="~~Status~~">Status</span>		;<span id="status">Status</span>
	:This is a '''Living Specification''' yet mature enough to encourage additional implementations and [[h-card-issues\|feedback]].		:This is a '''Living Specification''' yet mature enough to encourage additional implementations and [https://github.com/microformats/h-card/issues feedback].
	;Participate		;<span id="participate">Participate</span>
	:[https://github.com/microformats/h-card/issues Open Issues]		:[https://github.com/microformats/h-card/issues Open Issues]
	:[[IRC]~~]: [irc://irc.freenode.net/microformats #microformats on Freenode~~]		:[[IRC]]
	<div class="p-author h-card vcard">		<div class="p-author h-card vcard">
	;<span class="p-role role">Editor</span>		;<span class="p-role role">Editor</span>

Tantek: drop DISPLAYTITLE thing, seems redundant (and confusing for redirects, fragment links etc.)

2020-08-28T16:55:25Z

drop DISPLAYTITLE thing, seems redundant (and confusing for redirects, fragment links etc.)

← Older revision		Revision as of 16:55, 28 August 2020
Line 1:		Line 1:
	~~{{DISPLAYTITLE:h-card}}~~
	<dfn style="font-style:normal;font-weight:bold">h-card</dfn> is a simple, open format for publishing people and organisations on the web. h-card is often used on home pages and individual blog posts. h-card is one of several open [[microformats\|microformat]] draft standards suitable for embedding data in HTML.		<dfn style="font-style:normal;font-weight:bold">h-card</dfn> is a simple, open format for publishing people and organisations on the web. h-card is often used on home pages and individual blog posts. h-card is one of several open [[microformats\|microformat]] draft standards suitable for embedding data in HTML.

Tantek: editorial: replace examples with examples from hCard spec, upgrade a few links to https, drop redlinked h-card-feedback as a place and link to mf chat archives and github issues instead

2020-08-25T01:18:16Z

editorial: replace examples with examples from hCard spec, upgrade a few links to https, drop redlinked h-card-feedback as a place and link to mf chat archives and github issues instead

Show changes

Tantek: start manually fixing spec styling until we can actually fix the default mediawiki theme to be as much the same as previously as possible

2020-08-24T23:12:24Z

start manually fixing spec styling until we can actually fix the default mediawiki theme to be as much the same as previously as possible

← Older revision		Revision as of 23:12, 24 August 2020
Line 15:		Line 15:
	;License		;License
	: {{cc0-owfa-license}}		: {{cc0-owfa-license}}
	__TOC__		<span style="float:right">__TOC__</span>

	== Example ==		== Example ==