XHTML compliant YouTube embedding.

September 3rd, 2008 by Chris

I’m sort-of anal when it comes to having standards compliant markup. So it annoys me to find out that YouTube’s default code for embedding videos is not compliant. Thanks to Bernie Zimmermann (and the commentors) for figuring out how to do this better.

You’ll need to change this*:

<object width="425" height="344">
<param name="movie" value="http://www.youtube.com/v/b3nodga6qmU&hl=en&fs=1"></param>
<param name="allowFullScreen" value="true"></param>
<embed src="http://www.youtube.com/v/b3nodga6qmU&hl=en&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="344"></embed>
</object>

To this:

<object type="application/x-shockwave-flash" width="425" height="344" data="http://www.youtube.com/v/b3nodga6qmU&hl=en&fs=1">
<param name="movie" value="http://www.youtube.com/v/b3nodga6qmU&hl=en&fs=1" />
<param name="wmode" value="transparent" />
</object>

Or copy the second block of code and paste the URL of the video of interest into the “data” and “value” fields. Also verify that the height and width are correct.

* Shout out to the WP_CodeShield plugin for automatically formatting HTML code inside the “code” tags.

2 Responses to “XHTML compliant YouTube embedding.”

  1. The Manlius Formation » Blog Archive » Sledding Marathon Says:

    [...] sledders headed for the road. Safety first, I always say. Huzzah to Chris for his tutorial on XHTML-compliant YouTube embedding. [...]

  2. Scott Says:

    Thanks for this great technique… I have a client who is anal about their site validating xhtml 1.1 strict, and the embedded youtube vid was holding us up! This did the trick nicely :)

Leave a Reply