Category: News

Google adds support for hCalendar and hRecipe Rich Snippets

The first quarter of this year has seen Google really make tracks with Rich Snippets, which they announced back in May of last year, with microformat implementions popping up in results for all manner of content.

hCalendar

One of the original, and certainly most obviously useful formats, hCalendar has made major head-roads in being adopted across the web as a standardised way to mark-up event information. Those who took the time to add this format to their site are now reaping the benefits, with Google clearly making the most of this rich data.

hRecipe

hRecipe is certainly a relatively young format, but always looked to be a promising starter bringing the timeless interest of geeks and food together.

With a view to make organising your summer BBQs simpler this year, Google have made a major update to their search result pages which now highlight recipes in the results, showing important information such as ratings, cooking and prep times. The information being displayed is formed from extracts of hRecipe marked up data.

hRecipes in Google results

Mark Wunsch, a developer for FoodNetwork and Prism parser, who now finds his microformatted recipes displayed on Google search results pages had this to say:

When we revisited our recipe pages on FoodNetwork.com a few months ago, it was one of our priorities in Front End Engineering to embed hRecipe. We knew that it would be only a matter of time for tool support to come along to utilize our recipe data. As Front End Engineers, we have real control over what are pages output, and we have a real opportunity maximize the amount of data that a tool like Google can glean from our markup. It would be a poor practice to not take advantage of microformats when something as powerful as Google recognizes their importance.

There’s further work to do with ironing out the kinks in the hRecipe format, but I think this certainly shows the benefit of being an early adopter and getting these formats out into the wild for real stress-testing. Congratulations to all those involved!

With Google now officially supporting these two formats, plus people and reviews, we eagerly anticipate their further adoption of additional microformats into Rich Snippets.

Tags for this entry

Recently in microformats: 2009-09

It’s been a while since we’ve posted a “This Week in Microformats”, and September was a particularly active month for microformats:

new hResume and hCard implementations

Madgex‘s brand new importer powers the Guardian UK‘s recently launched Guardian Jobs CV Match service. The site YIID (Your Internet Identity) now also supports importing hResumes.

Open source parsing libraries continue being developed for numerous languages. The latest, as noted by Tom Morris on the , is the Java library org.microformats.hCard written by Reinier Zwitserloot.

beautiful hCards, MySpace hCards

Personal hCards have been around for years, but recently we’re seeing more and more web designers publishing their online identity using beautifully styled hCards, superb complements of form and function. Three in particular:

All three make good use of CSS for styling and layout, and Javascript for dynamic effects. The last of the 3, Jared’s, is more simply styled than the other two, however if you look closely, his list of instant message network addresses also display his live availability on each, a really nice touch.

screenshot of Jared Hanson's instant message addresses annotated visually with his presence on each

Got a beautiful hCard you want noticed? Add it to the hCard examples in the wild wiki page.

It’s important to highlight individual hCards like the above, as continued proof that people do write web pages, HTML, markup in general, by hand. Even when such pages are generated from a database used fill out an HTML template, a person still writes the template by hand. And it’s important to highlight those that update templates as well to support microformats.

The list of social network sites with hCard profiles continues to grow, this time with a big addition: MySpace.

As of about a month ago, all new MySpace profiles, and all current users who upgrade their profile to version 2.0, automatically get hCard support, as confirmed by MySpace’s platform developers.

new tutorials and developments

Behind all these new microformats implementations and sites is a vibrant and active community, not just here on microformats.org, but across the web as a whole, and across web development communities as well.

The standards-championing Dev Opera community recently published a wonderful article on Styling and extracting hCalendar by Christopher Schmitt, and updated it with use of the for better accessibility.

Safari Books Online and New Riders have made published a video, Designing with Microformats for a Beautiful Web, by well known web designer Andy Clarke.

And finally, last but not least, this past month saw the resolution of all outstanding issues on both hCard and , paving the way for updates to the specs, FAQs, and 1.0.1 drafts, incorporating important errata, updates, and brainstormed improvements.

The microformats community was quite busy this summer, and September brought a lot of forward progress. October is shaping up to be even more impressive.

For more microformats updates as they happen, be sure to subscribe to the microformats discuss mailing list and the @microformats Twitter.

microformatsDevCamp this weekend!

At our recent 4th birthday party, we started planning the first microformatsDevCamp — and we’re glad to report that it’s come together quite nicely!

Developers, designers, and all sorts of other microfolk are welcome to pitch in during this coming weekend, July 25-26, at one extremely cool venue: Automattic HQ, off of Pier 38 on the Embarcadero in San Francisco.

We began raising support for this event by collecting individual donations at the birthday party — thanks again to Object Adjective, Ribbit, and Spinn3r for their generous support of that event! We’re going to continue that at the microformatsDevCamp with a suggested donation of $20, which will also get you one of our limited-edition commemorative T-shirts!

