DM 171: Tutorials: Flash Video
Encode and Publish Flash Video
Video files viewed directly via the web browser acceptably show the movie but lack your design and accompanying text. Flash can convert your video files to Flash Video (which compresses them a bit) and Dreamweaver can embed them into your HTML document with associated control interface which gives your users a much richer experience.
Click on a tab to reveal its content…
- Encode Video
- Publish Video
Flash Video
To create a Flash Video file, open a new Flash document. From the menu File > Import > Import Video… You will be presented with the Import Video dialog box.
The first step is to select your video, either one on your own hard drive or one that is already online. When you have chosen your video file, click on the Next/Continue button at the bottom of the dialog box.
The next screen lets you choose the type of “Deployment” you want for your video file. For the web, choose “Progressive download from a web server” and chose an encoding profile. Your profile chose will be determined by your audience and purpose, you might want a larger file if your audience will be accessing it over a intranet. Click Next/Continue at the bottom of the dialog box.
The next screen shows “Skinning” options or the type of controls you want for your movie. Since we are using Dreamweaver for this job, chose None and click on the Next/Continue button.
If you haven't save your Flash file already, you will be promted to and Flash will then set about encoding your video file into a Flash Video. You will not need the Flash file any more.
Publish Your Flash Video
Make sure that your Flash Video (.flv) file is within your Dreamweaver site local files. You have defined your site? Yes!?
Chose or create the page you wish to publish your Flash Video on. Often, it is a good idea to create a <div> to hold your movie in case you wish to float it or do other styling. From the menu Insert > Media > Flash Video… brings up the “Insert Flash Video” dialog box.
For Video type:, choose Progressive Download Video. For URL:, browse to your Flash Video file or paste in the URL to the file. For Skin:, your choice for your audiences’ need. Have Dreamweaver detect the size of the movie, you may also change its height and width here. It is best to have already presized your orginal video file before encoding it into a Flash Video. Choose Auto play if needed. Auto rewind will do what it says, combined with auto play and it will endlessly loop your video. Leave Prompt users to… checked and customize the message if you wish. This will give your user a link to find the Flash plugin if they need it. Click OK.
Dreamweaver writes the code and places your Flash Video on the page. It also creates an FLVPlayer_Progressive.swf file and a skin_you_chose.swf file. These files are used in conjunction with your Flash Video file to display it on your page.
Preview your HTML page in your browser, return to Dreamweaver and style to taste. Upload your files, test the page over the internet, you are done!