m (r) |
(editorial: drop explicit HTML5 from dfn, unnecessary) |
||
(39 intermediate revisions not shown.) | |||
Line 1: | Line 1: | ||
- | # | + | <entry-title>h-event</entry-title> |
+ | <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. | ||
+ | |||
+ | 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 [[h-event-issues|feedback]]. | ||
+ | ;Participate | ||
+ | :[https://github.com/microformats/h-event/issues Open Issues] | ||
+ | :[[IRC]]: [irc://irc.freenode.net/microformats #microformats on Freenode] | ||
+ | <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}} | ||
+ | __TOC__ | ||
+ | |||
+ | == Example == | ||
+ | Here is a simple event example: | ||
+ | |||
+ | <source lang=html4strict> | ||
+ | <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> | ||
+ | </source> | ||
+ | |||
+ | Parsed JSON: | ||
+ | <source lang=javascript> | ||
+ | { | ||
+ | "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." | ||
+ | ] | ||
+ | } | ||
+ | } | ||
+ | ] | ||
+ | } | ||
+ | </source> | ||
+ | |||
+ | === Get started === | ||
+ | The class '''<code>h-event</code>''' 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''': | ||
+ | * '''<code>p-name</code>''' - event name (or title) | ||
+ | * '''<code>p-summary</code>''' - short summary of the event | ||
+ | * '''<code>dt-start</code>''' - datetime the event starts | ||
+ | * '''<code>dt-end</code>''' - datetime the event ends | ||
+ | * '''<code>dt-duration</code>''' - duration of the event | ||
+ | * '''<code>p-description</code>''' - more detailed description of the event | ||
+ | * '''<code>u-url</code>''' - permalink for the event | ||
+ | * '''<code>p-category</code>''' - event category(ies)/tag(s) | ||
+ | * '''<code>p-location</code>''' - where the event takes place, optionally embedded [[h-card]], [[h-adr]], or [[h-geo]] | ||
+ | Experimental properties currently in use in the wild but not (yet) part of the official h-entry spec: | ||
+ | * '''<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> | ||
+ | |||
+ | All properties are optional. | ||
+ | |||
+ | == Status == | ||
+ | '''h-event''' is a microformats.org draft specification. Public discussion on h-event takes place on [[h-event-feedback]] and the #microformats [[irc]] channel on irc.freenode.net. | ||
+ | |||
+ | h-event is ready to use and implemented in the wild, but for backwards compatibility you should also mark h-events up as classic [[hCalendar]] events. | ||
+ | |||
+ | == Property Details == | ||
+ | (stub, to be expanded) | ||
+ | |||
+ | === p-location === | ||
+ | <code>p-location</code> is typically a physical address, optionally marked up with [[h-adr]], for example: | ||
+ | |||
+ | <source lang=html4strict> | ||
+ | <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> | ||
+ | </source> | ||
+ | |||
+ | === 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 == | ||
+ | Real world in the wild examples: | ||
+ | |||
+ | * ... 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> | ||
+ | |||
+ | See [[microformats2#Examples_in_the_wild|microformats2 examples in the wild]] for more | ||
+ | |||
+ | == Validating == | ||
+ | {{h-spec-section-validating}} | ||
+ | |||
+ | == 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: | ||
+ | |||
+ | <source lang=html4strict> | ||
+ | <div class="h-event vevent"> | ||
+ | <h1 class="p-name summary">Some great event</h1> | ||
+ | </div> | ||
+ | </div> | ||
+ | </source> | ||
+ | |||
+ | === 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 == | ||
+ | This work is based on the existing [[hCalendar]] and [[iCalendar]] specifications. | ||
+ | |||
+ | == Design Principles == | ||
+ | (stub, expand) | ||
+ | |||
+ | == See Also == | ||
+ | * [[h-calendar-to-do]] | ||
+ | * [[microformats2]] | ||
+ | * [[microformats2-parsing]] | ||
+ | * [[h-adr]] | ||
+ | * [[h-geo]] | ||
+ | * [[h-card]] | ||
+ | * [[hCalendar]] | ||
+ | * [[h-entry]]s can be RSVPs to events, using the p-rsvp property | ||
+ | |||
+ | [[Category:Draft Specifications]] |
Revision as of 21:38, 3 August 2017
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: #microformats on Freenode
- 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 2019-02-21, the editors have made this specification available under the Open Web Foundation Agreement Version 1.0.
Contents |
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 event -
dt-start
- datetime the event starts -
dt-end
- datetime the event ends -
dt-duration
- duration of the event -
p-description
- more detailed description of the event -
u-url
- permalink for the event -
p-category
- event category(ies)/tag(s) -
p-location
- where the event takes place, optionally embedded h-card, h-adr, or h-geo
Experimental properties currently in use in the wild but not (yet) part of the official h-entry 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)
All properties are optional.
Status
h-event is a microformats.org draft specification. Public discussion on h-event takes place on h-event-feedback and the #microformats irc channel on irc.freenode.net.
h-event is ready to use and implemented in the wild, but for backwards compatibility you should also mark h-events up 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:
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"
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
- microformats2
- microformats2-parsing
- h-adr
- h-geo
- h-card
- hCalendar
- h-entrys can be RSVPs to events, using the p-rsvp property