Automattic HQ on the Embarcadero
Automattic HQ

In addition to Automattic’s offer to host the event, we’re currently seeking sponsors for the DevCamp itself, particularly for food and drinks. In keeping with our informal structure, we’re encouraging sponsors to pay for items directly; for example, Cindy Li is providing buttons and Object Adjective is bringing stickers. Our latest confirmed sponsor is CommerceNet, a long-standing partner that’s underwriting the opening night dinner.

Please ask your employers and other sponsors to join in — they can contact me, the “sponsor wrangler,” directly as rohit at khare dot org. We’re expecting 30-50 developers to join in, so even as little as $250 can have a real impact towards creating new tools, new applications, and new user interfaces for microformats!

And, of course, sign-up to participate by adding your name and interests to the  microformatsDevCamp wiki page!

Yahoo Placemaker, Optimus update, and one click microformats validator

The recent microformats momentum from the introduction of the value-class-pattern and Google & Yelp’s support continues with the launch of Yahoo Placemaker™, an update to Optimus, the open source microformats validator, and a browser button that makes it easy to one-click validate your microformats.

Yahoo Placemaker Beta supports geo and adr microformats

Congratulations to Yahoo on their recent launch of ! Yahoo Placemaker extracts locations marked up with the and microformats from web pages. See the Yahoo Placemaker documentation for details.

Optimus updated to v0.8 and supports value-title

, the open source microformats transformer that also happens to do an excellent job as a validator, has been updated to version 0.8.

Optimus v0.8 supports the recently developed ‘s “value-title” functionality. Optimus now also has its own twitter account that you can follow, . For microupdates on microformats in general, follow the twitter.

Get the Optimus microformats validator browser button

It’s hard to believe some of the first validation browser buttons* (for HTML, CSS, and links) were written over ten years ago, and now there’s one more:

> Optimus microformats validator

In most browsers, simply drag and drop the above “> Optimus microformats validator” link to your “Links Toolbar” / “Bookmarks Bar” / “Favorites Bar”. The Technorati Browser Buttons page has good additional installation instructions for browser buttons for various browsers.

Then go to any of your pages with microformats, click the newly created “> Optimus microformats validator” button in your browser toolbar, and read the validator report for suggested fixes and improvements to your microformats markup.

With both Google and Yahoo now indexing microformats like and , use the Optimus microformats validator to debug your microformats. Additional tools can be found on the .

*Browser buttons were originally called or . However, Google’s documentation calls them “Browser Buttons” which sounds much friendlier and free of tech-jargon origins.

Tags for this entry

In Search of Microformats

It’s been a very busy week for users of microformats. We made our announcement of the important new value-class-pattern over the weekend. That’s the culmination of a huge amount of brainstorming and community effort, and offers great improvements to using microformats accessibly and in international contexts.

Then since Tuesday, things have gone stratospheric. Google announced support for microformats right in their search engine, through a new ‘Rich Snippets’ feature, exposing hReview and hCard content within search results for many millions of users.

Rich Snippets give users convenient summary information about their search results at a glance. We are currently supporting data about reviews and people. When searching for a product or service, users can easily see reviews and ratings, and when searching for a person, they’ll get help distinguishing between people with the same name. It’s a simple change to the display of search results, yet our experiments have shown that users find the new data valuable—if they see useful and relevant information from the page, they are more likely to click through.

— Kavi Goel, Ramanathan V. Guha, and Othar Hansson in the Google Webmaster blog.

It’s a big day. hCards and hReviews are already published in huge quantities all over the web (see lists of sites that publish hCard and hReview), but this is the biggest user-base so far to benefit from the consumption of microformats in an application.

It’s again wonderful to see microformats embraced as a way to enhance user experience and to see it shipped to such a large audience, so congratulations to Kavi, Ramanathan, Othar and their Google team on the launch.

Initially Rich Snippets are only displayed for a handful of domains, so if you’re an hReview or hCard publisher, add yourself to Google’s waiting list now!. And if not already listed, update our examples in-the-wild wiki pages too (hCard, hReview).

If you’re a developer new to microformats we highly recommend you refer to the large set of code examples on our wiki, which will help you get started: hCard examples, hReview examples. There’s also full hCard and hReview documentation.

Finally, if you need help checking your code, check the debugging tools wiki page for validators, linters and debuggers.

It’s fantastic to see microformats applications hit such a large search audience. From the earliest experimental index at Technorati, to Yahoo putting microformats into mainstream search with SearchMonkey in March of last year; we’ve come a long, long way, and it’s looking great. With Google adding support for two of the major microformats, it really underlines structured data as a concrete foundation of the open web, and modern web development in general.

And yet more! An immediate benefit to everyone from the Rich Snippets release: Yelp have added hReview and hCards to all of their listings. You never need copy and paste a restaurant address by hand again!

Tags for this entry