How to embed W3C valid Youtube videos
Posted May 28th, 2010.
If you can find something worthwhile, posting an occasional YouTube video on your blog is quick and easy way to add a little content and pull in a few visitors. The problem for web designers is that the code to embed the video, like most outside sources, isn’t W3C valid.
Although the video might be great, using the it ruins your otherwise perfectly coded website, which is a real pain if your a stickler for keeping your website up to code. With a little cut and paste to the embed code however, you can still post the content without sacrificing your standards.
Copy and past the following code as your base…
<object type="application/x-shockwave-flash" data="EMBED URL" width="480" height="385">
<param name="movie" value="EMBED URL" />
<param name="FlashVars" value="playerMode=embedded" /></object>
…take just the URL portion from the embed code (shown below, also highlighted in bold here) and replace the EMBED URL sections shown above…
http://www.youtube.com/v/etEP1Bhgui0&hl=en_US&fs=1&
…and you can post your YouTube video while remaining W3C valid. Make sure to use the http address from the embed code, not the URL of your web browser.
You’ll also need to specify the width and height in the base code for whatever size you want the video to play. You can use the standard dimensions listed with the YouTube video or you can scale it to suite your needs, both will work.
Hope that helps.
Be sure to copy and past the base code to retain it exactly. Some of the formatting isn’t apparent as it wraps to the next line, if you partially copy or type it out you may break the code. Good luck.
