Marking some mark-up changes to guardian.co.uk

Martin Belam by Martin Belam, 22 July 2010

Last week I linked to a few things of interest that had appeared on guardian.co.uk whilst I was taking a blogging break. As well as those, there have been some behind the scenes changes in the way we generate pages, featuring some AJAXy, microformat and HTML5 goodness.

Add to your calendar

When we write articles about a forthcoming event, journalists can add an event factbox, with additional details. Thanks to the inclusion of some hCalendar microformat mark-up, if they do, the system now automatically generates an 'Add to your calendar' link.

'Add To Calendar' on a Guardian web page

A question of <TIME>

We've begun to use some HTML5 elements on our pages. If you view the source of one our news article, you'll see that the publication date is marked up with the <TIME> element and a machine-readable timestamp.

The HTML5 <TIME> tag in action

HTML5 support is not totally cross-browser, and some legacy browsers - and I'm looking at you IE6* - don't know what to do with these fancy new-fangled tags. Our solution has been to use Remy Sharp's HTML5 enabling script, which teaches the old dog the required new tricks.

New AJAX galleries

Developer Emma Sax has blogged about our new gallery layouts. The challenge was to make them look beautiful and behave in a nice AJAXy way, without breaking the back button behaviour, and still leaving the gallery usable for people without JavaScript enabled. They look great, whether it is archived Tom Baker, or yesterday's fantastic gallery of crystal clear wildlife images from Scott Linstead.

Tom Baker stars in one of The Guardian's new gallery layouts

1 Comment

I've been reminded that IE7 and IE8 also need to be goaded into accepting HTML5 elements via JavaScript.

Keep up to date on my new blog