You’ve probably read a few things about video SEO: what it is, what it can do for you, how important it is for increasing your video audience. You’ve probably even read some articles giving you basic guidelines on how to follow up on video SEO. There’s a good change you’ve heard about video sitemaps and putting “rich snippets” in your page contents.
But how do you create a proper video sitemap? And how do you make sure the “rich snippets” in your page contents are not considered to be gibberish by the mighty Google indexing engine? For a good basic understanding of the what and the why of optimizing your video for search engines ,I’d recommend reading this article about video SEO first.
In this blog post I hope to get you on your way implementing video SEO on your website. If you are a user of our own Online Video Platform this blog might be particularly interesting to read as I will be using examples that can easily be ported to your situation. If you are not a user of our Online Video Platform this blog will still be interesting to read if you are looking for more knowledge about developing a video sitemap or implementing Google approved microdata in your video pages.
Let’s start with a quick summary of the aspects of Video SEO you should concentrate on:
- use rich snippets in your site to accompany embedded video with a rich set of relevant meta data.
- use a video site map to make sure Google (and other search engines) knows what video “landing pages” you want them to store in their index.
- use closed captions to provide contextual meta information with the actual video content.
- use link building to generate more traffic on your video pages.
If by now you think “how do I ever implement Video SEO on my website” I have good news: The Blue Billywig OVP can help you with at least three Video SEO corner stones.
Rich snippets
Enrich the code on your video page
Tell the search indexers specifics about your content: Videos embedded on a website need to be surrounded by specific meta tags that point out typical video information like: source, duration and embed URL To add the right tags for every video and playout or subsection on your website would take quite a significant development effort.
To make things easier we have developed the Microdata API entrance. This API entrance delivers the appropriate rich snippets for any Blue Billywig video embed code. For an overview of all available options please read the technical documentation at: Microdata API. The microdata API entrance can deliver tags in a JSON or XML(HTML) formatted document.
This service makes implementing rich snippets a breeze in virtually any server- or client side programming language. “Client-side ?” I hear you ask. Do search engine robots execute client side scripts like a browser would? Well, yes and no.. Since May 2014 Google does seem to execute Javascript code while indexing pages. Read more in this blog post on Google indexing dynamic content.
However – as not much other search engines or social channels (e.g. Facebook) follow Google’s lead – it’s still a good idea to use a server-side programming language to implement the OpenGraph and Microdata meta information on your video pages.
Using this API entrance not only makes it easy to implement a rich snippet per video on your web site, it also makes the snippet’s content easily adaptable: If you decide to update your video metadata in the Blue Billywig OVP or use different playback settings entirely the rich snippet will adapt itself automatically.
The following PHP code snippet provides an example of using our Microdata API entrance to fetch the correct meta tags and place them in a video-containing page. For ease of use we’ve only used the “Microdata” feature of our Microdate API entrance. The API entrance can also be used to generate ready to use OpenGraph tags. Feel free to adapt or translate the example to your website’s server side code.
<?php // just a simple sanity check: id should be set and numeric. Only provided as an example if(is_numeric($_REQUEST['id'])){ $videoID=$_REQUEST['id']; $playout=$_REQUEST['playout']; // create url to the xml (html) output of the microdata API entrance $mdUrl='http://demo.bbvms.com/microdata/?c=' . (int)$_REQUEST['id'] . '&p='. $_REQUEST['playout'].'&mst=0&MD=1&rf=xml'; // create embed url $embedUrl='http://demo.bbvms.com/p/' .$_REQUEST['playout'] . '/c/' . (int) $_REQUEST['id'] .'.js'; // fetch the microdata $microdata=file_get_contents($mdUrl); // get the name from the mircodata to use as <title> $dom=DOMDocument::loadHTML($microdata); $xp=new DOMXPATH($dom); $nameEls=$xp->query('//meta[@itemprop="name"]'); if(count($nameEls) >0){ $nameEl=$nameEls->item(0); $title=$nameEl->getAttribute("content"); } } // the actual html output is made up below ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title><?php if (!empty($title)) echo $title;?></title></head> <body> <?php echo $microdata; if(! empty($title)){ ?><h1><?php echo $title;?></h1><?php } ?> <script type="text/javascript" src="<?php echo $embedUrl;?>"></script> </body> </html>
The above code example fetches a rich snippet in Microdata format and places it in the <head>
section of the resulting html document. It also acts as a simple view page – displaying the video’s title and embedding the video player.
The following lines point to the Blue Billywig OVP Microdata and Embed API entrances:
$mdUrl='http://demo.bbvms.com/microdata/?c=' . (int)$_REQUEST['id'] . '&p='. $_REQUEST['playout'].'&mst=0&MD=1&rf=xml'; // create embed url $embedUrl='http://demo.bbvms.com/p/' .$_REQUEST['playout'] . '/c/' . (int) $_REQUEST['id'] .'.js';
to reflect your situation. The Microdata API entrance can be reached by using: Your Blue Billywig OVP host name: in this case http://demo.bbvms.com
followed by: /microdata
and at least some parameters that point to a specific video clip and playout: c for clip id and p for playout.
You can see this code in action on: https://www.bluebillywig.tv/videoseo/?id=2534723&playout=default
If you look at the resulting HTML source code you’ll notice several Microdata tags have been added:
<!-- ======================= Schema.org microdata ======================= --> <span itemscope=""itemtype="http://schema.org/VideoObject"> <metaitemprop="name" content="Blue Billywig - promo video"/><meta itemprop="duration" content="T4M37S"/> <metaitemprop="thumbnailUrl"content="http://demo.bbvms.com/mediaclip/1151637/pthumbnail/130/130.jpg"/> <meta itemprop="embedURL"content="http://demo.bbvms.com/p/default/player6b5a51d498963f7d00b89fd90b154cfc.swf?defaultMediaAssetPath=http://d2iuihtptygnoe.cloudfront.net&server=http://demo.bbvms.com/&clipXmlUrl=http://demo.bbvms.com/mediaclip/1151637.xml&autoPlay=true"/> <metaitemprop="uploadDate" content="2011-06-14T14:10:41+02:00"/> <meta itemprop="dateCreated"content="2011-06-14T14:10:41+02:00"/> <metaitemprop="dateModified" content="2011-06-15T12:44:30+02:00"/> <meta itemprop="datePublished"content="2011-06-14T14:11:32+02:00"/> <metaitemprop="author" content="Blue Billywig"/> <metaitemprop="keywords" content="blue billywig promo 2008 huisstijl dqa"/> <meta itemprop="description"content="Lancering nieuwe huisstijl 2008"/> </span>
Most of the used tags will speak for themselves. There’s a video still or thumbnail:
<meta itemprop="thumbnailUrl"content="http://demo.bbvms.com/mediaclip/1151637/pthumbnail/130/130.jpg"/>
An embed URL that in this case links to a directly embeddable auto-playing Flash video player:
<meta itemprop="embedURL" content="..."/>
And some textual information tags like keywords and description:
<meta itemprop="keywords" content="blue billywig promo 2008 huisstijl dqa"/> <meta itemprop="description" content="Lancering nieuwe huisstijl 2008"/>
Please read Wikipedia: Microdata for full details about the Microdata web standard that’s being used here. Try for yourself if your video page is approved by Google’s test tools.
Use closed captions
Describe what happens in your video
Besides providing short meta information using Microdata it’s also a good idea to add closed caption tracks to your video items. The Blue Billywig OVP has support for adding multiple closed caption tracks to your video items. You can use this feature to add a descriptive text about your videos. Both the popular .SRT format and the W3C timed text markup language are supported so you should have no problem using your favorite caption editor to create descriptive closed captions.
Get search engines to find your video content
Implement a video site map
Now that we’ve implemented code on our video view page to provide search engine indexers with details we still need a way to actually make them come visit the right URLs. This is where the video sitemap comes into good use. The Blue Billywig OVP provides an easy method for web developers to implement a proper and major search engine compliant video sitemap. It uses a clip list per video sitemap.
By using a dynamic clip list you can use meta tags in your video clips to determine wether a clip should be added to the video sitemap. For detailed technical information about the Blue Billywig OVP integrated video sitemap handler please visit: Video sitemap generator.
For this blog post I’ve created an example dynamic clip list that only contains the promo clip we used in the example above. This clip list can be fetched – formatted as a video sitemap – as follows: https://demo.bbvms.com/sitemap/1453882680401340.xml where 1453882680401340 is the ID of the clip list. All clips in the clip list should have a valid deeplink URL that points to the display page of the video containing the Microdata tags. But we’re not there yet.
There are still 2 remaining steps to make your video sitemap actually work:
- Make it accessible from your web domain
- Submit it in Google webmaster tools
Host the video sitemap on your domain
For the video site map to have any authority pointing to videos on a website it needs to come from that same website. There are many ways to achieve that. As an example I’ve included a simple php code snippet “videositemap.php”:
<?php header("Content-type: text/xml"); echofile_get_contents('http://demo.bbvms.com/sitemap/1453882680401340.xml');
After changing the clip list URL http://demo.bbvms.com/sitemap/1453882680401340.xml
with your own freshly created cliplist-as-a-sitemap place this code in a file videositemap.php below the document root of your web server and test it’s video sitemap output.
Let Google know about your video sitemap
Now our video sitemap can be reached at a proper URL: http://www.bluebillywig.tv/videoseo/sitemap.php. Only one step left to Video SEO sweetness: submit your new video sitemap in Google Webmaster Tools.
Eating
The proof of the pudding is in the eating. Wait a few days and check how you’re doing by googling for: site:YOUR SITE NAME
and clicking on videos. If all is well you should see your videos actually being present as video content, containing your selected video still as a thumbnail and all meta data Google fetched from your video sitemap and rich snippets.
I hope this blog post has helped to get you started with Video SEO . For more details or tailored consultancy on how to get your videos listed don’t hesitate to contact us.