How to properly embed Macromedia Flash objects
If any of you has been visiting this blog through Mozilla with the Tidy-based HTML validator extension, you may notice that the page now validates perfectly with no error and no warning at all, instead of having 1 warning like before. The problem had to do with the Flash movie from YouTube. The HTML code that YouTube supplied contained the <embed /> tag, which is not recognised by the W3C’s HTML and XHTML specifications. Being a standard-compliant freak, I have been asking around for weeks about how to get rid of the warning; and then, just an hour ago, I read the HTML 4.01 specifications again and found >this<.
Before - the original code from YouTube:
<object width="425" height="350">
<param name="movie"
value="http://www.youtube.com/v/iIIoc8R26iM" />
<embed src="http://www.youtube.com/v/iIIoc8R26iM"
type="application/x-shockwave-flash"
width="425" height="350" />
</object>
And after - the new code I figured out:
<object width="425" height="350"
data="http://www.youtube.com/v/iIIoc8R26iM"
type="application/x-shockwave-flash">
Yellow Fever
</object>
Notice, however, that Microsoft Internet Explorer does not understand the second, correct version. It is a long-known fact that Internet Explorer’s HTML rendering engine is broken in many different places, with respect to the W3C specifications. Therefore, JavaScript needs to be used to determine which version to use:
<script type="text/javascript">
IEString = '<object width="425" height="350">'+
'<param name="movie" '+
'value="http://www.youtube.com/v/iIIoc8R26iM" />'+
'<embed src="http://www.youtube.com/v/iIIoc8R26iM" '+
'type="application/x-shockwave-flash" '+
'width="425" height="350" />'+
'</object>';
MozString = '<object width="425" height="350" '+
'data="http://www.youtube.com/v/iIIoc8R26iM" '+
'type="application/x-shockwave-flash">'+
'Yellow Fever'+
'</object>';
// The "browser" string is assigned by a nice
// browser detection script from quirksmode.org
if(browser == "Internet Explorer")
document.write(IEString);
else
document.write(MozString);
</script>
I hope this little piece of information helps those of you who want to use Flash on your webpages while being standard-compliant. I admit that the script does not take even other browsers like Opera, Safari, and Konqueror into account. I have not used those browsers long enough to know their behaviours off the back of my head. You are welcome to leave comments to help me improve the script. Notice also that, due to the default text processing options of WordPress, just pasting the script section inside a post usually does not work. You need to employ one of the solutions described >here<.
March 14th, 2006 at 2:14 pm
The problem with the standard specific cose u are using is that it might only work on Mozilla. This is why the embed tag is there.
Also, why would you care if the site validates, if it means that 90% of the people online can’t see your site?
Would you do the same if this was a buisiness site? I guess not :p but the same is true for personal sites no? I say this beacsue in the begining when i was making my site in refused ALL hacks or work arounds. But later simply gave in and did the smallest amount i needed to get things looking perfect
Cheers
March 14th, 2006 at 5:28 pm
Yes, I know. I have thought of using JavaScript to write out the proper tag at load time, but then those who don’t use JavaScript won’t be able to see the video either. Can I assume that the visitor has JavaScript enabled if he/she also has Flash player installed?
March 15th, 2006 at 3:54 pm
I think you can;
I have given up on the idea that some ppl might not have Javascript enabled; Why wouldn’t they
Notice though that you might be forced to used javascript with IE from now becasue of that STUPID STUPID patent law suit against them.
Prior art on plugins; Hum, sometimes things like this make me feel like I should pattent every single idea i get.
March 15th, 2006 at 4:53 pm
I have dealt with Javascript in the past, I even made myself a site that did something along the lines of AJAX, which I should make available sometime soon when I find it.
However, I have completely given up on JavaScript. I don’t really know why, but I just hate it. I believe in simple, standard web design. In terms of compatibility, it depends what I am doing. For my own site, I do firefox, but for other people you have to go with what they use.
March 19th, 2006 at 5:29 pm
Issues with Javascript are honestly the biggest concern of mine while developing. With the advent of hidden divs and other similar design choices, it is important to make sure that Javascript-disabled browsers have an ability to surf your website.
Personally, I would probably make a simple cellphone-like interface and leave it for them. Let the luddites live in their world of pure text.
March 19th, 2006 at 5:42 pm
I chose to solve the problem with JavaScript because my assumption is that if the visitor’s browser does not support JavaScript, why would it even support Macromedia Flash. So I don’t think I lose anything by using JavaScript here.
March 25th, 2006 at 6:39 pm
http://encytemedia.com/blog/articles/2005/10/13/dispelling-the-myths-of-javascript-degredation
June 4th, 2006 at 1:44 am
besides now that MS has lost their lawsuit on the whole IE plugin architecture you have to use javascript to place any embed or object tags in a web page for the behavior to be consistent to past behavior
June 4th, 2006 at 11:11 pm
Wow, Kevin, long time no see!
How are you doing?