Get Adobe Flash player

Search

Search this site for:


Related Links






Valid XHTML 1.0 Transitional

Valid CSS!





Let's Flash!

Most of you have visited web sites filled with video-like animation, sound effects and music synchronized to the animation, enhanced interactivity, and stunning graphics - all of which appear to load and play almost instantly.

These sites seem to have rocketed their design to "another level". and you've surely wondered, "How did they do that?"

More than likely, you were experiencing a site designed using Flash or the SWF file format.

Flash (developed by Macromedia) is the leading vector graphics technology for designing high-impact, low-bandwidth web sites. SWF (ShockWave Flash) is the file format used by Macromedia Flash to deliver graphics, animation and sound over the Internet. These techniques are rapidly changing the way we play, work, or just browse online.

What are vector graphics? Vector graphics, which manipulate coordinates and mathematical formulas rather than pixel-by-pixel bitmaps, produce graphics files that are one-tenth the size of bitmaps. Additionally, SWF can deliver animation, rich colors, sound, and interactivity. Moreover, this approach downloads faster, it's scalable (more on this below), and it boasts higher quality than other graphics formats.

Well over 95% of Internet users can now view SWF content: over 300 million people have downloaded the Flash Player for their browser. Even better, if you already run at least a 4.0 browser, no plug-in is required - it's already there.

Macromedia published the specifications for SWF in April 1998. It is now an open source format for development by third parties. The SWF file format is being integrated into web design and graphic applications more and more, and it's becoming increasingly easier and faster for web designers and developers to learn and to use.

Still, some of us just don't have the necessary time to learn (or the money to invest) in these high-end applications. What to do?

A quick search online will bring up dozens of resource sites specializing in Flash and offering free ready-to-use SWF files for you to download and embed into your site. So take advantage of these generous offers and flash-up your site too.

But if you've never worked with these newer SWF files, you might encounter a few initial problems -- or be unaware of some interesting capabilities. Here's an explanation that will make it quick, simple, and painless.

The SWF or Flash needs two basic ingredients. First, you need the SWF file itself -- which contains the animation and any sounds, all in one easy file. For our brief explanation here, let's call this file "super.swf".

Second, you need the HTML script to place in your web page. The HTML script contains simple instructions (called parameters), and executes the SWF file in the area of your web document where you insert the script -- kind of like a Java Applet, but that's where any similarity ends.

Here is an example of the Flash HTML script that you would need to add to your page:

codebase="http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0"
ID=super WIDTH=560 HEIGHT=60>

PLUGINSPAGE="">http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash">



Notice that there are both Object and Embed tags. The "Object" is for Internet Explorer and the "Embed" for Netscape. The parameters are referenced in both areas; and it is these parameters which allow you to do some customizing of your SWF file.

The "movie" parameter references the SWF from your directory. You'll need to upload the SWF file to the same directory as your web page. (If you place the SWF file in a different directory, then you will need to show the path to that directory in this parameter -- something like "flash/super.swf" -- assuming "flash" is the name of that particular directory or folder.)

With the "loop" parameter you can have the animation play once, or play continuously, by setting it to "false" or "true".

It's best to keep the "quality" parameter at "high" -- because it will look sharp and display the smoothest in your browser.

The "bgcolor" parameter can be set to whatever hexadecimal (#FFFFFF format) color you need for your web design.

Now, the "width" and "height" are not parameters in the same sense as the others -- but you can change these as well. Since the SWF file is "scalable", you can make necessary changes and the animation will smoothly resize to the new dimensions.

Either fixed pixel-based or flexible percentage-based dimensioning can be used. Fixed dimensioning (for example, width=300 and height=200) sets the size to the exact pixel dimensions, just like you normally would with an image. However, percentage-based dimensioning -- for example, width =50% and height=50% -- makes the SWF automatically resize, proportionately, to any browser window size without any deformations. Now that's cool!

Believe it or not, that's about all you need to know to embed a Flash file into your web page once you have downloaded a free SWF file from the Net. If you would like to explore the full capabilities of SWF, then take advantage of all the Flash and Webmaster resources. There is a wealth of information and free stuff available online and waiting for you!

If you want to create or experience more than just static web pages - SWF is the format. It is rapidly becoming the de-facto, online multi-media standard. Enjoy!


About the Author
Elmer Horvath has been involved in web design for the past six years and is the creator and webmaster for:
www.JavaPowered.com
www.KaZaaP.com
www.FlashBanger.com
www.iFlash2.com