Embedding Flash into HTML

Posted: October 15th, 2010 | 1 Comment »

HTML4/ XHTML

The <embed> tag was deprecated in HTML 4 and XHTML and while most browsers still support it,  your code won’t validate if it is used.  So if this is an issue for you then the best way to achieve valid code and include an .swf is with the <object> element

A lot of tutorials I have read about adding flash into html4 and xhtml usually show this method :

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="960" height="500">
<param name="movie" value="flash.swf" />
</object>

However the issue with the method above is that it doesn’t work with that wonderful browser known as Internet Explorer. So to fix that issue this can be used instead:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="960" height="500">
<param name="movie" value="flash.swf" />
<!--[if !IE]> <-->
<object data="flash.swf" width="960" height="500" type="application/x-shockwave-flash">
<param name="pluginurl" value="http://www.macromedia.com/go/getflashplayer" />
</object>
<!--> <![endif]-->
 </object>

While this looks a lot messier it will display the flash file in Internet Explorer and it will validate.

HTML5

HTML5 has actually reintroduced the <embed> tag and while there is much debate about flash’s future because of HTML5′s canvas, this is still worth a mention. So should you be coding using HTML5 here is an easier way to place flash content within your website:

<embed src="flash.swf" width="600" height="900" />

SWFObject

SWFObject is a more flexible way of embedding a flash object into html by using an unobtrusive JavaScript method. One of the major benefits of using SWFObject is that if the flash player is outdated or isn’t installed, instead of there being a block missing from the site it will display alternative content such as an image, meaning that those that choose not to or can’t have flash installed can still see something rather than nothing.
Visit the SWFObject page for more information

One
Comment

  • webdesign
    October 19, 2010 | Permalink |

    Wow this is a great resource.. I’m enjoying it.. good article

Have Your Say

Your email is never shared. Required fields are marked *
To add code to a comment use this [code] your code here [/code]