Microformats Wiki - User contributions [en]

rel-pronunciation

2017-11-19T03:21:23Z

Nick: Added a different kind of example twice, added a missing comma, deleted a hyphen, and capitalized proper names.

== 'pronunciation' rel value ==

=== Summary ===

The 'pronunciation' value is proposed for the 'rel' attribute of the 'link' element of HTML. This value signifies that the referenced document provides pronunciation rules suitable for speech synthesis (otherwise known as "Text To Speech", or TTS). Pronunciation instructions describe how specific text tokens should be rendered in the aural dimension using synthetic voice, and are expressed based on either a given phonetic alphabet or a pronunciation analogy (such as, for the written "read", either "red" or "reed").

=== Details ===

The file referenced by the 'link' element contains a set of rules that associates strings of characters (e.g., words, or other kinds of tokens) with pronunciation instructions. For example, a rule is able to define whether the word "tomato" should be spoken with the British or North American accent or whether the word "read" should be spoken in the past or present tense (chosen by providing the context in the pronunciation file).

These pronunciation rules should be processed by voice-enabled user-agents (e.g. web browsers that support TTS rendering), but conversely, "pronunciation" link/rel files can be completely ignored by systems that do not have speech capabilities.

When several pronunciation lexicons are referenced within a single HTML document, and/or when a pronunciation rule is specified more than once for a given string of characters, the last occurrence of the rule takes precedence (in document order), in such a way that any previously-defined pronunciation rule gets overridden.

=== Existing uses ===

