Videos Indexed in the SERP

Did you know that major search engines want you to make video sitemaps for all of your embeds, even if you're hosting on Vimeo or Youtube?

Not only does it help them spider your website by giving the search engines clues as to where to look for video embeds, it may also earn your site a click through boost by giving you a picture in the SERP. Below I'll show you how I managed to index my Vimeo video embeds to include a thumbnail. The same steps may work for Youtube as well, including using iframes for embedding. There is a lively discussion about success (and failures) in the comments below.

Example Video in SERP

Benefits of a Video Sitemap

There are several reasons why you'll want to add a video sitemap.

  • It makes it clear to Google what your content is.
  • You have the opportunity to provide a range of details through schema.
  • Additional presence on video.google.com search.
  • RAD picture thumbnail, which is a pretty great call to action.

Video Embed Code

It's important to pay special attention during this part. Video embedding is largely done using iFrames these days and that poses a problem if you want the search engines to index your videos. For whatever reason Google doesn't currently spider iFrames. This is frustrating as iFrames are great for playback compatibility on mobile devices, iPads, and the like. There is a workaround, but first, let's discuss how a video sitemap works.

A video sitemap is simple guide for the search engine bot. Think of it as a map to treasure, it just makes it easier for the bot to find the treasure. If you use an iFrame, the bot can't find the video making the video sitemap useless. However, Google can find and spider standard object embeds, AKA the old fashioned way of doing things. With this in mind, I'm going to describe the safest way to get your videos indexed by using old embed code still available on Vimeo and Youtube. Here is a picture to help you find it:

Vimeo and Youtube Old Video Embed

Embed Code

If you found it correctly your embed code should look something like this. (vimeo example)

Example Video Embed Code

You don't have to cleanup your code like I did above, I only did it so we could easily see what's happening. Pay special attention to the embed src line, the URL inside looks like this..

vimeo: https://vimeo.com/moogaloop.swf?clip_id=35117351

youtube: https://www.youtube.com/v/VMeXGE_a8Gg

This is the RAW video player link, it tells google/bing where to find the original video file. We'll need this information later when building the video sitemap.

Nested iFrame/Embed *OPTIONAL*

There is one thing worth mentioning. Some people have developed a technique to trick google and still use an iFrame. I haven't actually tried it myself as I'm happy playing it safe with the old method and showing up in the SERP.

Anyhow, the idea is that you use the new iFrame code and the old embed code at the same time with the noframes tag. This essentially nests the two videos, such that end users will see the new html5 iFrame version and google is served the old embedded version.

A couple drawbacks worth mentioning.. First, this is technically cloaking content as you're serving one thing to the user and giving google something else. Second, your page will take longer to load as the original embed starts to fire up before the iFrame gets control. Lastly, noframes wasn't designed to work like this, it's a hack. With that in mind here is what it'd look like:

Noframes nested in iFrame

Video Sitemap Requirements

Now that you have your embed code all sorted out, it's time to start working on the video sitemap. Google requires that your video sitemap MUST contain the following information and that it should MATCH what is on your webpage. 

  • Title - This should be the same as the title of the page your video appears.
  • Description - Make this exactly match the meta description of your page.
  • Play page URL - The canonical URL of the page your video appears.
  • Thumbnail URL - By thumbnail they mean a high resolution image up to 1920x1080.
  • Raw video location - This is the embed src link noted from above pointing at the clip.
  • More Details: Google: Creating a Video Sitemap

Example Video Sitemap

The best way to learn how a video sitemap works is to see one. First start by creating a new file, name it something like: video-sitemap.xml

Then fill it in so that it looks like the example sitemap below, except replace the white text with your own information. For every video you have copy/paste the <url></url> block. In the example below there are two video URL blocks, the top block has descriptors for the fields, the bottom block is exactly what my video sitemap looks like. I prefer to keep mine in chronological order with the newest video on top. Once you're done you'll upload it to the root of your website ex. https://yourdomain.com/video-sitemap.xml

Example Video Sitemap

Tweak Robots.txt

This isn't absolutely necessary, but it doesn't hurt. Add your sitemap to your robots.txt file. Don't worry about being redundant, you can have a video sitemap describe the same page as a standard article sitemap. To add your sitemap to robots.txt place the following line at the top:

Sitemap: https://yourdomain.com/video-sitemap.xml

Update Google Webmaster

Once you're ready with your sitemap head over to Google Webmaster Tools and submit it under site configuration. Google will crawl it and report if there are any errors. If everything looks good the videos will be queued to be spidered and you should see them online after about a week.

Conclusion

This is actually the bare minimum to get you started. There is a lot of depth to the schema and you can include a range of details in your video sitemap including tags, categories, and author just to name a few. Hopefully with the above information you can get your embedded vimeo/youtube videos indexed with a picture. Feel free to contact me if you get stuck or check out my video sitemap at https://winefolly.com/video-sitemap.xml.

Source of noframes trick https://www.reelseo.com/vimeo-sitemaps/