Schema.org Markup for YouTube Videos
If you make it easier for a search engine to learn what’s on your website, the search engine will reward you with better rankings or better descriptions in the results pages (SERP). For example, you can help Google (Bing, Yahoo, Yandex, Baidu,..) to recognize videos on your site by adding markup data to the video. The exact specification how you can do that can be found at schema.org . Here’s a more reasonable approach, useful if your video is already on YouTube, Vimeo or any other hosting service.
Here is an example how Google wants you to markup a video :
<div itemprop="video" itemscope itemtype="http://schema.org/VideoObject"> <h2>Video: <span itemprop="name">Title</span></h2> <meta itemprop="duration" content="T1M33S" /> <meta itemprop="thumbnailUrl" content="thumbnail.jpg" /> <meta itemprop="contentURL" content="http://www.example.com/video123.flv" /> <meta itemprop="embedURL" content="http://www.example.com/videoplayer.swf?video=123" /> <meta itemprop="uploadDate" content="2011-07-05T08:00:00+08:00" /> <meta itemprop="expires" content="2012-01-30T19:00:00+08:00" /> http://www.example.com/videoplayer.swf?video=123" <span itemprop="description">Video description</span> </div>
You need to provide the data for each itemprop element. Name, Duration, UploadDate and Description are fairly obvious, the remaining ones can be complicated. Usually all you have is the video id, which is part of the embed link given to you by YouTube. But where are your thumbnails and your contentURL ? Google will help you with their structured data testing tool. The tool extracts markup data from existing pages. Why not extract it from the original YouTube page. Here’s a small segment of the output for one of my client’s videos.
Item
type: | http://schema.org/videoobject | ||||||||||||||||||||||||||||||||||||
property: | |||||||||||||||||||||||||||||||||||||
|
<div itemprop="video" itemscope itemtype="http://schema.org/VideoObject"> <p>Check out our new <span itemprop="name">Total Concepts Salon</span> commercial on YouTube ! </p> <meta itemprop="duration" content="T1M01S" /> <meta itemprop="thumbnailUrl" content="http://img.youtube.com/vi/m6fmZOhs5N4/hqdefault.jpg" /> <meta itemprop="URL" content="http://www.youtube.com/watch?v=m6fmZOhs5N4" /> <meta itemprop="embedURL" content="http://www.youtube.com/watch?v=m6fmZOhs5N4" /> ..actual embedded URL here.. <span itemprop="description">An affordable, upscale salon in Cary, NC. </span> </div>
Thanks for the article. In your example, you use the URL for the embedURL and add “..actual embedded URL here..” This was confusing. Why not use ?
Thanks for the schema.org example, even after implementing the schema.org as per you client video example, i am not able to get the video thumbnail on google search results, how long does it take for the google to the show the video thumbnail.