hcalendar-intro

This page is currently a working draft

hCalendar is a method for adding additional mark-up to a page which contains details of one or more events, so that the event(s) can be identified by software, and indexed, searched or downloaded separately from the page itself. The events can be concert listings, conference sessions, class timetables - anything!

Suppose, for instance, that you're a fan of a professional sports team, which has twenty-odd matches in a season. Just before the start of the season, they post on their website a list of those matches, with dates, start times (which vary), venues, some notes (say, the type of match - league ("Football League Championship"), cup or friendly) and the opponents.

To add these to your diary or calendar programme (Outlook, Lotus Notes, or iCalendar, for example) you have to cut and paste each one, a piece at a time – first the date then the start time, then the venue, then the opponent (as the event title or summary), the notes and so on. Even though each match lasts two hours, you also have to calculate the end time for each. It takes you an hour or two, to add all the events to your diary.

Wouldn't it be better if you could just click one button in your browser, or follow one link, and be offered the option to add some or all of the events to your diary, in one go? Well, that's what hCalendar lets you do.

Example

For instance, here's the (hypothetical) markup for a match from West Bromwich Albion's website, as viewed in early September 2006:

<tr>
	<td>Sat 23 September</td>
	<td>3pm</td>
	<td>Away: Kenilworth Road Stadium</td>
	<td><a href="http://www.lutontown.co.uk/">Luton Town</a></td>
	<td><abbr title="Football League Championship">FLC</abbr></td>
</tr>

And here it is, marked up as a hCalendar event

<tr vevent>
	<td><abbr class="dtend" title="2006-09-23T17:00+01:00">Sat 23 September</abbr></td>
	<td><abbr class="dtstart" title="2006-09-23T15:00+01:00">3pm</abbr></td>
	<td>Away: <span class="location">Kenilworth Road Stadium</span></td>
	<td class="summary"><a class="url" href="http://www.lutontown.co.uk/">Luton Town</a></td>
	<td><abbr class="description" title="Football League Championship">FLC</abbr></td>
</tr>

(note to editors - messy cludge for dtend - suggestsions?)

(The "+01:00" at the end of the time is the offset from GMT/UDT, indicating, in this case, British Summer Time, but it could just as easily be adjusted to indicate, say, New York or Tokyo time.)

Note that both of these will appear exactly the same, when viewed in a web browser.

You can do more, and more complex, things with hCalendar, too, such as marking-up event details contained in prose rather than tables, and marking-up the venue as an hCard.

Using HCalendar events

To make use of events marked up with hCalendar, you will need to use a browser which understands them, such as Firefox with the Tails-Export extension, or to visit a website which can decode them, such as the Technorati hCal events tools.

The West Midland Bird Club has a page of events marked up with hCalendar which can be downloaded to your calendar via this link - try it (you can always cancel, or edit, rather than opening, the resulting ".ics" file).

See also

hCalendar The formal specification.