NPSC Blog

I posted last year about microformats and the social media release, as an introduction to developments in this space and how microformats have the potential to radically alter the way that we produce, publish and syndicate content across the government namespace.

Rather than just comment from the sidelines, I thought I would prepare and publish a media release as a hRelease, the proposed microformat for the social media release. I hesitate to call this a social media release because –being a government release– it doesn’t look like the templates that have been proposed. However, under the hood, it is very much an attempt (albeit preemptive — hRelease has not yet made it to ‘draft’ status yet) to publish a semantically enhanced media release.

So here it is: just off the shelf, the first New Zealand government hRelease: SSC signs all-of-govt deal for Google boxes.

The real departure from the examples that are already in the wild (one, two and three) is the detail in the markup. If you view the source of these pages, you will see that the content is just jammed into (for the most part) a ratmangle of nested tables, font tags and other cruft that severely undermines the principles of microformatting content in the first place.

Yes, the content should be usable by humans first. For public sector communicators, that means everyone. People using text readers because of vision impairments or people on 28k dialup in Taihape. The content should also be usable by machines, hence the microformatting. Publish it once at the authoritative source (your agency) and ensure that it can be syndicated and reused by whoever chooses to do so with minimum effort.

The Markup

I have tried to use existing microfomat properties and work from the elements for hRelease as outlined by Chris Heuer. It was also a given that the page would validate. The best way to see this is to look at the code:

1. <div class="hrelease">
2. <h2 class="headline"> SSC signs all...
3. <abbr class="dtreleased" title="20070227">February 27, 2007</abbr></span
4. <p>The <span class="fn org">State Services Commission</span> today...

You can see how the content is marked up so as to make it semantically rich. The heading is given the class headline, the agency is marked as "fn org", full name organisation etc, all of which makes the whole document much more usable — for people and for machines. This is critical for search. You could, for example only spider for hrelease results, or for contact details vcard. So within the hRelease, I have added my contact details as an hCard:

1. <p><div class="vcard">Contact:
2. <span class="fn">Jason Ryan</span><br / >
3. <span class="tel">
4. <span class="type">DDI</span>:
5. <span class="value">04 495 2850</span>...

Not only is this format more accessible to people and machines, it is actually usable. There is a Firefox extension that allows you to click on microformatted information in web pages and it will initiate application sequences. So, in the case of hCard, clicking on the microformat will open your address book (in Thunderbird or Outlook, say) and you can save all the information then and there. Geo formatted information will open Google Maps and show you exactly where the place or event is, hCalendar will open your calendar application and allow you to save the event. Pure genius. This functionality will be fully integrated into Firefox 3.

From here on in it gets a bit more opaque, so I should note that the rest of the markup is provisional only, until hRelease makes it to draft and some of the properties are specified.

I wanted to add resources, in this case an image, del.icio.us links and Technorati tags. I dropped the first two into a <div class="links">. A property for the image had already been described in the hCard spec, so that saved some improvisation.

The tags were another matter. I created a <div class="tags"> (I know, crazy eh?) on a best-guess basis, but I am happy to consider alternatives.

That is about the extent of it. Have a look at the release and, bearing in mind that it is a work in progress, let me know where I went wrong. Or just tell me if you think all the extra markup is a complete waste of time…

Updated 22/7/07

After reading this post from the Web Standards Group on the accessibility issues around abbreviations in microformats, I have reworked the code for the most recent e-government hRelease (on new search for newzealand.govt.nz). The dateline now looks like this:

1. <h3 class="dateline"><span class="dtreleased" title="20070717">July 17, 2007</span></h3>

While, not an ideal solution, it does make it more accessible for people using assistive technologies.