RDFa Markup for Videos

Send to Kindle

With the recent loss of keyword data in Google Analytics and the launch of the new Hummingbird search algorithm, SEOs are presented with some new challenges and opportunities. One of the opportunities which is more pronounced now than ever before is the use of structured data markup.

One area that has been largely ignored by many is the ability to mark up videos, in order to convey as much information as possible to the search engines. With the growing popularity of videos, particularly via Google Hangouts and YouTube, this is an opportunity that’s too good to miss.

Why Markup a YouTube Video for Structured Data?

You probably already know what a standard YouTube URL looks like:

http://www.youtube.com/watch?v=86GHCVRReJs.

The last portion, 86GHCVRReJs, is the video ID. But there can be variations to this URL.

If you want to share that video as a link, for instance, YouTube provides a share code, like this: http://youtu.be/86GHCVRReJs. If you want to embed it on your website, they offer an embed code, like this:

<iframe width="420" height="315" src="//www.youtube.com/embed/86GHCVRReJs" frameborder="0" allowfullscreen></iframe>

The embed code identifies and locates the video, but it also sizes it, determines the border and allows for full screen viewing, all within an iframe. But iframes and semantic markup don’t always play well together and there’s really no need to use iframes they way we prefer to do it.

There is a wealth of information that can be communicated to the search engines without cluttering up the user’s experience. For a few reasons, we combine our accessibility solutions with our markup, to keep things tidy.

How to Markup a Video with RDFa

The RDFa markup in the example (at the bottom of the page) addresses a number of different areas. It provides the ability to be viewed by all users, whether they’ve enabled JavaScript or not, as well as bearing a nocookie attribute. It can also incorporate several other features, some of which don’t apply to this particular example.

By using RDFa (Yahoo! SearchMonkey), you’re assured of your markup being supported by Google, Bing and Yahoo! The same is true of schema.org, but RDFa is much more extensible. It also has the ability to enable markup for multiple videos on a page, unlike Share and OpenGraph.

When using Yahoo! SearchMonkey RDFa, the following properties are supported:

  • Property Description
  • media:video (Required.) A URL to the video to play when the user clicks the “play” button.
  • xmlns:media (Required.) Must consist of the following URL: “http://search.yahoo.com/searchmonkey/media/”.
  • media:thumbnail (Required.) A URL pointing to a preview thumbnail, which must be a GIF, PNG, or JPG image. The preview thumbnail must be hosted on the same domain as the video.
  • xmlns:dc A valid URL to the Dublin Core namespace. The only acceptable value is “http://purl.org/dc/terms/”. Required only if you are using Dublin Core metadata such as dc:description.
  • dc:license Indicates the license for this content. You may use dc:license or cc:license.
  • dc:description A short (up to 200 characters) description of the video.
  • media:title Specifies the title of a video. Up to 60 characters.
  • media:width The video’s width in pixels, including any “chrome” provided by the third-party player.
  • media:height The video’s height in pixels, including any “chrome” provided by the third-party player.
  • media:type The video’s MIME-type. Currently, the only acceptable value is application/x-shockwave-flash.
  • media:region An international region where the video may be played. The default is * (play in all regions).
  • media:duration The duration of the video, in seconds.

(Note that there are some properties that are required, and a couple that, at present, have only one acceptable value.)

RDFa markup really isn’t as complex as it may seem at first glance. As is the case with any coding effort, of course, spaces and operators can be critical to proper processing. Fortunately, there are on-line tools for checking your markup for configuration and function. Google’s Rich Snippet Testing Tool can be helpful in ensuring your markup is correct.

Rather than walking you through each line of code to explain what the markup does, I’m going to suggest you read it. That way, you’ll learn to understand it and you’ll retain the process better. Every video you decide to markup with RDFa will contain the same elements, just perhaps with different values.

Pick a video and mark it up, then put in online and run it through Google’s testing tool. You can watch this 1-1/2 minute video first, for a broad understanding, and if you need more specific guidance, you can also visit this Google Webmaster Tools Help page on the topic.

If you’d like still more information, visit the W3C website – there’s a wealth of information there on semantic markup. Here are a few good starting points, for understanding the procedure:

Example: Markup for the above video:

<div><object type="application/x-shockwave-flash" width="560" height="315" data="http://www.youtube.com/v/86GHCVRReJs?version=3&amp;hl=en_US"
xmlns:media="http://search.yahoo.com/searchmonkey/media/" xmlns:dc="http://purl.org/dc/terms/" rel="media:video" property="og:video" content="http://www.youtube-nocookie.com/v/86GHCVRReJs?version=3&amp;hl=en_US" resource="http://www.youtube-nocookie.com/v/86GHCVRReJs version=3&amp;hl=en_US"><param name="movie" value="http://www.youtube.com/v/86GHCVRReJs?version=3&amp;hl=en_US"/>
<param name="allowFullScreen" value="true"/>
<param name="allowscriptaccess" value="always"/>
<param name="movie" value="http://www.youtube-nocookie.com/v/86GHCVRReJs?version=3&amp;hl=en_US"/>
<param name="wmode" value="transparent"/></object><a rel="media:thumbnail" href="http://i1.ytimg.com/vi/86GHCVRReJs/default.jpg"></a>
<a rel="dc:license" href="http://www.youtube.com/yt/copyright/creative-commons.html"></a>
<span property="dc:description" content="Does it make sense to use rel="nofollow" for internal links? Like, for example, to link to your login page? Does it really make a difference?"></span>
<span property="media:title" content="Should I use rel="nofollow" on internal links to a login page?"></span>
<span property="media:width" content="420"></span>
<span property="media:height" content="315"></span>
<span property="media:duration" content="148"></span>
<span property="media:type" content="application/x-shockwave-flash"></span>
<span property="media:expirationDate" content="*"></span>
<span property="media:region" content="*"></span>
<span property="og:title" content="Should I use rel="nofollow" on internal links to a login page?"></span>
<span property="og:video:width" content="560"></span>
<span property="og:video:height" content="315"></span>
<span property="og:url" content="http://www.youtube-nocookie.com/v/86GHCVRReJs?version=3&amp;hl=en_US"></span>
<span property="og:video:type" content="application/x-shockwave-flash"></span>
</div>

Additional information about video best practices by Google.

John Britsios

Founder and Chief Information Officer (CIO) of SEO Workers and Chief Executive Officer (CEO) of Webnauts Net, a qualified Forensic SEO & Social Semantic Web Consultant, specializing in Semantic, Forensic & Technical Predictive Search Engine Optimization, Content Marketing, Web Content Accessibility, Usability Testing, Social Semantic Web based Responsive Web Design & Ecommerce Development, UX & Funnel Optimization, Conversion Rate Optimization.

More Posts - Website - Twitter - Facebook - Google Plus