A while back I read an interesting blog post on Microdata. While I encourage you to read the article I just linked to, the basic gist of the feature is that it provides a way to create metadata for your HTML content. By embedding certain properties into your HTML you can create search engine/robot friendly data for your content. I'm not sure how much this is actually being used in the wild (see my resources links at the bottom), but it seemed like a pretty cool thing.

Back in November I posted a blog entry about how you could parse an HTML page for microdata in Chrome. (There is a much clearer API that is - unfortunately - not supported by Chrome yet.) I thought it might be nice to take that code and package it up into a proper extension. The idea being that you could add microdata to your HTML page and then use Chrome Dev Tools to see how a robot might read it.

Here is a screen shot to give you an idea of what I'm talking about. The site in question is Southern African Travel.

Here is another example where microdata is used for the reviews at CTS Wholesale Sunglasses.

For now, you have to manually open dev tools and select the tab, but I'm considering adding an icon next to the URL bar that flags when it sees microdata being used.

If you want to install this extension, simply go here. The icon is from The Noun Project, courtesy of Ed Jones. (Original Icon)

Ok, if you don't care how Chrome Extensions are developed, you can stop reading now. What follows is some technical background on the extension and why I almost pulled out all my hair last night.

I've blogged before about the difficult in handling "communication" in Chrome Extensions before. By that I mean having part A talk to park B. Chrome Extensions have rules related to security and context that can make it extremely difficult to get things working. In this extension, the biggest issue was getting the content script (a JavaScript file which can run in the context of the current page) talking to my "devtools" script (where I'd be able to update the content of my panel). There is documentation at Google on this, but nothing that covers this specific use case. In fact, panels in general are pretty poorly documented. To be honest I don't know who to complain to and figure it wouldn't help much anyway. I'm hoping my extensions help out.

I ended up dropping the content script and instead making use of an evaluation technique shared with me by John J. Barton. It worked perfectly. If you want to read more about his workaround, checkout our discussion thread on the Google group.

Resources: