Archive for the 'dconstruct' Category

Microformats

Designed for humans first and machines second, micro­formats are a set of simple, open data formats built upon exist­ing and widely adopted standards.

I didn’t under­stand it at first. I just couldn’t see the point. I wasn’t think­ing outside the box. It took a kick up the backside from Jeremy Keith and co to figure it out.

You see, most web-sites contain some form of useful data: Contact inform­a­tion, reviews, events and so on. Sometimes, it’s not even obviously struc­tured data. Take my “About the author” snippet for example:

Olly Hodgson is a Web Designer dude from Cheltenham, England.

It tells you who I am, what I do, where I’m from and includes a link where you can find out more about me. There’s almost enough for a business card.

The thing is, no two coders will mark-up their contact inform­a­tion, reviews and events in quite the same way, so it’s not exactly simple to extract it and use it elsewhere. Microformats aim to change that.

Here comes the science bit

Let’s take a closer look at that snippet:

<p class="vcard">
<a href="http://thinkdrastic.net/about/" class="fn url">Olly Hodgson</a> is a <span class="title">Web Designer</span> dude from <span class="adr"><span class="locality">Cheltenham</span>, <span class="country-name">England</span></span>.
</p>

You see those class-names wrapped around the import­ant bits of data? That’s the hCard micro­format in action. Basically, it’s an HTML version of vCard, which is the industry-standard electronic business card format. In there we’ve got a name (class=“fn”), a web address (class=“url”), a job-title (class=“title”) and so on.

Run this page through Technorati’s hCard to vCard converter and hey presto! A vCard you can open in your address book software.

The real beauty is that you don’t have to change the look-and-feel of your web-site in the slight­est. Just add the magical class-names to your exist­ing mark-up and you’re done.

So what’s next?

Microformats are obviously still in their infancy, but their poten­tial is endless. Where hCard opens up contact inform­a­tion, hCalen­dar does the same for events. hReview has the poten­tial to completely shake up the way products are rated in the online shopping world. XOXO could enable a web-browser to offer an outline-view of your site similar to the one offered in Microsoft Word. The list goes on and on.

What’s more, while micro­formats offer a stand­ard­ised way of extract­ing data from HTML, they don’t in any way lock you into writing it in a specific way. Your HTML code can look how you want it to really, as long as it includes those magical class attributes.

Go on, get out there and imple­ment them. You know you want to.

That web-geek conference in Brighton

d.Construct 2006

I don’t know about you, but I thoroughly enjoyed it. It’s success­fully messed up my body clock but I don’t think I can blame anyone but myself for that…

So, I arrived in Brighton on Thursday night after a surpris­ingly trouble-free train journey. After check­ing into the hotel, I wandered up the road to Heist for the pre-conference social gather­ing. I met some new people, caught up with the usual suspects and gener­ally had a good time. We finished up at a random pub on the sea-front at about 3 a.m.

Just under five hours later, my alarm went off. I staggered downstairs where I self-served myself the biggest break­fast of all time, before wander­ing up to the Corn Exchange, venue for the confer­ence. A bit of fresh air did me the world of good, so I was feeling surpris­ingly wide awake by the time I got there. I grabbed the freebies, downed some coffee and got chatting to some more of the peeps before we were called into the auditorium.

The confer­ence itself was ace. We had talks from Jeff Barr, Simon Willison & Paul Hammond, Jeremy Keith (twice!), Aral Balkan, Derek Featherstone, Thomas Vander Wal and Jeff Veen. Various other attendees around the inter­net have dissec­ted each of the sessions so I won’t go into detail.

Obviously it wasn’t all perfect. Biggest problem for me was the lack of leg-room in the audit­or­ium. Maybe it’s just my bad knees?

The good stuff made up for that though. Aral’s “Mash my Flex up” presen­ted Flash to me in a whole new light. Derek Featherstone came up with a series of gotchas and examples of deeply inaccess­ible coding on some very high profile sites (hello Google Calendar). Finally, Jeff Veen stole the show (as per usual). It was one of his inspir­a­tional tour-de-force talks, leaving most of the audience think­ing “Yeah, this stuff is ace! Let’s go and build it, right now!”

Which of course we didn’t. After running off to drop off various laptops, bags and miscel­laneous freebies off at numer­ous hotels around Brighton, we all congreg­ated at The Terraces for the Snipperoo sponsored after-party. Alas, I missed out on the free-bar (which ran out in about ten minutes flat). That place closed somewhat earlier than billed, so a bunch of us went-a-wandering, eventu­ally ending up in Sidewinder. Again, I finally crawled into bed shortly after 3 a.m.

Just under five hours later, my alarm went off. I staggered downstairs where I self-served myself the second-biggest break­fast of all time, before check­ing out and wander­ing up to the station. After a surpris­ingly trouble-free train journey, I got home to find that I’d lost my house-keys and ended up climb­ing in a window. Utter genius. Where did they turn up? Bottom of my wash-bag. Go figure…

Of course one of the best things about the whole confer­ence was the backnet­work. I didn’t have to collect business cards from every­body I met. Instead I logged on, added them to my network (all done with XFN) et voila! I have their contact details. What’s more, it picks up people’s blog posts that mention , along with any Flickr photos tagged with dconstruct06. Madgex, that was an inspired idea!