Create enhanced results on Yahoo! and Facebook with Share markup
Yahoo! announced support for enhanced search results last week based on Facebook Share and Resource Description Framework in attributes (RDFa) markup. Website owners can add a few meta tags to their pages to boost click-throughs from a more visual Yahoo! Search result and ease the process of sharing a link on Facebook at the same time. In this post I will cover the major categories of enhanced share types — audio, images, video, news, blogs, games, documents, and multimedia — and walk through how site owners can stand out on shareable platforms. Yahoo! and Facebook are just the first two platforms to collaborate on this effort. Expect more announcements from a variety of activity stream and Uniform Resource Locator (URL) share providers in the future.
Why add special markup?
Shared pages and search results contain, at a minimum, a title and a description extracted from your site’s <head>. You can enhance your search and share capabilities by explicitly specifying a thumbnail image or playback data you would like included directly alongside mentions of your pages.
<meta name="title" content="Apple iPhone 3G" />
<meta name="description" content="iPhone 3G combines three products in one..." />
<link rel="image_src" type="image/jpeg" href="http://www.apple.com/iphone/iphone_thumb.jpg" />
Thumbnails appear alongside Yahoo! search results in a 54 pixel high by 98 pixel wide image window. Thumbnails might be overlaid with a call to action for supported mediums and their embedded players.
Supported mediums
The Facebook Share Application Programming Interface (API) supports annotating a page as audio, video, generic multimedia, an image, blog content, or news content. Publishers simply add a single line to their pages to help Facebook classify the type of page shared by their users and apply the appropriate specialized handling.
<meta name="medium" content="blog" />
Yahoo! Search currently supports enhanced search results for video, games, and documents (all wrapped in a Flash player). Playback Shockwave Flash (SWF) files must be white-listed by Yahoo! before they are supported for inline playback (Facebook also white-lists). Yahoo! currently supports the following websites’ embedded Flash players:
Video — Hulu, YouTube, Yahoo! Video, Metacafe
Games — Playcrafter
Documents — Scribd, SlideShare
Inline audio
Facebook supports track title, artist name, album name, and a direct link to the audio through its share interface. Facebook users should be able to playback MP3s and other popular audio formats from their social news feed.
<meta name="medium" content="audio" />
<meta name="title" content="Pearl Jam - Black" />
<meta name="description" content="Sheets of empty canvas, untouched sheets of clay..." />
<link rel="image_src" type="image/jpeg" href="http://pearljam.com/ten.jpg" title="Ten Album cover" />
<link rel="audio_src" type="audio/mpeg" href="http://pearljam.com/black.MPEG-1 Audio Layer 3 (MP3)" />
<meta name="audio_type" content="audio/mpeg" />
<meta name="audio_title" content="Black" />
<meta name="audio_artist" content="Pearl Jam" />
<meta name="audio_album" content="Ten" />
Inline video
Video sites should specify their embedded player and its desired height and width on each video page. White-listed players will be played back directly in a social news feed.
<meta name="medium" content="video" />
<meta name="title" content="The Daily Show with Jon Stewart: Thu, Mar 12, 2009" />
<meta name="description" content="Jon Stewart and CNBC's Jim Cramer go face to face in the studio." />
<link rel="image_src" type="image/jpeg" href="http://thumbnails.hulu.com/73511_145x80.jpg" />
<link rel="video_src" type="application/x-shockwave-flash" href="http://www.hulu.com/embed/_3TIApx3ymwKbAfZnz-MKA" />
<meta name="video_width" content="512" />
<meta name="video_height" content="296" />
<meta name="video_type" content="application/x-shockwave-flash" />
Summary
Search results pages and social news feeds provide new sources of referrals for connected sites. Webmasters can spice up their pages with a few extra meta tags to stand out any time a machine or a human decides to share your content with others. Adding thumbnails to a page, something as simple as a user profile picture in a social context, is a simple step that will help your content stand out from the crowd.
Publishers supporting embedded Flash players should consider the impact of off-site inline playback on their business. If you’ve already embraced spreading your SWFs far and wide you should jump on the white-list queue early to gain a competitive advantage through partners such as Yahoo! and Facebook.