YouTube: changes to video embed code

Recently YouTube changed its HTML code to embed videos on your pages. Currently the object element has been replaced by an iframe element. This allows even more control over the final layout of the embedded video, though some inner controls are now delegated to the YouTube's engine itself. The good news is that now our markup is a lot cleaner and simpler, because we actually got rid of the annoying embed element contained in the object element. The final markup now looks like the following:

<iframe title="YouTube video player" class="youtube-player" type="text/html" width="640" height="390" src="http://www.youtube.com/embed/QVnRdCJLWX8" frameborder="0" allowFullScreen></iframe>

The most important changes are:

  • a class and title attribute attached to the iframe
  • the content type of the container element is now text/html
  • the URL of the src attribute is now in the form of http://www.youtube.com/embed/videoID, where videoID is the alphanumeric sequence contained at the end of a video's page URL (in this example is QVnRdCJLWX8
  • frameborder and allowFullScreen are not valid HTML attributes for this element, so you should bear this in mind when you want to pass the W3C validation.

Leave a Reply

Note: Only a member of this blog may post a comment.