1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
|
Calendar and event information is one of the most common chunks of data on the web -- it answers the age old question, what are you doing? Given the prevalence of event announcements and scheduling applications, it makes sense to have a standard format that all sorts of programs can exchange.
That's exactly what the [http://www.ietf.org/rfc/rfc2445.txt iCalendar standard] does for apps like Apple's iCal or Mozilla's Sunbird; but what about web pages?
The answer is the hCalendar microformat, which provides an open, distributed means of marking up calendar and event information on your pages. Once your data is marked up in hCalendar format it's easy for search engine spiders and browsers to detect, understand and even convert it back to iCalendar format for importing into desktop applications.
##Overview##
If you have a blog, chances are you've mentioned an event at some point -- a conference you're planning to attend or just a get together at a local pub. Using hCalender when you write about upcoming events allows applications to retrieve the details of the event directly from your page without having to reference a separate iCalendar file.
And that makes it easier for your friends to get the info into their own calendar apps, making them more likely to show up and buy you a round at that pub meet up.
##The Basics of hCalendar##
Let's say your blog displays a calendar widget with all your upcoming events in a table, something like this:
<code>
<tr>
<td>Sat March 14</td>
<td>6pm</td>
<td>Meet up at Enid's</td>
</tr>
</code>
That's fine, but just adding a few extra detail enriches the data and makes it easy for the spiders and apps to pull it out and do something useful -- like adding the event to a calendar app.
Here's the same data marked up with the hCalendar syntax
<code>
<tr class="vevent">
<td><abbr title="20080314T1800-0500" class="dtstart">March 14th 6pm</abbr></td>
<td><abbr title="20080315T200-0500" class="dtend"> 2am 2008</abbr></td>
<td><span class="location">Enid's Bar, Williamsburg, NY</span></td>
<td class="summary">Meetup at Enid's</td>
</tr>
</code>
The two main things we've done here are add date-time stamps around our human readable dates and added a few class names to define the data.
##More Complex exampes##
As with other microformats, hCalendar data is wrapped in tags and the class names used in those tags define what the data relates to. For instance, the <code>dtstart</code> property let's you know that the text in that HTML element is the starting time for the event.
The only things required for a hCalendar definition are a <code>dtstart</code> class with the date and time of the event and a <code>summary</code> that gives a brief description of the event.
Other properties you can define include:
# location
# url
# dtend (ISO date), duration (ISO date duration)
# rdate, rrule
# category, description
# uid
# geo (latitude, longitude)
Here's a more complex example:
<code>
<div class="vevent">
<h5 class="summary">I am eating bananas</h5>
<div>Posted on: <abbr class="dtstamp" title="20080314T1300Z">March 14, 2008</abbr></div>
<div>Dates: <abbr class="dtstart" title="20080314T1300Z">March 14, 2008, 16:30 UTC</abbr>-
<abbr class="dtend" title="1920080316T1300Z">March 16, 2008 01:00 UTC</abbr></div>
<div>Banana eating is a <span class="class">public</span> and <span class="transp">transparent</span> event.</div>
<div>Filed under:</div>
<ul>
<li class="category">Business</li>
</ul>
</div>
</code>
Here we have a couple of additional class definitions. The <code>transp</code> class maps to a similar class in the iCalendar format and tells anything searching through our schedule to not include this event. In other words it won't show up when people search to see when we're busy.
For some even more complex examples, check out the [http://microformats.org/wiki/hcalendar-examples microformats wiki page].
But of course there's no need to write hCalendar info out by hand. There's a handy [http://microformats.org/code/hcalendar/creator hCalendar creator], and even better are the [http://structuredblogging.org/formats.php plugins for Wordpress and Movable Type] that make it easy to add hCalendar markup to events you're writing about.
##Conclusion##
Although perhaps the most complex of the microformats, hCalendar is also one of the more useful ones. Sure, you can publish your schedule as an iCalendar feed, but unless all your friends are tech savvy nerds, they might not know what to do with the iCalendar feed address.
Keep in mind that hCalendar is still a work in progress, if you have ideas or suggestions, head over to the Microformats site and [http://microformats.org/wiki/hcalendar-brainstorming let them know].
|
