Yesterday’s Mac vs. PC post should have been straightforward, except that it contained three video clips, each of which I wanted to embed in a standards-compliant way whilst maintaining maximum browser compatibility (i.e. ignoring the official advice from Adobe on embedding Flash content and Apple’s advice for embedding QuickTime content by avoiding the non-standard <embed> element and just using the <object> and <param> elements)… what a task that turned out to be.

To be honest, a lot of the problems probably came down to me not thinking my code was working because the preview function in my content management system (Blogger) failed to display the videos in one browser or another so, after another late night, I decided to publish and be damned. The resulting code seems to work for the Flash content on most the the browser/operating system combinations I have tried (Mozilla 1.7.13 and Firefox 1.5.06 on Linux; Internet Explorer 7.0.5730.11 on Windows XP, Safari 2.0.4 and Firefox 2.0.0.1 on Mac OS X – Intel), although I was using Adobe Flash Player 9 (I’m not sure which version is needed for the clips I used so I didn’t update the codebase attribute to reflect it – older player versions will not automatically update until I fix this) and I’m aware that there may still be some issues with the QuickTime clip (it does seem to be working on Firefox and IE though).

So, how should this be done?

Firstly, the valid Flash, video, and audio embed (object) markup post at the Web Standards Project links to some great articles which should be read, namely:

• Flash satay: embedding Flash while supporting standards.
• Bye bye embed.
• Object embedding.

These give the background to why the <embed> element shouldn’t be used, as well as demonstrating the use of conditional comments to force certain browsers into compliance. I actually used another variation on this theme – David Grudl’s how to correctly insert Flash into XHTML – ironically this uses a negated version of Internet Explorer-specific conditional comments to force IE into ignoring code intended for other browsers!

Then, there is the issue of the changes made to the behaviour of ActiveX content in Internet Explorer, following the Eolas patent suit, as described by Robert Nyman. In my case, it doesn’t really matter if you need to activate a control to view a video clip on my blog; however there are some workarounds. Most use JavaScript (indeed Adobe recommends a JavaScript-based workaround to the changes made in Internet Explorer) and one popular alternative is to use document.write in an external JavaScript function to dynamically re-write the object embedding code. Alternatives include Geoff Stearns’ SWFObject (formerly known as FlashObject) and Bobby van der Sluis’ unobtrusive flash objects (UFO). I plumped for a version I found in a comment by Karl Rudd the Robert Nyman post that I linked earlier (Fix It uses a similar concept, also advocated by David Grudl in his post on how to avoid activation of ActiveX in IE).

After spending most of yesterday working on the object embedding, and a good part of this morning writing about it here, I think I’ll leave that one alone now, unless anyone has any better ideas to fix my code (note that the <br /> tags scattered through it were added by Blogger – not by me).