h-event: Difference between revisions
(Initial dump from mf2 page) |
GRegorLove (talk | contribs) m (s/<source>/<syntaxhighlight>/) |
||
(55 intermediate revisions by 13 users not shown) | |||
Line 1: | Line 1: | ||
{{DISPLAYTITLE:h-event}} | |||
<dfn style="font-style:normal;font-weight:bold">h-event</dfn> is a simple, open format for events on the web. h-event is often used with both event listings and individual event pages. h-event is one of several open [[microformats|microformat]] draft standards suitable for embedding data in HTML. | |||
<dfn style="font-style:normal;font-weight:bold">h-event</dfn> is a simple, open format for | |||
h-event is the [[microformats- | h-event is the [[microformats2]] update to [[hCalendar]]. | ||
;<span id="status">Status</span> | |||
:This is a '''Living Specification''' yet mature enough to encourage additional implementations and [https://github.com/microformats/h-event/issues feedback]. | |||
;<span id="participate">Participate</span> | |||
:[https://github.com/microformats/h-event/issues Open Issues] | |||
:[[IRC]] | |||
:Advance the spec by contributing to a consensus in [https://github.com/microformats/h-event/issues/1 issue: adopt same change control as h-entry] | |||
<div class="p-author h-card vcard"> | |||
;<span class="p-role role">Editor</span> | |||
:<span class="p-name fn">[[User:Tantek|Tantek Çelik]]</span> | |||
</div> | |||
;License | |||
: {{cc0-owfa-license}} | |||
<span style="float:right">__TOC__</span> | |||
== Example == | == Example == | ||
Here is a simple event example: | Here is a simple event example: | ||
< | <syntaxhighlight lang="html"> | ||
<div class="h-event"> | <div class="h-event"> | ||
<h1 class="p-name">Microformats Meetup</h1> | <h1 class="p-name">Microformats Meetup</h1> | ||
<p>From <time class="dt-start" datetime="2013-06-30 12 | <p>From | ||
<time class="dt-start" datetime="2013-06-30 12:00">30<sup>th</sup> June 2013, 12:00</time> | |||
to <time class="dt-end" datetime="2013-06-30 18:00">18:00</time> | |||
at <span class="p-location">Some bar in SF</span></p> | |||
<p class="summary">Get together and discuss all things | <p class="p-summary">Get together and discuss all things microformats-related.</p> | ||
</div> | </div> | ||
</ | </syntaxhighlight> | ||
Parsed JSON: | |||
<syntaxhighlight lang="json"> | |||
{ | |||
"items": [ | |||
{ | |||
"type": [ | |||
"h-event" | |||
], | |||
"properties": { | |||
"name": [ | |||
"Microformats Meetup" | |||
], | |||
"start": [ | |||
"2013-06-30 12:00:00" | |||
], | |||
"end": [ | |||
"2013-06-30 18:00:00" | |||
], | |||
"location": [ | |||
"Some bar in SF" | |||
], | |||
"summary": [ | |||
"Get together and discuss all things microformats-related." | |||
] | |||
} | |||
} | |||
] | |||
} | |||
</syntaxhighlight> | |||
=== Get started === | === Get started === | ||
The class '''<code>h-event</code>''' is a ''root class name'' that indicates the presence of an h-event. | The class '''<code>h-event</code>''' is a ''root class name'' that indicates the presence of an h-event. | ||
'''p-name''', '''p- | '''p-name''', '''dt-start''', '''dt-end''', '''p-location''', '''p-summary''', and the other h-event property class names listed below define ''properties'' of the h-event. | ||
See [[ | See [[microformats2-parsing]] to learn more about property class names. | ||
== Properties == | == Properties == | ||
h-event properties, inside an element with class '''h-event''': | |||
* '''<code>p-name</code>''' - event name (or title) | |||
* '''<code>p-name</code>''' - event name | |||
* '''<code>p-summary</code>''' - short summary of the event | * '''<code>p-summary</code>''' - short summary of the event | ||
* '''<code>dt-start</code>''' - datetime the event starts | * '''<code>dt-start</code>''' - datetime the event starts | ||
* '''<code>dt-end</code>''' - datetime the event ends | * '''<code>dt-end</code>''' - datetime the event ends | ||
* '''<code>dt-duration</code>''' - | * '''<code>dt-duration</code>''' - duration of the event | ||
* '''<code>p-description</code>''' - | * '''<code>p-description</code>''' - more detailed description of the event | ||
* '''<code>u-url</code>''' - | ** '''WARNING:''' Proposed to be replaced by '''<code>e-content</code>''' (re-used from [[h-entry]]) | ||
** See and follow-up: https://github.com/microformats/h-event/issues/3 | |||
* '''<code>u-url</code>''' - permalink for the event | |||
* '''<code>p-category</code>''' - event category(ies)/tag(s) | * '''<code>p-category</code>''' - event category(ies)/tag(s) | ||
* '''<code>p-location</code>''' - where the event takes place, optionally | * '''<code>p-location</code>''' - where the event takes place, optionally embedded [[h-card]], [[h-adr]], or [[h-geo]] | ||
All properties are optional. | |||
=== Experimental Properties === | |||
These properties are currently in use in the wild but not (yet) part of the draft h-event spec: | |||
* '''<code>p-attendee</code>''' - a person attending the event, optionally a | * '''<code>p-attendee</code>''' - a person attending the event, optionally embed [[h-card]] | ||
<div class="discussion"> | |||
* This draft has not been updated in almost 2 years. During this period, <code>h-entry</code> <code>p-rsvp</code> has been standardised, thus making it robust and mature enough for the addition. I guess it's about time to unlabel <code>p-attendee</code> as experimental. | |||
** I've filed https://github.com/microformats/h-event/issues/2 to track advancing this draft as a whole. Let's do that with the existing draft before discussing p-attendee in particular. And rather than guessing, take a look at the vocabulary maturity levels in h-entry and perhaps help evaluate (in another issue) p-attendee according to those criteria. [[User:Tantek|Tantek]] 01:10, 28 February 2017 (UTC) | |||
* I would also suggest to extend expected value to [[h-entry]], so that, while the personal info can be preserved, the attendee can also support p-rsvp property of h-entry. | |||
** I don't understand this. p-attendee is supposed to represent a person, e.g. an [[h-card]]. How would it having that be an [[h-entry]] make sense and work (from a publishing and consuming code perspective)? This proposed extension to p-attendee may be worth its own issue as well. [[User:Tantek|Tantek]] 01:10, 28 February 2017 (UTC) | |||
</div> | |||
* '''<code>p-organizer</code>''' - a person organizing an event, optionally embedded [[h-card]]. Used in Indieweb events, but not consumed. https://github.com/microformats/h-event/issues/10 | |||
* '''<code>u-rsvp</code>''' - similar to the proposed u-comment on h-entry, this would be the proposed property to mark up displayed RSVPs on an h-event. https://github.com/microformats/h-event/issues/9 | |||
== Status == | == Status == | ||
'''h-event''' is a microformats.org draft specification. Public discussion on h-event takes place on [[ | '''h-event''' is a microformats.org draft specification. Public discussion on h-event takes place on the [[irc|#microformats channel on irc.freenode.net]] ([https://chat.indieweb.org/microformats view recent discussions]), and specific issues [https://github.com/microformats/h-event/issues may be filed on GitHub]. | ||
h-event is ready to use and implemented in the wild | h-event is ready to use and implemented in the wild. For backwards compatibility you should also mark up top-level h-events as classic [[hCalendar]] events. | ||
== Property Details == | == Property Details == | ||
(stub, to be expanded) | (stub, to be expanded) | ||
<code>p-location</code> is | === p-location === | ||
<code>p-location</code> is typically a physical address, optionally marked up with [[h-adr]], for example: | |||
< | <syntaxhighlight lang="html"> | ||
<p class="p- | <p class="p-location h-adr"> | ||
<span class="p-street-address">17 Austerstræti</span> | <span class="p-street-address">17 Austerstræti</span> | ||
<span class="p-locality">Reykjavík</span> | <span class="p-locality">Reykjavík</span> | ||
<span class="p-country-name">Iceland</span> | <span class="p-country-name">Iceland</span> | ||
</p> | </p> | ||
</ | </syntaxhighlight> | ||
=== Reserved Properties === | |||
Reserved properties: | |||
* '''<code>p-organizer</code>''' - a person (co-)organizing the event, optionally embed [[h-card]] {{main|h-card}} | |||
** proposed as way to [https://github.com/snarfed/bridgy/issues/275 implement copying an event organizer to Eventbrite] | |||
== Examples in the wild == | == Examples in the wild == | ||
Line 70: | Line 127: | ||
* ... add uses of h-event you see in the wild here. | * ... add uses of h-event you see in the wild here. | ||
* [http://www.w3.org/conf/ W3Conf 2013] uses h-event for the main event, and h-card for all the speakers and notable attendees. The h-cards make particularly good use of implied name, url, and photo properties. | |||
* [http://tantek.com/ Tantek Çelik] uses h-event on his home page | |||
* [http://tantek.com/presentations/2012/06/microformats microformats.org at 7 years] presentation with h-event | |||
* [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-event and h-card markup | |||
* WebMaker by Mozilla has h-event and 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] | |||
* [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://gregorlove.com/events has h-event markup, for example: https://gregorlove.com/2017/06/homebrew-website-club/ | |||
** has additional property from [[h-entry]]: <code>dt-published</code> | |||
* https://oauth.net/events/ has a list of h-event marked up events relating to OAuth, both future and past | |||
* http://68middle.st/events has events marked up in h-event | |||
* [https://www.gov.uk/government/publications/open-standards-for-government/exchange-of-calendar-events gov.uk] mentions that iCalendar can be translated into h-event microformats in their "Exchange of calendar events" guidance. | |||
<blockquote>You can map events to and from iCalendar from other formats, such as h-event.</blockquote> | |||
See [[microformats2#Examples_in_the_wild|microformats2 examples in the wild]] for more | |||
== Validating == | |||
{{h-spec-section-validating}} | |||
== Implementations == | |||
Software implementations that publish or consume h-event, including themes, plugins, or extensions: | |||
When adding an implementation, please provide and link to its home page and open source repo if any. | |||
* [https://github.com/gRegorLove/mf2-to-iCalendar mf2 to iCalendar]: Convert microformats h-event to iCalendar. Example: https://gregorlove.com/calendar/ | |||
== Backward Compatibility == | |||
=== Publisher Compatibility === | |||
For backward compatibility, you may wish to use classic [[hCalendar]] classnames in addition to the more future-proof h-event properties, for example: | |||
<syntaxhighlight lang="html"> | |||
<div class="h-event vevent"> | |||
<h1 class="p-name summary">Some great event</h1> | |||
</div> | |||
</div> | |||
</syntaxhighlight> | |||
=== 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-event" is found, don't look for a "vevent" on the same element. | |||
Compat root class name: <code id="vevent">vevent</code><br/> | |||
Properties: (parsed as '''p-''' plain text unless otherwise specified) | |||
* <code>summary</code> - parse as '''<code>p-name</code>''' | |||
* <code>dtstart</code> - parse as '''<code>dt-start</code>''' | |||
* <code>dtend</code> - parse as '''<code>dt-end</code>''' | |||
* <code>duration</code> - parse as '''<code>dt-duration</code>''' | |||
* <code>description</code> | |||
* <code>url</code> - parse as '''u-''' | |||
* <code>category</code> | |||
* <code>location</code> - including compat root <code>vcard</code> in the absence of <code>h-card</code>, and compat root <code>adr</code> in the absence of <code>h-adr</code> | |||
* <code>geo</code> - parse as '''<code>p-location h-geo</code>''' including compat root <code>geo</code> | |||
=== iCalendar Compatibility === | |||
hCalendar-specific implementations that perform custom display or translation to iCalendar .ics {{should}} prefer <code>p-name</code> over <code>p-summary</code>, and use <code>p-summary</code> value(s) as a fallback if there is no <code>p-name</code>. | |||
== Background == | == Background == | ||
This work is based on the existing [[ | This work is based on the existing [[hCalendar]] and [[iCalendar]] specifications. | ||
== Design Principles == | == Design Principles == | ||
(stub, expand) | (stub, expand) | ||
== See Also == | == See Also == | ||
* [[h-calendar-to-do]] | |||
* [[ | * [[h-event-brainstorming]] | ||
* [[ | * [[microformats2]] | ||
* [[microformats2-parsing]] | |||
* [[h-adr]] | * [[h-adr]] | ||
* [[h-geo]] | * [[h-geo]] | ||
* [[h-card]] | * [[h-card]] | ||
* [[hCalendar]] | * [[hCalendar]] | ||
* [[h-entry]]s can be RSVPs to events, using the p-rsvp property | |||
[[Category:Draft Specifications]] | [[Category:Draft Specifications]] |
Latest revision as of 21:18, 26 July 2023
h-event is a simple, open format for events on the web. h-event is often used with both event listings and individual event pages. h-event is one of several open microformat draft standards suitable for embedding data in HTML.
h-event is the microformats2 update to hCalendar.
- Status
- This is a Living Specification yet mature enough to encourage additional implementations and feedback.
- Participate
- Open Issues
- IRC
- Advance the spec by contributing to a consensus in issue: adopt same change control as h-entry
- License
- Per CC0, to the extent possible under law, the editors have waived all copyright and related or neighboring rights to this work. In addition, as of 2024-11-21, the editors have made this specification available under the Open Web Foundation Agreement Version 1.0.
Example
Here is a simple event example:
<div class="h-event">
<h1 class="p-name">Microformats Meetup</h1>
<p>From
<time class="dt-start" datetime="2013-06-30 12:00">30<sup>th</sup> June 2013, 12:00</time>
to <time class="dt-end" datetime="2013-06-30 18:00">18:00</time>
at <span class="p-location">Some bar in SF</span></p>
<p class="p-summary">Get together and discuss all things microformats-related.</p>
</div>
Parsed JSON:
{
"items": [
{
"type": [
"h-event"
],
"properties": {
"name": [
"Microformats Meetup"
],
"start": [
"2013-06-30 12:00:00"
],
"end": [
"2013-06-30 18:00:00"
],
"location": [
"Some bar in SF"
],
"summary": [
"Get together and discuss all things microformats-related."
]
}
}
]
}
Get started
The class h-event
is a root class name that indicates the presence of an h-event.
p-name, dt-start, dt-end, p-location, p-summary, and the other h-event property class names listed below define properties of the h-event.
See microformats2-parsing to learn more about property class names.
Properties
h-event properties, inside an element with class h-event:
p-name
- event name (or title)p-summary
- short summary of the eventdt-start
- datetime the event startsdt-end
- datetime the event endsdt-duration
- duration of the eventp-description
- more detailed description of the event- WARNING: Proposed to be replaced by
e-content
(re-used from h-entry) - See and follow-up: https://github.com/microformats/h-event/issues/3
- WARNING: Proposed to be replaced by
u-url
- permalink for the eventp-category
- event category(ies)/tag(s)p-location
- where the event takes place, optionally embedded h-card, h-adr, or h-geo
All properties are optional.
Experimental Properties
These properties are currently in use in the wild but not (yet) part of the draft h-event spec:
p-attendee
- a person attending the event, optionally embed h-card
- This draft has not been updated in almost 2 years. During this period,
h-entry
p-rsvp
has been standardised, thus making it robust and mature enough for the addition. I guess it's about time to unlabelp-attendee
as experimental.- I've filed https://github.com/microformats/h-event/issues/2 to track advancing this draft as a whole. Let's do that with the existing draft before discussing p-attendee in particular. And rather than guessing, take a look at the vocabulary maturity levels in h-entry and perhaps help evaluate (in another issue) p-attendee according to those criteria. Tantek 01:10, 28 February 2017 (UTC)
- I would also suggest to extend expected value to h-entry, so that, while the personal info can be preserved, the attendee can also support p-rsvp property of h-entry.
- I don't understand this. p-attendee is supposed to represent a person, e.g. an h-card. How would it having that be an h-entry make sense and work (from a publishing and consuming code perspective)? This proposed extension to p-attendee may be worth its own issue as well. Tantek 01:10, 28 February 2017 (UTC)
p-organizer
- a person organizing an event, optionally embedded h-card. Used in Indieweb events, but not consumed. https://github.com/microformats/h-event/issues/10u-rsvp
- similar to the proposed u-comment on h-entry, this would be the proposed property to mark up displayed RSVPs on an h-event. https://github.com/microformats/h-event/issues/9
Status
h-event is a microformats.org draft specification. Public discussion on h-event takes place on the #microformats channel on irc.freenode.net (view recent discussions), and specific issues may be filed on GitHub.
h-event is ready to use and implemented in the wild. For backwards compatibility you should also mark up top-level h-events as classic hCalendar events.
Property Details
(stub, to be expanded)
p-location
p-location
is typically a physical address, optionally marked up with h-adr, for example:
<p class="p-location h-adr">
<span class="p-street-address">17 Austerstræti</span>
<span class="p-locality">Reykjavík</span>
<span class="p-country-name">Iceland</span>
</p>
Reserved Properties
Reserved properties:
p-organizer
- a person (co-)organizing the event, optionally embed h-cardMain article: h-card- proposed as way to implement copying an event organizer to Eventbrite
Examples in the wild
Real world in the wild examples:
- ... add uses of h-event you see in the wild here.
- W3Conf 2013 uses h-event for the main event, and h-card for all the speakers and notable attendees. The h-cards make particularly good use of implied name, url, and photo properties.
- Tantek Çelik uses h-event on his home page
- microformats.org at 7 years presentation with h-event
- Rise of the Indie Web hCards (from Personal Democracy Forum 2012 #pdf12 #pdf2012) has microformats2 h-event and h-card markup
- WebMaker by Mozilla has h-event and h-card on event search (e.g. search near Portland Oregon) and event pages (e.g. IndieWebCamp 2012).[1]
- IndieWebCamp has microformats2 h-event markup with embedded h-cards for the organizers and the location.
- Mozilla Events page has microformats2 h-event markup with attendees marked up with h-card.
- https://gregorlove.com/events has h-event markup, for example: https://gregorlove.com/2017/06/homebrew-website-club/
- has additional property from h-entry:
dt-published
- has additional property from h-entry:
- https://oauth.net/events/ has a list of h-event marked up events relating to OAuth, both future and past
- http://68middle.st/events has events marked up in h-event
- gov.uk mentions that iCalendar can be translated into h-event microformats in their "Exchange of calendar events" guidance.
You can map events to and from iCalendar from other formats, such as h-event.
See microformats2 examples in the wild for more
Validating
Test and validate microformats2 markup in general with:
- https://pin13.net/mf2/ - enter your markup directly
- https://pin13.net/ - enter a URL to a page to test where it says "Microformats Parser"
Implementations
Software implementations that publish or consume h-event, including themes, plugins, or extensions:
When adding an implementation, please provide and link to its home page and open source repo if any.
- mf2 to iCalendar: Convert microformats h-event to iCalendar. Example: https://gregorlove.com/calendar/
Backward Compatibility
Publisher Compatibility
For backward compatibility, you may wish to use classic hCalendar classnames in addition to the more future-proof h-event properties, for example:
<div class="h-event vevent">
<h1 class="p-name summary">Some great event</h1>
</div>
</div>
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-event" is found, don't look for a "vevent" on the same element.
Compat root class name: vevent
Properties: (parsed as p- plain text unless otherwise specified)
summary
- parse asp-name
dtstart
- parse asdt-start
dtend
- parse asdt-end
duration
- parse asdt-duration
description
url
- parse as u-category
location
- including compat rootvcard
in the absence ofh-card
, and compat rootadr
in the absence ofh-adr
geo
- parse asp-location h-geo
including compat rootgeo
iCalendar Compatibility
hCalendar-specific implementations that perform custom display or translation to iCalendar .ics SHOULD prefer p-name
over p-summary
, and use p-summary
value(s) as a fallback if there is no p-name
.
Background
This work is based on the existing hCalendar and iCalendar specifications.
Design Principles
(stub, expand)
See Also
- h-calendar-to-do
- h-event-brainstorming
- microformats2
- microformats2-parsing
- h-adr
- h-geo
- h-card
- hCalendar
- h-entrys can be RSVPs to events, using the p-rsvp property