hCalendar Microformat in Moodle Courseware System

Perhaps someone could try my first attempt at hCalendar and let me know if it is syntactically correct? hCalendar is a microformat for embedding event details in web pages.

The calendar function in the Moodle courseware system doesn't have hCalendar built in. So I used hCalendar creator to mark up the date, time and other details. I then pasted that into the Moodle editor. Just pasting the entry as is did not look very pretty, so I marked up the text as a normal looking web page. Hopefully I did not break any of the hCalendar markup in the process.

The microformats idea is clever, in that the hCalendar metadata is added to a normal web page, rather than creating some special new type of document. This is an important feature of the microformats approach: you are not required to implement a strict data format, just use the markup around the bits of the document containing the data for the particular Microformat. The software reading the microformat will ignore the parts of the web page not marked. This is a more flexible approach than creating a special XML document and then transforming it to be readable.

In theory, suitably equipped web browsers should be able to detect the hCalendar. But I don't have such software, so if someone could try it, that would be useful.

hCalendar Code

hCalendar creator is a web service which allows you to type details of an event into a web form and have the hCalendar generated. This is useful for seeing how hCalandar works (ideally the facility will be built into whatever scheduler program you use). The form promos you for the summary, location, url, start time, end tims, timezone and description of the event. It generates two version of the hCalendar: one whitespace to make the code readable and a compact version.

Example code for event:

<div class="vevent" id="hcalendar-Broadband-for-Environmental-Sustainability">
<a class="url" href="http://education.acs.org.au/calendar/view.php?view=day&course=55&amp;amp;amp;amp;amp;cal_d=19&cal_m=9&cal_y=2007">
<abbr class="dtstart" title="20070919T1730+1000">September 19th 5:30pm</abbr>,
<abbr class="dtend" title="20070920T1900+1000"> 7pm 2007</abbr> —
<span class="summary">Broadband for Environmental Sustainability</span>— at
<span class="location">Australian National University, Room N101, Computer Science Building, North Road, Canberra</span>
</a>
<div class="description">Professor Eckermann argues that broadband telecommunications can be used to make a positive contribution to environmental sustainability. Energy inefficient activities can be displaced with earth-friendly alternatives, such as renting a movie via the Internet (avoiding trips to and from the video store), working some days from home (saving travel costs and easing pressures on the road) or using "networked intelligence" to manage energy and water consumption more efficiently.</div>
<p style="font-size: smaller;">This
<a href="http://microformats.org/wiki/hcalendar">hCalendar event</a> brought to you by the
<a href="http://microformats.org/code/hcalendar/creator">hCalendar Creator</a>.
</p>
</div>

This renders in the web browser as:

September 19th 5:30pm, 7pm 2007 — Broadband for Environmental Sustainability— at Australian National University, Room N101, Computer Science Building, North Road, Canberra

Professor Eckermann argues that broadband telecommunications can be used to make a positive contribution to environmental sustainability. Energy inefficient activities can be displaced with earth-friendly alternatives, such as renting a movie via the Internet (avoiding trips to and from the video store), working some days from home (saving travel costs and easing pressures on the road) or using "networked intelligence" to manage energy and water consumption more efficiently.

This hCalendar event brought to you by the hCalendar Creator.

This is not the format I want on my web page, so instead I took the various bits of markup for hCalandar and inserted them into my page.

So where I had the start time, I added around it the markup:

<abbr class="dtstart" title="20070919T1730+1000">September 19th 5:30pm<

Around the summary I added:

<span class="summary">Broadband for Environmental Sustainability</span>

This points up two different ways the Microformats are marked up. In the case of the time, the data is duplicated in the added markup. The date and time are endcoded in the added abbreviation tag as "20070919T1730+1000" as well as appearing in the rendered text ("September 19th 5:30pm"). In the case of the summary, the visible text is used as the data.

There is a waste of space and the risk of confusion in the way the time is encoded. Ideally none of the data would be duplicated and the same values would be machine readable and displayable, but the limitations of existing HTML do not make this possible.

ps: The entry is for a real event in Canberra. All those with an interest in broadband and the environment are welcome to attend.