The 'pronunciation' value is used in the real world by the [http://epub-revision.googlecode.com/svn/trunk/build/30/spec/epub30-contentdocs.html#sec-pls-conf-pub EPUB 3.0 standard] (currently in draft state, due to be published in stable form in 2011).

The format recommended for use is [http://www.w3.org/TR/pronunciation-lexicon/ W3C PLS (Pronunciation Lexicon Specification)], with the MIME type "application/pls+xml" (and usually, the extension ".pls").

=== See also ===

* [[existing-rel-values]]
* [http://www.w3.org/Bugs/Public/show_bug.cgi?id=7601 HTML issue #7601]

h-card

2016-01-19T07:14:46Z

Nick: /* Examples in the wild */ Added a minor site.

<entry-title>h-card</entry-title>
[[User:Tantek|Tantek Çelik]] (Editor)
----
<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 one of several open [[microformats|microformat]] draft standards suitable for embedding data in HTML/HTML5.

h-card is the [[microformats2]] update to [[hCard]].

{{cc0-owfa-license}}

== Example ==
Here is a simple minimal person example:

<source lang=html4strict>
<a class="h-card" href="http://example.com">Joe Bloggs</a>
</source>

Parsed JSON:
<source lang=javascript>
{
"items": [
{
"type": [
"h-card"
],
"properties": {
"name": [
"Joe Bloggs"
],
"url": [
"http://example.com"
]
}
}
]
}
</source>

And a slightly more complete example:

<source lang=html4strict>

<img class="u-photo" src="http://example.org/photo.png" alt="" />
<a class="p-name u-url" href="http://example.org">Joe Bloggs</a>
<a class="u-email" href="mailto:joebloggs@example.com">joebloggs@example.com</a>,
17 Austerstræti
Reykjavík
Iceland

</source>

Parsed JSON:
<source lang=javascript>
{
"items": [
{
"type": [
"h-card"
],
"properties": {
"photo": [
"http://example.org/photo.png"
],
"name": [
"Joe Bloggs"
],
"url": [
"http://example.org"
],
"email": [
"mailto:joebloggs@example.com"
],
"street-address": [
"17 Austerstræti"
],
"locality": [
"Reykjavík"
],
"country-name": [
"Iceland"
]
}
}
]
}
</source>

Nested h-card example

<source lang=html4strict>
<div class="h-card">
<a class="p-name u-url"
href="http://blog.lizardwrangler.com/"
>Mitchell Baker</a>
(<a class="p-org h-card"
href="http://mozilla.org/"
>Mozilla Foundation</a>)
</div>
</source>

Parsed JSON:
<source lang=javascript>
{
"items": [{
"type": ["h-card"],
"properties": {
"name": ["Mitchell Baker"],
"url": ["http://blog.lizardwrangler.com/"],
"org": [{
"value": "Mozilla Foundation",
"type": ["h-card"],
"properties": {
"name": ["Mozilla Foundation"],
"url": ["http://mozilla.org/"]
}
}]
}
}]
}
</source>

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.

=== Get started ===
The class '''<code>h-card</code>''' is a ''root class name'' that indicates the presence of an h-card.

For minimal examples where at most <code>p-name</code>, <code>u-url</code> and <code>u-photo</code> are required (such as the first given above), only the root class name is needed — see [[microformats-2-implied-properties|implied properties]].

For more complex examples, the root class name must be placed on an element which encloses all the desired properties, and then the properties themselves marked up using the classnames given below.

See [[microformats2-parsing]] to learn more about property classnames.

== Properties ==
h-card properties, inside an element with class '''h-card''':
* '''<code>p-name</code>''' - The full/formatted name of the person or organisation
* '''<code>p-honorific-prefix</code>''' - e.g. Mrs., Mr. or Dr.
* '''<code>p-given-name</code>''' - given (often first) name
* '''<code>p-additional-name</code>''' - other/middle name
* '''<code>p-family-name</code>''' - family (often last) name
* '''<code>p-sort-string</code>''' - string to sort by
* '''<code>p-honorific-suffix</code>''' - e.g. Ph.D, Esq.
* '''<code>p-nickname</code>''' - nickname/alias/handle
* '''<code>u-email</code>''' - email address
* '''<code>u-logo</code>''' - a logo representing the person or organisation
* '''<code>u-photo</code>'''
* '''<code>u-url</code>''' - home page
* '''<code>u-uid</code>''' - universally unique identifier, typically canonical URL
* '''<code>p-category</code>''' - category/tag
* '''<code>p-adr</code>''' - postal address, optionally embed an [[h-adr]] {{main|h-adr}}
* '''<code>p-post-office-box</code>'''
* '''<code>p-extended-address</code>''' - apartment/suite/room name/number if any
* '''<code>p-street-address</code>''' - street number + name
* '''<code>p-locality</code>''' - city/town/village
* '''<code>p-region</code>''' - state/county/province
* '''<code>p-postal-code</code>''' - postal code, e.g. US ZIP
* '''<code>p-country-name</code>''' - country name
* '''<code>p-label</code>'''
* '''<code>p-geo</code>''' or '''<code>u-geo</code>''', optionally embed an [[h-geo]] {{main|h-geo}}
* '''<code>p-latitude</code>''' - decimal latitude
* '''<code>p-longitude</code>''' - decimal longitude
* '''<code>p-altitude</code>''' - decimal altitude
* '''<code>p-tel</code>''' - telephone number
* '''<code>p-note</code>''' - additional notes
* '''<code>dt-bday</code>''' - birth date
* '''<code>u-key</code>''' - cryptographic public key e.g. SSH or GPG
* '''<code>p-org</code>''' - affiliated organization, optionally embed an [[h-card]]
* '''<code>p-job-title</code>''' - job title, previously 'title' in [[hCard]], disambiguated.
* '''<code>p-role</code>''' - description of role
* '''<code>u-impp</code>''' per RFC4770, new in vCard4 (RFC 6350)
* '''<code>p-sex</code>''' - biological sex, new in vCard4 (RFC 6350)
* '''<code>p-gender-identity</code>''' - gender identity, new in vCard4 (RFC 6350)
* '''<code>dt-anniversary</code>'''

All properties are optional.

== Status ==
'''h-card''' is a microformats.org draft specification. Public discussion on h-card takes place on [[h-card-feedback]] and the #microformats [[irc]] channel on irc.freenode.net.

h-card is ready to use and implemented in the wild, but for backwards compatibility you should also mark up top-level h-cards as classic [[hCard]]s.

== Property Details ==
(stub, to be expanded)

=== p-adr ===
<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>
<div class="h-card">
Joe Bloggs

17 Austerstræti
Reykjavík
Iceland

</div>
</source>

Q: Why would you use "p-adr" to cluster associated structured address properties?

A: Because if you have more than one structured address, it helps to cluster which properties go with which address, e.g. home vs. work.

=== p-tel ===
Note: use of 'value' within 'p-tel' should be automatically handled by the support of the [[value-class-pattern]]. And for now, the former [[hCard]] 'type' subproperty of 'tel' is dropped/ignored. If there is demonstrable documented need for additional tel types (e.g. fax), we can introduce new flat properties as needed (e.g. p-tel-fax).

=== Reserved properties ===
Reserved properties (not used much, if at all, in practice):

* '''<code>p-organization-name</code>'''
* '''<code>p-organization-unit</code>'''
* '''<code>p-tz</code>''' - timezone offset, e.g. <code><data class="p-tz" value="-0800">PST</data></code>
* '''<code>dt-rev</code>'''

== Examples in the wild ==
Real world in the wild examples:

* ... add uses of h-card you see in the wild here.
* 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])
* Ben Werdmuller marks up his homepage and posts with h-card [http://werd.io/view/51d5097fbed7ded0633a5956 example])
* 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://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://www.w3.org/conf/ W3Conf 2013] uses h-card for all the event speakers and notable attendees. The h-cards make particularly good use of implied name, url, and photo properties.
* [http://wordpress.org/extend/themes/sempress SemPress] is a WordPress theme that supports h-card, h-feed/h-entry and h-as-*
* [http://the-pastry-box-project.net/ The Pastry Box Project] use h-card markup on their homepage and individual thoughts pages
* Tom Morris uses h-card and [[XFN]] to markup [http://tommorris.org/pages/blogroll his blogroll].
* Aaron Parecki uses h-card to markup both authorship and references to people in his notes permalinks, e.g. [http://aaronparecki.com/2012/230/reply/1 2012/230/reply/1].
* [http://tantek.com/ Tantek Çelik] uses h-card on his home page as well as within [[h-entry]]s on permalink pages to indicate authorship.
* [http://waterpigs.co.uk/ Barnaby Walters] uses h-card on his home page, as well as within h-entries for notes and articles, both to indicate authorship and also when mentioning people within the body of the notes.
* [http://tantek.com/presentations/2012/06/microformats microformats.org at 7 years] presentation with and h-card markup for people and organizations.
* [http://tantek.com/presentations/2012/06/pdf2012-indieweb.html Rise of the Indie Web hCards] (from Personal Democracy Forum 2012 #pdf12 #pdf2012) has [[microformats2]] h-card markup
* WebMaker by Mozilla has [[microformats2]] h-card on event search (e.g. [https://webmaker.org/en-US/events/near/?lat=45.5234515&lng=-122.6762071 search near Portland Oregon]) and event pages (e.g. [https://webmaker.org/en-US/events/192f56eb9/ IndieWebCamp 2012]).[https://twitter.com/microformats/status/212207925643587585]
* WebFWD by Mozilla has [[microformats2]] h-card markup on [https://webfwd.org/about/experts/ experts] and [https://webfwd.org/about/team/ team] pages
* [http://indiewebcamp.com IndieWebCamp] has [[microformats2]] h-event markup with embedded h-cards for the organizers and the location.
* [https://wiki.mozilla.org/Events Mozilla Events] page has [[microformats2]] h-event markup with attendees marked up with h-card.
* [https://tristanthomas.me Tristan Thomas] uses h-card on his home page
* [http://cold32.com/about-the-author-and-contact.htm Cold32.com] uses h-card (and h-geo) on its about-the-author-and-contact page
* [https://workfrom.co/ Workfrom.co] renders h-cards for venues (e.g. [https://workfrom.co/palio-dessert-and-espresso-house])

=== offline ===
* spreadly marks up share permalink pages with minimal h-cards inside h-entry ([http://my.spread.ly/share/51d570bc09e9486562000002 example])

== Validating ==
* '''[http://indiewebify.waterpigs.co.uk/validate-h-card/ indiewebify.me h-card validator]''' parses [[h-card]] markup and makes suggestions for things to add, with code samples
{{h-spec-section-validating}}

== Backward Compatibility ==
=== Publisher Compatibility ===
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>

Joe Bloggs,
Awesome Nonprofit
...

</source>

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

'''fn''', '''org''', and all the other backward compatibility hCard property class names are listed below.

=== Parser Compatibility ===
Microformats parsers {{should}} detect classic properties only if a classic root class name is found and parse them as microformats2 properties.

If an "h-card" is found, don't look for a "vcard" on the same element.

Compat. root class name: <code id="vcard">vcard</code> 
Properties: (parsed as '''p-''' plain text unless otherwise specified)
* <code>fn</code> - parse as '''<code>p-name</code>'''
* <code>honorific-prefix</code>
* <code>given-name</code>
* <code>additional-name</code>
* <code>family-name</code>
* <code>honorific-suffix</code>
* <code>nickname</code>
* <code>email</code> - parse as '''u-'''
* <code>logo</code> - parse as '''u-'''
* <code>photo</code> - parse as '''u-'''
* <code>url</code> - parse as '''u-'''
* <code>uid</code> - parse as '''u-'''
* <code>category</code>
* <code>adr</code> - parse as '''<code>p-adr h-adr</code>''' including compat root class <code>adr</code>
* <code>extended-address</code>
* <code>street-address</code>
* <code>locality</code>
* <code>region</code>
* <code>postal-code</code>
* <code>country-name</code>
* <code>label</code>
* <code>geo</code> - parse as '''<code>p-geo h-geo</code>''' including compat root class <code>geo</code>
* <code>latitude</code>
* <code>longitude</code>
* <code>tel</code>
* <code>note</code>
* <code>bday</code> - parse as '''dt-'''
* <code>key</code> - parse as '''u-'''
* <code>org</code>
* <code>organization-name</code>
* <code>organization-unit</code>
* <code>title</code> - parse as '''p-job-title'''
* <code>role</code>

Reserved: (backward compat properties that parsers {{may}} implement, if they do, they {{must}} implement in this way:
* <code>tz</code>
* <code>rev</code> - parse as '''dt-'''

== Background ==
This work is based on the existing [[hCard]] and [[vcard]] specifications.

== Design Principles ==

(stub, expand)

== Additions ==
We've tried very hard with h-card to stay compatible with vCard4, and thus additions should be proposed on the vCard4 mailing list.

However, you may still use this wiki to capture additions for h-card here:
* [[h-card-brainstorming]]

== See Also ==
* [[microformats2]]
* [[microformats2-parsing]]
* [[h-adr]]
* [[h-geo]]
* [[hCard]]

[[Category:Draft Specifications]]

http://search.bearshare.com/web?q=osoporno&hl=es&page=1&src=crb&ref=1
http://foros.diariovasco.com/viewtopic.php?f=44&t=49404&p=3263527
http://foro.mejorconsalud.com/member/1659-jaimeca
http://www.presspeople.com/po/5697a36d673fdb1c52974897bd86-jaime

h-card

2016-01-08T02:09:54Z

Nick: /* Properties */ Delinked the obsoleted RFC and linked in three places to a now-valid RFC.

<entry-title>h-card</entry-title>
[[User:Tantek|Tantek Çelik]] (Editor)
----
<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 one of several open [[microformats|microformat]] draft standards suitable for embedding data in HTML/HTML5.

h-card is the [[microformats2]] update to [[hCard]].

{{cc0-owfa-license}}

== Example ==
Here is a simple minimal person example:

<source lang=html4strict>
<a class="h-card" href="http://example.com">Joe Bloggs</a>
</source>

Parsed JSON:
<source lang=javascript>
{
"items": [
{
"type": [
"h-card"
],
"properties": {
"name": [
"Joe Bloggs"
],
"url": [
"http://example.com"
]
}
}
]
}
</source>

And a slightly more complete example:

<source lang=html4strict>

<img class="u-photo" src="http://example.org/photo.png" alt="" />
<a class="p-name u-url" href="http://example.org">Joe Bloggs</a>
<a class="u-email" href="mailto:joebloggs@example.com">joebloggs@example.com</a>,
17 Austerstræti
Reykjavík
Iceland

</source>

Parsed JSON:
<source lang=javascript>
{
"items": [
{
"type": [
"h-card"
],
"properties": {
"photo": [
"http://example.org/photo.png"
],
"name": [
"Joe Bloggs"
],
"url": [
"http://example.org"
],
"email": [
"mailto:joebloggs@example.com"
],
"street-address": [
"17 Austerstræti"
],
"locality": [
"Reykjavík"
],
"country-name": [
"Iceland"
]
}
}
]
}
</source>

Nested h-card example

<source lang=html4strict>
<div class="h-card">
<a class="p-name u-url"
href="http://blog.lizardwrangler.com/"
>Mitchell Baker</a>
(<a class="p-org h-card"
href="http://mozilla.org/"
>Mozilla Foundation</a>)
</div>
</source>

Parsed JSON:
<source lang=javascript>
{
"items": [{
"type": ["h-card"],
"properties": {
"name": ["Mitchell Baker"],
"url": ["http://blog.lizardwrangler.com/"],
"org": [{
"value": "Mozilla Foundation",
"type": ["h-card"],
"properties": {
"name": ["Mozilla Foundation"],
"url": ["http://mozilla.org/"]
}
}]
}
}]
}
</source>

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.

=== Get started ===
The class '''<code>h-card</code>''' is a ''root class name'' that indicates the presence of an h-card.

For minimal examples where at most <code>p-name</code>, <code>u-url</code> and <code>u-photo</code> are required (such as the first given above), only the root class name is needed — see [[microformats-2-implied-properties|implied properties]].

For more complex examples, the root class name must be placed on an element which encloses all the desired properties, and then the properties themselves marked up using the classnames given below.

See [[microformats2-parsing]] to learn more about property classnames.

== Properties ==
h-card properties, inside an element with class '''h-card''':
* '''<code>p-name</code>''' - The full/formatted name of the person or organisation
* '''<code>p-honorific-prefix</code>''' - e.g. Mrs., Mr. or Dr.
* '''<code>p-given-name</code>''' - given (often first) name
* '''<code>p-additional-name</code>''' - other/middle name
* '''<code>p-family-name</code>''' - family (often last) name
* '''<code>p-sort-string</code>''' - string to sort by
* '''<code>p-honorific-suffix</code>''' - e.g. Ph.D, Esq.
* '''<code>p-nickname</code>''' - nickname/alias/handle
* '''<code>u-email</code>''' - email address
* '''<code>u-logo</code>''' - a logo representing the person or organisation
* '''<code>u-photo</code>'''
* '''<code>u-url</code>''' - home page
* '''<code>u-uid</code>''' - universally unique identifier, typically canonical URL
* '''<code>p-category</code>''' - category/tag
* '''<code>p-adr</code>''' - postal address, optionally embed an [[h-adr]] {{main|h-adr}}
* '''<code>p-post-office-box</code>'''
* '''<code>p-extended-address</code>''' - apartment/suite/room name/number if any
* '''<code>p-street-address</code>''' - street number + name
* '''<code>p-locality</code>''' - city/town/village
* '''<code>p-region</code>''' - state/county/province
* '''<code>p-postal-code</code>''' - postal code, e.g. US ZIP
* '''<code>p-country-name</code>''' - country name
* '''<code>p-label</code>'''
* '''<code>p-geo</code>''' or '''<code>u-geo</code>''', optionally embed an [[h-geo]] {{main|h-geo}}
* '''<code>p-latitude</code>''' - decimal latitude
* '''<code>p-longitude</code>''' - decimal longitude
* '''<code>p-altitude</code>''' - decimal altitude
* '''<code>p-tel</code>''' - telephone number
* '''<code>p-note</code>''' - additional notes
* '''<code>dt-bday</code>''' - birth date
* '''<code>u-key</code>''' - cryptographic public key e.g. SSH or GPG
* '''<code>p-org</code>''' - affiliated organization, optionally embed an [[h-card]]
* '''<code>p-job-title</code>''' - job title, previously 'title' in [[hCard]], disambiguated.
* '''<code>p-role</code>''' - description of role
* '''<code>u-impp</code>''' per RFC4770, new in vCard4 (RFC 6350)
* '''<code>p-sex</code>''' - biological sex, new in vCard4 (RFC 6350)
* '''<code>p-gender-identity</code>''' - gender identity, new in vCard4 (RFC 6350)
* '''<code>dt-anniversary</code>'''

All properties are optional.

== Status ==
'''h-card''' is a microformats.org draft specification. Public discussion on h-card takes place on [[h-card-feedback]] and the #microformats [[irc]] channel on irc.freenode.net.

h-card is ready to use and implemented in the wild, but for backwards compatibility you should also mark up top-level h-cards as classic [[hCard]]s.

== Property Details ==
(stub, to be expanded)

=== p-adr ===
<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>
<div class="h-card">
Joe Bloggs

17 Austerstræti
Reykjavík
Iceland

</div>
</source>

Q: Why would you use "p-adr" to cluster associated structured address properties?

A: Because if you have more than one structured address, it helps to cluster which properties go with which address, e.g. home vs. work.

=== p-tel ===
Note: use of 'value' within 'p-tel' should be automatically handled by the support of the [[value-class-pattern]]. And for now, the former [[hCard]] 'type' subproperty of 'tel' is dropped/ignored. If there is demonstrable documented need for additional tel types (e.g. fax), we can introduce new flat properties as needed (e.g. p-tel-fax).

=== Reserved properties ===
Reserved properties (not used much, if at all, in practice):

* '''<code>p-organization-name</code>'''
* '''<code>p-organization-unit</code>'''
* '''<code>p-tz</code>''' - timezone offset, e.g. <code><data class="p-tz" value="-0800">PST</data></code>
* '''<code>dt-rev</code>'''

== Examples in the wild ==
Real world in the wild examples:

* ... add uses of h-card you see in the wild here.
* 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])
* Ben Werdmuller marks up his homepage and posts with h-card [http://werd.io/view/51d5097fbed7ded0633a5956 example])
* 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://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://www.w3.org/conf/ W3Conf 2013] uses h-card for all the event speakers and notable attendees. The h-cards make particularly good use of implied name, url, and photo properties.
* [http://wordpress.org/extend/themes/sempress SemPress] is a WordPress theme that supports h-card, h-feed/h-entry and h-as-*
* [http://the-pastry-box-project.net/ The Pastry Box Project] use h-card markup on their homepage and individual thoughts pages
* Tom Morris uses h-card and [[XFN]] to markup [http://tommorris.org/pages/blogroll his blogroll].
* Aaron Parecki uses h-card to markup both authorship and references to people in his notes permalinks, e.g. [http://aaronparecki.com/2012/230/reply/1 2012/230/reply/1].
* [http://tantek.com/ Tantek Çelik] uses h-card on his home page as well as within [[h-entry]]s on permalink pages to indicate authorship.
* [http://waterpigs.co.uk/ Barnaby Walters] uses h-card on his home page, as well as within h-entries for notes and articles, both to indicate authorship and also when mentioning people within the body of the notes.
* [http://tantek.com/presentations/2012/06/microformats microformats.org at 7 years] presentation with and h-card markup for people and organizations.
* [http://tantek.com/presentations/2012/06/pdf2012-indieweb.html Rise of the Indie Web hCards] (from Personal Democracy Forum 2012 #pdf12 #pdf2012) has [[microformats2]] h-card markup
* WebMaker by Mozilla has [[microformats2]] h-card on event search (e.g. [https://webmaker.org/en-US/events/near/?lat=45.5234515&lng=-122.6762071 search near Portland Oregon]) and event pages (e.g. [https://webmaker.org/en-US/events/192f56eb9/ IndieWebCamp 2012]).[https://twitter.com/microformats/status/212207925643587585]
* WebFWD by Mozilla has [[microformats2]] h-card markup on [https://webfwd.org/about/experts/ experts] and [https://webfwd.org/about/team/ team] pages
* [http://indiewebcamp.com IndieWebCamp] has [[microformats2]] h-event markup with embedded h-cards for the organizers and the location.
* [https://wiki.mozilla.org/Events Mozilla Events] page has [[microformats2]] h-event markup with attendees marked up with h-card.
* [https://tristanthomas.me Tristan Thomas] uses h-card on his home page
* [https://workfrom.co/ Workfrom.co] renders h-cards for venues (e.g. [https://workfrom.co/palio-dessert-and-espresso-house])

=== offline ===
* spreadly marks up share permalink pages with minimal h-cards inside h-entry ([http://my.spread.ly/share/51d570bc09e9486562000002 example])

== Validating ==
* '''[http://indiewebify.waterpigs.co.uk/validate-h-card/ indiewebify.me h-card validator]''' parses [[h-card]] markup and makes suggestions for things to add, with code samples
{{h-spec-section-validating}}

== Backward Compatibility ==
=== Publisher Compatibility ===
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>

Joe Bloggs,
Awesome Nonprofit
...

</source>

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

'''fn''', '''org''', and all the other backward compatibility hCard property class names are listed below.

=== Parser Compatibility ===
Microformats parsers {{should}} detect classic properties only if a classic root class name is found and parse them as microformats2 properties.

If an "h-card" is found, don't look for a "vcard" on the same element.

Compat. root class name: <code id="vcard">vcard</code> 
Properties: (parsed as '''p-''' plain text unless otherwise specified)
* <code>fn</code> - parse as '''<code>p-name</code>'''
* <code>honorific-prefix</code>
* <code>given-name</code>
* <code>additional-name</code>
* <code>family-name</code>
* <code>honorific-suffix</code>
* <code>nickname</code>
* <code>email</code> - parse as '''u-'''
* <code>logo</code> - parse as '''u-'''
* <code>photo</code> - parse as '''u-'''
* <code>url</code> - parse as '''u-'''
* <code>uid</code> - parse as '''u-'''
* <code>category</code>
* <code>adr</code> - parse as '''<code>p-adr h-adr</code>''' including compat root class <code>adr</code>
* <code>extended-address</code>
* <code>street-address</code>
* <code>locality</code>
* <code>region</code>
* <code>postal-code</code>
* <code>country-name</code>
* <code>label</code>
* <code>geo</code> - parse as '''<code>p-geo h-geo</code>''' including compat root class <code>geo</code>
* <code>latitude</code>
* <code>longitude</code>
* <code>tel</code>
* <code>note</code>
* <code>bday</code> - parse as '''dt-'''
* <code>key</code> - parse as '''u-'''
* <code>org</code>
* <code>organization-name</code>
* <code>organization-unit</code>
* <code>title</code> - parse as '''p-job-title'''
* <code>role</code>

Reserved: (backward compat properties that parsers {{may}} implement, if they do, they {{must}} implement in this way:
* <code>tz</code>
* <code>rev</code> - parse as '''dt-'''

== Background ==
This work is based on the existing [[hCard]] and [[vcard]] specifications.

== Design Principles ==

(stub, expand)

== Additions ==
We've tried very hard with h-card to stay compatible with vCard4, and thus additions should be proposed on the vCard4 mailing list.

However, you may still use this wiki to capture additions for h-card here:
* [[h-card-brainstorming]]

== See Also ==
* [[microformats2]]
* [[microformats2-parsing]]
* [[h-adr]]
* [[h-geo]]
* [[hCard]]

[[Category:Draft Specifications]]

hcards-and-pages

2009-10-08T16:38:10Z

Nick: Clarified mainly that author is content author, not page author.

<h1>hCards and pages</h1>

Web pages often represent people, are written by people, owned by people, and/or have a point of contact (for maintenance or other issues).

While these are often the same person, they can be (and sometimes are) different people, and thus it is useful to document these distinctions.

== hCards for pages ==

=== represent ===
[[hCard]] is very often used to markup user profile pages. See [[hcard-supporting-user-profiles]] for many example user profiles, often on social networking sites, marked up with hCard.

Such profile pages ''represent'' a person, and thus the use of hCard to markup that person is called a ''representative hCard''. See the [[representative hCard]] page for more details on how to markup such hCards differently from other hCards on the page, and how to find and parse representative hCards.

=== contact ===
The person a page represents is usually the person to contact for/about the page. As [[hcard-faq#Should_I_use_ADDRESS_for_hCards|documented in the hCard FAQ]], the contact for a page {{should}} be marked up with an <code><address></code> hCard.

There are numerous cases of pages that represent one person but have a different contact, or perhaps no explicit contact at all.

For example, Wikipedia has numerous biography pages which represent individuals, but obviously (given Wikipedia's editing/maintenance conventions) those individuals are not the contacts for their biography pages. The most obvious example of this are biographies of deceased individuals who clearly cannot be a contact for such pages, e.g. [http://en.wikipedia.org/wiki/Carl_Sagan Carl Sagan].

In such cases, only the ''contact'' for the page should be marked up with the <code><address></code> element, and certainly ''not'' the representative hCard (if any).

If there is no contact for the page, then there should be no <code><address></code> element on the page (or perhaps an empty <code><address></code> element may be an acceptable way of explicitly indicating that there is no contact for the page).

=== author ===
''Author'' means 'content author', not 'page author' (as those terms are often used in Web design work). For 'page author', see [[hcards-and-pages#contact|''contact'']].

The person that a page represents may or may not also be the author of the page. Possible (theoretical until someone finds/cites real world) examples of not being the same include biographies, viz., the content representing person A is authored by person B.

* Common misconception: ''"[http://microformats.org/discuss/mail/microformats-discuss/2007-July/010170.html using <address> works when the person is the principal author of the page]"''. This is misleading at best. It may "work", but <code><address></code> means contact for the page (as documented above), not necessarily the author. The two might coincidentally (even typically) be the same, but are not semantically equivalent.

=== owner ===
Often the person that a page represents is also the person that owns (meaning has primary control over or decision-making authority about) the page.

Though clearly it is possible to have one person own a page (perhaps the manager of the website), and yet have another person be the contact for the page (perhaps a system administrator or webmaster).

== implementations ==

[http://buzzword.org.uk/cognition/ Cognition] is able to determine the representative and contact hCard(s) for a page, using algorithms similar to those described on this page. The author hCard can be specified by assigning an <code>id</code> attribute to the hCard root element and linking to that fragment identifier using <code>rel="author"</code> or <code>rev="made"</code>.

== related pages ==
* [[hCard]]
* [[representative-hcard]]
* [[hcard-brainstorming]]
* [[hcard-supporting-user-profiles]]
* [[hatom-issues#misuse_of_address_element|hAtom issues: misuse of address element]]