Introduction
Macromedia Flash is a popular way to add interesting visual effects to web pages. Whether Flash is “good”, “evil”, or somewhere in between is beyond the scope of this web page. Rather, we will simply assume that you want to show a flash movie on a web page for some good reason.
Flash movies are constructed using a Flash authoring program, such as the one from Macromedia that is available by clicking the round red icon with an F in the middle on your desktop. There are other flash authoring tools available, including one from the open source project, AMES. Once you have built a flash movie (a file with a .fla extension), two thing need to be done to include it in a web page: (1) The .fla file gets compressed so it won’t take so long to download; the compressed version gets a .swf extension. (2) The web page has to use some combination of <object>, <param>, and <embed> tags to include the movie in the page. The Flash authoring program from Macromedia provides an option called “Publish Settings“ that will generate the .swf file and a web page containing a set of tags that will work to display the movie.
But getting Flash movies to play in all browsers using XHTML code that validates using the W3C validation tool is not a simple matter. The html file generated by the Flash “Publish Settings” option does play in all browsers, but doesn’t validate. If you don’t care whether your web pages validate or not, you can simply copy that code into your own web page and be done with it.
But we take as a given that you want to write web pages that do validate. Furthermore, we’d also like to work with less complicated markup than that generated by Flash. The technique I recommend is based on a technique that was published by Drew McLellan in 2002, which he calls the Satay Method. Ian Hickson published another technique in 2004, that is known as the Hixie Method. The version of the Satay Method presented here has the disadvantage of taking a long time before showing anything if a movie is big; the full Satay Method takes care of this issue. The Hixie Method has the advantage that Internet Explorer users with an old version of the Flash player on their computer will be prompted to upgrade to the latest version.
SSS: The Simple Satay Subset
If you want to show a Flash movie named “Untitled.swf” in your web page, include the following code:
Change “Untitled.swf” to the URL of the actual movie in two places, and adjust the size of the movie “screen” from 200x200 pixels to whatever size you want, and you’re done.
Discussion
Disadvantages of SSS
The disadvantages of the SSS are:
- The code explicitly states the size of the movie, in pixels, on the screen. Flash movies have information about their sizes embedded inside them, but browsers don’t “see” the sizes the way they do for JPEG, GIF, SVG, and PNG images. This has to do with the fact that support for images is built into the browsers, but support for Flash is supplied by a separate “plugin module” or in the case of Internet Explorer and by an “ActiveX control,” provided by Macromedia. The values for height and width should really be set using CSS, since they control the presentation of the web page. Internet Explorer and Opera use default values for height and width that will cause the movie to display with no CSS control, although their default sizes are different from each other. But Firefox uses default values of zero, which means that without CSS, you can’t see the movie at all, although you can hear audio if the movie has sound.
- The URL of the .swf file has to be specified twice: once in the <object> tag, and again as the value string in one of the <param> tags. This means that a person who wants to modify the code has to remember to make two identical changes. Changing just one without the other will lead to one movie showing in some browsers and a different movie in others! (Internet Explorer uses the movie parameter; all other browsers use the data attribute of the <object> tag.)
Other <param> Tags
There are many features of Flash movies that can be controlled by using additional <param> tags inside the object element. Documentation is available on the Macromedia Web Site. Some of the more common ones are:
| name | value | Meaning |
|---|---|---|
| "play" | "true" or "false" | Whether the movie should start playing as soon as it is loaded, or wait for the user to right-click on it and select the “play” option from a drop-down menu. |
| "loop" | "true" or "false" | Whether the movie should automatically start over each time it reaches the end. |
| "menu" | "true" or "false" | Whether or not the drop-down menu mentioned above should be available when the user right-clicks on the movie. |
Using Flashblock
Although the Flash plugin or ActiveX control is installed in the vast majority of web browsers, many people don’t like Flash because (1) Visually impaired people can’t see Flash movies, and screen readers have no way to describe them, (2) Flash movies can take a long time to load, and (3) a lot of advertisers have cluttered web pages with distracting and annoying Flash animations. Since Flash is an optional component of the browser (see the Macromedia web site for instructions on how to remove it), web pages that use Flash should be checked to make sure they make sense when viewed by users without flash installed.
There is an extension for Firefox called Flashblock that lets you turn Flash playing on and off dynamically. Once you install it, all Flash content on a page is replaced by a gray icon that changes from an f to a “play” button when you mouse over it: click on it and the Flash movie plays. By going to the Tools->Extensions menu, you can click on the Flashblock entry, click on Options at the bottom, and bring up a panel that lets you turn the extension completely off (or back on) if you just want to use Firefox to view web pages normally.