Microformats – Empowering Your Markup for Web 2.0

Don’t look here for books 6 and 7; I’ve very kindly decided to skip reviews of Harry Potter books. Instead we’re skipping straight to book 8 which more on target.

Microformats: Empowering Your Markup for Web 2.0

Haven’t heard much about Microformats? They are relatively new to the web, but use existing practices just marked up in a uniform way to add new meaning. They’ve been getting a lot of attention lately with adoption at Yahoo, Technorati, LinkedIn, Upcoming, Flickr,, Eventful and much more. By marking up their pages in this way, they become more easily parseable by others’ application. For example, Technorati recently created a Microformats search which is still gaining traction. It does work though, as as a serch for ColdFusion reviews shows. 🙂 The entire purpose of microformats is that they use existing technology (css, html, xhtml) to create semantic, machine parseable information. What’s that mean? It means creating something that’s straightforward to a developer, but follows a strict enough standard that it can be intepreted in a predictable manner as well. To make things a little more clear, how about we start off with an example, XHTML Friends Network . If you take a look at the code for the blogroll on my front page, you’ll see a sample link looks like this:

The relation between me and Brian LeGros is that of “friend met co-worker”, which is straightforward enough in it’s meaning. There is actually a special set of relationships that are available in this context, although they are very broad. They cover relationships such as friend/acquaintance, co-resident/neighbor, child/parent/sibling, muse/crush/date and me, to reference another site about you (would usually be used for myspace/facebook links for example). Since the XHTML standard has nothing against using multiple, space separated relationships, this is a very clean and easy way to markup a set of links, and one that WordPress helps out with. Reading through _ Microformats_ there were more than a few times when I put the book down and decided to implement them then and there. That’s one of the most exciting things about this book- – it’s a call to action, and an action anyone who has a web presence can make. It starts out with very simple microformats such as XFN (short for XHTML Friends Network), and other link-based microformats. Two of these were immediately useful to me- – rel=”nofollow” and the VoteLinks Microformat. You’ve probably heard about the rel-nofollow microformat without even knowing it was one. The idea is that you add [html]rel=”nofollow”[/html] to any link and that link will not be traveled by search engines. Also, that link will not gain pagerank from the link (and your sites pagerank will not be used up on the link). rel-nofollow was introduced by Google and has become the standard for all links that are made within blog comments. Another one along the same lines is Votelinks which has a few more options. The idea is that you can markup a link which serves as a vote for, a vote against or a null vote for the related link using the “rev” attribute of a link. The possibilities are: [html]rev=”vote-for” rev=”vote-against” rev=”vote-abstain”[/html] Now when you see one of those sensationalist articles about ColdFusion dying, you can just mark it up accordingly.

Microformats goes into these formats at much more detail, as well as providing some examples on styling them (a[rev=”vote-against”]) for one. By starting with these extremely easy to implement microformats, this book gets your ideas rolling. Some of the more complex microformats, such as hCard are built line by line from the simpliest parts up until you have a full hcard. This approach is used throughout the book and works well. hCard is also one of the best examples in the book, with a full walkthrough of how an hCard might be marked up. You might be thinking microformats are just a matter of adding a little markup and that’s it, but it’s actually quite a bit more complicated than that. For the most part, microformats are marked up by adding classes with specific names to any element. For instance, take hCalendar; a microformat used to markup events. It’s obvious an event needs a title, a date, maybe location, description- – and that’s just for starters. What if the event spans multiple days? Who’s the coordinator? Where is the event located? Well when you get into questions like this you start nesting multiple microformats to make full hCalendar. There is hCard microformat to communicate the coordinator (or any person), a whole location markup with geo coordinates, and a way of providing the start date and end date. These little pieces can be reused in other microformats as well. That’s really what this book helps with — getting a grasp on the building blocks. I don’t see myself wanting to memorize the individual pieces of most microformats, but after reading this you should have an idea of when they can be used with a handy reference for finding out more. As far as Microformats books go, it’s the best one out there — it’s also the only one listed or planned for release. One thing I would’ve liked to see is a little more styling of some of the microformats. Microformats does style a few of the examples but not all. At the end there are two “case study” chapters going into detail on how Cork’d and Yahoo have used microformats. These provide full styling examples as well. Cork’d was co-created by Dan Cederholm, author of Bulletproof Web Design , and reading his writings has been one of the best ways of helping me learn best practices. I’d suggest microformats as a subject anyone in web development could easily get the hang of in almost no time at all. If you use ColdFusion, you can always try the Microformats project on Riaforge to help get started. This book is a great resource though, and I’d highly recommend it to anyone interested in learning more.

My rating: 4.5 stars

Avatar for Adam Fortuna

Hey hey! 👋

I'm , a full-stack product developer in Salt Lake City, UT. I love enlivening experiences, visualizing data, and making playful websites.

Let's keep in touch 🧑‍🤝‍🧑

Did you link to this article? Add it here