Five Pertinent Questions for John Allsopp

Digital Web: For the ordinary website—the sites for web-design businesses, the fairly static small business sites, in fact, probably the majority of sites on the web—what are some practical uses for microformats?

John Allsopp: I think the benefits fall into a couple of categories.

Let’s start with the practical benefit for developers of providing patterns for commonly marked-up types of data. This streamlines development efforts, because each time you have to mark up, say, an address, you can simply use the well thought-out schema of hCard. In fact, just yesterday I was working on a conference site (which I’ve done many times now) and marking up the speaker list and their bios. I wanted a good clean structure, and it suddenly dawned on me that hResume was perfect. It has fields for all the stuff I needed—names, web sites, companies (all those are in hResume because hResume uses hCard for the person whose resume it is) as well as fields for a person’s biography, his experience, and so on.

The second category is a little more theoretical, in the sense that it’s not necessarily widely adopted right now, but is definitely coming in the near future. Right now, Firefox has a number of extensions that recognize microformats on a page, and let the user do things like add a contact to an address book, or look up a location on Google maps. But it’s clear that Firefox 3 will almost certainly support this kind of functionality as part of the main interface (Alex Faaborg, user interface designer at Firefox, has written and presented on this quite a bit), and Internet Explorer is increasingly rumored to support microformats in a similar manner in the next version (in fact, keep an eye out for what Chris Wilson of Microsoft has to say on the subject).

Similarly, the number of services which aggregate and otherwise consume microformats is definitely growing rapidly. For an overview of some of these, you might like to look at an article of mine in Digital Web from last year, and my blog has details of more recent developments (as does my book).

So, as a developer, if you publish content marked up using microformats, you get in on the ground floor, with these services hungry for relevant content.

DW: What are some extra special things you can add to your own site, as a web professional, to give the appearance that you are actually one of the cool kids?

JA: Blinking headings. Oh hang on, that was ten years ago. Well, it is interesting that microformats are actually cool. I typically don’t get involved with cool stuff, not cause I am averse to it, but cause my cooldar mustn’t work too well.

I wouldn’t add microformats just to be cool—that’s the real thing about cool—if you do cool stuff just to be cool then you are uncool—dig? But, if you do stuff that happens to be cool not because it is cool but because its valuable, well that’s cool.

Ok, having confused everyone apart from Donald Rumsfeld, here’s what I’d suggest people do to code better websites.

Make your code POSH (plain old semantic HTML, a term that was adopted as a kind of brand name for “semantic HTML” in and around the Web 2.0 Expo). Before you adopt any microformats, ask yourself: Do I use HTML the best way I can? Are my pages valid? Do I avoid the use of presentational HTML (like font elements, or the use of tables for layout—as opposed to tabular data)? Do I use lists where I have a list of stuff? Do I use emphasis and strong emphasis elements where it makes sense? Then, if you want to get really sophisticated, are you using the cite element—the cite attribute of the blockquote element? How about the abbreviation element with a title to expand abbreviations and acronyms? By thinking about these aspects of HTML, it really helps you understand semantic markup, which is the cornerstone of using microformats properly.

Then, once your code is POSH, think about the content you have, and the microformats which might be useful for marking it up. Contact details? hCard. Biographical details? hResume. Event details? hCalendar. Physical locations? Geo
(but where you have geographical coordinates and addresses, use an hCard with those geographic coordinates embedded inside it.)

DW: If you are a smarty-pants, up on everything, though not necessarily a developer of the sort of web 2.0 applications that you’ll eventually sell for eleventy-skillion dollars, is there something in the book for you?

JA: I think so. The microformats approach to markup is new, and many of the formats themselves are much newer still. I find myself going back to the book as a reference when advising people (“Is a summary a required field of an hReview?” for instance). So, I’d like to think that the book serves the needs of developers who might be easing themselves into fully semantic markup, as well as those who are semantically savvy, but who then want to extend that to creating the richest possible HTML. I don’t know whether Tantek Çelik needs the book, but he does have a copy, and has said some very nice things about it.

DW: In a nutshell, what’s all the hoopla about? When people first talked about microformats, you’d have thought The Revolution was starting.

JA: There is little doubt the web is a revolution. I’d actually argue that it will have as far reaching an impact on civilization as the Industrial or French revolutions. But for all the talk of “Web 2.0”, it seems to me that two fundamental paradigms of the web are essentially unchanged since its inception—browsing and search.

We use browsers today almost exactly as we did in 1992—we visit pages and we read the content (web apps are a minor change to this, and will become more important with time, but I think the basic argument holds).

But the pages we visit contain all kinds of common information that, dammit, the browser should recognize and let me do stuff with—think of it like being cut/copy/paste for the web. If there are contact details, why can’t I add them to my address book? If there is a place, why can’t the browser recognize this and give me a way of seeing this on Yahoo Maps? If there is an event, why can’t I add it to my Google Calendar? The simple answer is because there are no common interoperable standard formats for this incredibly common information. Microformats change that. They do enable a profound change to the idea of what a browser is.

The other unchanged paradigm is search. How do we use search? We plug key words in that we think describe pages we want to read. The search engine returns a list of possible matches. We choose one or more of them and read them.

But the web is an almost unimaginable set of opinions, for example, about what people think is good, or bad, or so-so. Why can’t I ask a search engine whether a particular book is worth reading? If search engines could somehow aggregate all of those opinions out there on blogs, and newspapers sites and so on, then I’d get a good idea whether I should waste my precious time on a film, or book, or at a particular restaurant. But search engines have a lot of trouble doing that because again, there is no common format for marking up your opinion about stuff. Enter hResume—in fact widely used already.

Microformats will enable a new generation of search services, like the idea outlined above, but also many others (say, “Find me all the events my friends are going to in September in New York”). This makes them revolutionary.

DW: Is this something I really must learn if I’m to continue to call myself a web professional?

John Allsopp is the head developer of Style Master, the leading cross-platform CSS editor, and founder of Westciv, an Australian web software development and training company. Westciv provides some of the most widely read and respected CSS resources and tutorials on the web. One of the earliest members of the Web Standards Project, he's also cofounder of the upcoming Web Directions Conference in Vancouver, BC.

Carolyn Wood of pixelingo is a web designer, copywriter, content strategist, and the Editor in Chief of Digital Web Magazine. Her long list of loves includes the web, design, storytelling, and making lists. If you meet her, ask her to tell you the story about the midwife and the bank robber.