GeezerVisonThe World Wide Web, restored to 800 pixels of glory. |
| Home|About|Gaming cabinet|Archives|How it works|Starter sites |
GeezerVison is showing indieweb.org โ event This article is a stub. You can help the IndieWeb wiki by expanding it with relevant information. ๐ An event is a type of post that in addition to a post name (event title) has a start datetime (likely end datetime), and a location. For information on IndieWebCamp events themselves, see: WhyWhy publish indie eventsYou should post events on your own site to own your events and so your friends with indieweb sites can directly RSVP to you (as well as post invitations to others) without depending on a silo to mediate your event related interactions. Why publish event microformatsIn addition to enabling readers to display your events, and users to RSVP to them, publishing your events with h-event and classic hCalendar may cause them to show up and display in Google Search OneBox and Event Search:
Why POSSE eventsYou should POSSE copies of your events to the silos where your friends without their own indieweb sites keep track of their events and/or calendar. How toHow to markupEvent posts must be marked up with h-event. Example of an h-event with an embedded h-card for the p-location: <div class="h-event">
<p> <a class="u-url p-name" href="https://indieweb.org/2017">IndieWeb Summit</a> </p>
<p> <time class="dt-start" datetime="2017-06-24 09:30">June 24, 2017 9:30am</time> to
<time class="dt-end" datetime="2017-06-25 18:00">June 25, 2017 6:00pm</time> at
<span class="p-location h-card">
<a class="u-url p-name p-org" href="https://wiki.mozilla.org/MozPDX">Mozilla</a>,
<span class="p-street-address">1120 NW Couch St #320</span>,
<span class="p-locality">Portland</span>,
<span class="p-region">Oregon</span>,
<span class="p-postal-code">97209</span>,
<abbr class="p-country-name" title="United States">US</abbr>
</span>
</p>
</div>
How to provide an RSVP UIEvent posts should have webaction buttons for RSVP actions and inviting others. E.g. some subset of:
See Facebook's RSVP UI: How to accept RSVPsA site publishing event posts should accept rsvp webmentions and update the event's attendance information accordingly. See: http://microformats.org/wiki/rsvp How to accept invitationsA site publishing event posts should accept invitation webmentions and update the event's "invited" information accordingly.
IndieWeb ExamplesIn implementation order: Ben Werdmuller
As of 2017-06-14, Ben's event posts have a h-event as the top level item. Aaron Parecki
Jeena
Ryan BarrettRyan Barrett is manually posting events inside article posts on snarfed.org since 2014-01-15. Examples:
gRegor Morrill
Shane Becker
Sebastiaan Andeweg
Calum Ryan
UPDATE 2016-08-06 Since improved with separate events section modeled on Facebook events UI. UPDATE 2019-01-23 Since added similar to HWC London website utilizing Webmention.io for RSVPs loaded through client-side only with a VueJs/axios script
Tantek
Details:
Previously: Prototype event as a note:
More work to do: Falcon#event_posts. Marty McGuire
Martijn van der Ven
The first method is officially deprecated as of 2017-07-15 when the second method became easy to do. Chris Aldrich
With changes in the ability to properly receive facepile RSVPs in WordPress (including yes, no, maybe, and even invited) using the Webmention and Semantic Linkbacks plugins, on 2017-11-30 he began manually marking up events with h-entry top level and secondary h-event markup (a limitation to his WordPress theme) and syndicating copies to silos including Facebook, Meetup, Google+, and Twitter. Bridgy currently allows backfed responses from Twitter, and Google+, though only Facebook RSVPs backfeed properly as Facepiles. Hopefully future updates to the Post Kinds Plugin will automate/preformat some of the microformats markup. Additionally he uses the He's been posting RSVPs to his WordPress site for some time as well, originally doing so manually, but later moving to using Post Kinds functionality when that became a simpler option. Jamie Tanna
Jamie's set up also generates iCalendar feeds for events since 2019-05-22, which allows interested people to add the event to their calendar, so they can see when the next one is more easily. Former ExamplesThe following examples have been offline for some time โ please update them with Internet Archive links if possible for historical purposes! Bret ComnesAs of 2017-06-14 it appears Bret Comnes has implemented events inside of jekyll for bret.io since 2013-07-25. It supports receiving webmentions, but does not parse responses for RSVP status or display reply contexts at the moment. Example:
The event data is stored in the YAML which separates the final layout and the event data. A form is used to assist in creating the event post via prose.io. Kyle MahanKara Mahan added event posting with RSVPs to Red Wind on 2014-12-14. Example:
IndieWeb ItchesThe following people either strongly want to implement events on their site, or are in the process of doing so, you may find some implementation clues in their notes Amy Guy
Staged implementation[2]
Consuming Tools And ServicesQuillQuill (site/service, open source) parses for h-event in particular to:
IndieNewsIndieNews (site/service) parses for h-event differently from h-entry
This Week
mf2utilmf2util (open source python library) parses specifically for h-event vs h-entry to determine post type, and provides cleaned data to applications using it (timestamps get converted to Python types, locations are normalized, ...). An application using this is the IRC bot by Sven Knebel that announces new Indieweb livestreams on #indieweb, which parses /events to determine on which days IWCs happen. mf2 to iCalendarmf2-to-iCalendar is a PHP library that converts h-event markup to iCalendar. BrainstormingAs ideas here are implemented, they should be moved to actual sections of their own with links to examples. Image headerTypical silos event posts (e.g. Facebook, Google+) provide (encourage) the option of an event image - used as a header for the event. This header is used at the top of the event permalink page, and also often shown in an event list view (e.g. on Facebook). Such header images are often quite a good visual/emotional draw for the event. Header images are typically representative of the event, sometimes displayed with the name of the event superimposed on top. If you're posting events, consider providing this option for yourself (in your event posting UI or otherwise as part of your publishing system) as part of your indieweb event posts as well. Since the photo would be deliberately chosen to represent the event, we could extend h-event to represent the photo as well with:
Note that Screenshots needed Map imageSome silos event posts (e.g. Facebook, Plancast) automatically generate a horizontal rectangle map view of the event location. In particular, on event posts, the location is shown *first* as a centered dot in a wide and short rectangle map that shows the local area, and then second underneath as text address. Showing a map and showing it early is both visually striking and instantly provides a sense of "is this near me", or "is this near somewhere I'd like to be or might be anyway". It quickly gives you context in a way that a purely textual address does not. Screenshots needed A horizontal map (banner map?) from a Facebook event:
AttendeesEvent posts should display attendees, RSVPs in general, and invitations. There are two typical existing approaches to displaying RSVPs:
Clusters are typically displayed as facepiles, either entirely, or abbreviated at some fixed number with a method to expand / view the whole set. Time order presentation usually include some text about the RSVP, e.g. "is going", "is attending" Silo AttendeesEvery event silo by default shows who else is has RSVPed that yes they're going, and more so, often first display who you know that's going to the event. Quickly seeing "who else is going" or might go or is invited is a huge sense of context/comfort as well, especially with little face icons. E.g. Facebook clusters (potential) attendees by:
(and declined is typically hidden) More screenshots needed Event attendees on Facebook:
Note the going/maybe/invited sections on FB first show *only* those you know (if any), and *only if* there's no one you know in a section, does the section show 5 icons of others who said they're going/maybe or were invited. In either case, the order of icons is most recently responded/invited first. Public events don't necessarily have a public list of invited users, depending on the system, but nonetheless list attendees. For example, on Plancast:
Plancast only shows invitees on an event to the event organizer, i.e. when the event organizer themselves is looking at the event permalink page. InvitationsMain article: invitation
People like being explicitly invited to events. One way to send invitations with indieweb events is:
The idea is that a person's site's webmentions queue sees webmentions from the event to the home page and interprets that as an invitation to the event due to the special markup (u-invitee h-card) on the link to their site.
Examples: hosting the Homebrew Website Club #SF #IndieWeb meetup tonight 17:30 @MozSF Hope to see you there! Yes you @benwerd @dietrich @generativist @html5cat @NurtureGirl @feross @maira cc #dweb #openweb RSVP: https://tantek.com/2019/233/e1/homebrew-website-club-sf More: https://indieweb.org/events/2019-08-21-homebrew-website-club#San_Francisco https://tantek.com/t5291 โฆ Join us! @benwerd @dietrich @generativist @html5cat @NurtureGirl @feross @maira et al โฆ Not sure what a good microsyntax is for recognizing invitations, maybe some key phrases at the start of a line like:
And then any @-names on that same line are invitees AttendingUse-case: list people as attending e.g. in POSSE tweet copies as a way to encourage them to post about the event, and to let invitees know who else is coming. If you already know someone is attending your event (like they're a co-organizer or you know by other means), you could (should?) list them explicitly as attending.
RSVP posts can also list who else is attending: Examples, "With" listing attendees in an RSVP:
Microsyntax: recognize " with @", then include all @-names until next sentence terminator(.!?) or newline. POSSEHow and where should event posts be POSSEd?
Event-aware destinations to consider: POSSE to EventbriteEventbrite - has best API for creating events, getting updates, perhaps backfeeding attendees etc.
POSSE to FacebookFacebook - likely has broadest reach of people you might want to explicitly invite. However, the Facebook API disallows creating, updating, or deleting events. Thus you have to POSSE events to Facebook manually:
Check out the indie events above, and make note of the RSVPs that are from Facebook/Bridgy.
POSSE to LanyrdLanyrd - has an API for creating events, getting updates, backfeeding RSVPs POSSE to PlancastPlancast - event-specific silo POSSE to TwitterDespite not supporting event posts per se, Twitter is worth considering as a POSSE destination.
IndieWeb Examples - real world IndieWeb experiments with POSSEing events to Twitter: Tantek POSSE to Twitter
Considering next iteration:
Counting CharsCounting additional characters:
Other Event TweetsExamples of other event tweets: https://twitter.com/felicityofjimin/status/1178249668074950657 ๐บ๐ ๐พ๐๐พ๐๐ ๐ฟ๐๐ ๐๐๐ ๐๐๐๐๐๐ @felicityofjimin ๐ฅ๐ค๐ซ๐จ๐ข๐จ๐ณ๐ธ ๐ฎ๐ฅ ๐ฉ๐จ๐ฌ๐จ๐ญ ๐ 12-13 October 2019 โฐ 11.00 - 15.00 ๐ TTH Tea Bar Jl. Moh Suyudi No.62 Miroto,Semarang,Jawa Tengah ๐ FREE ENTRY Event detail : - Fill the form - Choose the day - We will send the entry ticket to your email RSVP : (event link) Events indexIndieweb sites with event posts (and perhaps even just RSVP posts) could also provide an index of what events they're attending, e.g.
From a human design perspective this makes sense as:
which is likely a union of personal event posts and RSVP yes (and maybe maybes too?) posts. Kind of like a view of your public calendar of events, regardless of whether you're organizing/hosting or just attending. Such an events index could be displayed as a list view (similar to the default view of fb.com/events) or as a calendar view (like gCal), or with an option to toggle between them. An easily-discoverable link should probably be displayed from the user's index or homepage.
Markup designMarkup for an h-event on a site must include a number of properties to enable presentation and user interaction as implied by some of the above brainstorming, and some of the better silo UX as documented in "Silo Examples" The following fields/properties are necessary in the markup somewhere:
Markup example:
Markup in feed filefeed files (like Atom, RSS, JSONFeed) lack a way of expressing events as items, thus it makes sense to brainstorm how to do this in a manner that is both easy/simple for publishers, and hopefully reasonably implementable by consuming code (with good backcompat behavior). One proposal is to use an embedded single h-event as the only child / value of the feed file "item" or "entry-content". E.g.
(to be expanded based on brainstorming between Possible consuming code and user-cases:
Possible tangents:
CancelledSometimes you have to cancel an event, and indicate the event as cancelled on its permalink. Gathering examples towards establishing best practices IndieWeb examples:
Facebook example:
Some design aspects:
iCalendar's VEVENT a "STATUS" property that has a "CANCELLED" value: Previously: What about when an event is cancelled? Options:
StatusEvents can have the notion of a "status", to indicate whether it is cancelled, or some other state. Silo examples:
IndieWeb examples:
iCalendar's VEVENT a "STATUS" property that has similar values to Google Calendar (which likely got them from iCalendar) Response context CRUDSimilar to the general reply context: CRUD protocol, when an event changes (name, location, times, description, etc.) you should send webmentions to all the responses to the event that you've accepted, e.g. to all:
Calendar RemindersMain article: Add to Calendar
Some event hosting silos, such as Eventbrite offer "Add to Calendar" functionality which allow users to add event reminders to the calendar system of their choice. Some example export options include ICS for standalone calendar software such as Apple Calendar or Microsoft Outlook and links that pre-populate the event creation form for web-based calendars such as Google Calendar. See also: Add to Calendar: IndieWeb Examples How to limit capacitySome events have limited capacity and want to offer "tickets," ie only accept the first N RSVPs. To do this, the site that hosts the canonical h-event should set the capacity. When it renders the event, it should show the space remaining based on its current number of It should handle RSVP webmentions for the event in serial. When it gets a The host could also put overflow yes RSVPs on an ordered waiting list, mention that in the reject message, and automatically upgrade people on the waitlist when existing yes RSVPs are withdrawn. IRC discussion of whether/how this fits into the webmention spec. Where should I post an eventPosting an event on your own website is definitely an option, but may not be the most appropriate place to post the event depending on the context. Think about what you want the canonical event post to be when people view it. Is it "your" event? Or is it another community's event? For example, Homebrew Website Club meetups can often be thought of as an IndieWeb community event, so you may want the canonical event post to be on the events.indieweb.org domain. You can then repost the event to your site to help people discover it. Silo ExamplesAttendingMain article: Attending
Attending is a nice looking event silo that allows RSVPing via Twitter, Facebook, LinkedIn, and email. LanyrdLanyrd was an event silo focused on conferences. It went downโpresumed deadโin 2018-01. EviteEvite is an event hosting silo launched in 1998 that uses email for inviting and signing people into events. UpcomingUpcoming.org is a social event sharing silo. It was acquired and shutdown by Yahoo, and later recreated by its original founder at its original domain name. The current version is open source on github at https://github.com/upcoming/upcoming-www. EventbriteEventbrite is another event silo. More details in #POSSE_to_Eventbrite.
MeetupMeetup is another event silo.
This section describes viewing event posts on Facebook. You may also be looking for: Redesign 2020This is the look for Facebook under their new UI.
Redesign 2017In early 2017 Facebook redesigned their event page presentation, putting everything to do with the event itself in a single main/primary column in the middle, with a menu of calendar options on the left, and ads / related events on the right. Event page:
Single column specifics:
Redesign 2015Sometime in 2015, Facebook redesigned their events presentation again, which in many ways seemed to regress even more, especially in the mobile web view: Mobile Web UI:
Redesign 2014-02-27Here is what the 2014-02-27 redesign (limited rollout as of that date, but subsequently broadly rolled out) looks like:
Before 2014-02-07This was perhaps the pinnacle of Facebook's event page design. Facebook has had one of the more interesting/nicer/cleaner event page designs for quite some time. Here is a screenshot of the 2014-02-12 Homebrew Website Club event (for the SF location) on Facebook, manually POSSEd by Ben Werdmuller from http://werd.io/2014/homebrew-website-club-meeting :
Before 2014Facebook pre-2014:
Mixily
Luma
SessionsIndieWebCamp sessions about events:
FormerlyPast ServicesPOSSE to Google+Google+ shut down in 2019. Until then, was another silo that has explicit event posts, but has enough challenges to be considered problematic:
See Also
Retrieved from "https://indieweb.org/wiki/index.php?title=event&oldid=114093" |
| You are visitor 01402503 โ GeezerVison does not store the pages you look up. Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800ร600. No cookies required. |
