ewiget
Admin
Admin
| Posts: 171 |  |
Karma: 2
|
insert flash flv movie in web page - 2006/12/27 13:02
Since movies on the net has become very popular, "how do I insert video into a web page" has been a recurring question from our customers. Therefore, we wanted to take a little time to show you the easiest way, and also the way that will use the least amount of bandwidth for your account.
First, there are many different movie types based on their format, including quicktime .mov, windows video .wmv, .avi, mpeg, mp4, etc. But there is only 1 that is suitable for the web and that is flv (flash video).
Here is the reason why. I have a 70.7MB mov video I just took at christmas that is about 1 minute long. If I placed this file on the web for family members to view, even on high speed internet connection, they would have to wait possibly up to a full minute before the movie would play. This is assuming they even have the quicktime video player installed. Now, if someone wanted to view this video on a dial-up account, they would probably have to wait at least several hours to see that video. Part of the reason you have to wait is because quicktime movies, and most other formats, can't be streamed incrementally. So your web browser has to first download the entire movie to your computer and then it plays it. With flash videos, the browser only has to download a small portion of the video and then while the video begins to play the browser is downloading the next portion of the video. This allows for pretty much continuous viewing even by those on dial-up accounts.
Another nice feature of flash is that the files are a lot smaller in size. For example, the above 70.7MB video file with audio is only 4.0MB in size when converted to an flv file with audio. This is because flash video has a much higher compression rate than quicktime movies.
So, how do you get started? You will need a few pieces of software first.
To convert video to flv:
I recommend the ffmpeg software which is free to use for windows, linux, and mac users to convert the video files to flv. You can get ffmpeg from the links section below if you don't already have it. You can also use Macromedia Flash - link below which is proprietary and costs money. I won't cover the details on how to convert a video to flv as the instructions will be dependent on the software you chose to use. However, both ffmpeg and adobe/macromedia have ample documentation on their web sites for their products.
Using Flash Video Player
Once you have your video converted to flv, you will need a player that is able to play the video file. This is also a piece of free software for non-commercial use known as Flash Video Player - link below. Download it and see the readme file for examples on using it. It is very easy to use and has detailed examples of how to add the necessary code to your web site. I will provide a very basic example below:
Using the javascript plugin included with Flash video player
| Code: |
<p id="player1"><a href="http://www.macromedia.com/go/getflashplayer">Get the Flash Player</a> to see this player.</p>
<script type="text/javascript">
var FO = { movie:"flvplayer.swf",width:"300",height:"20",majorversion:"7",build:"0",bgcolor:"#FFFFFF",
flashvars:"file=video.flv&showdigits=true&autostart=true" };
UFO.create(FO,"player1");
</script>
|
Using the embed command that doesn't require the javascript:
| Code: |
<embed src="http://www.myfileserver.com/folder/flvplayer.swf" width="300" height="200" bgcolor="#FFFFFF"
type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"
flashvars="file=http://www.myfileserver.com/folder/playlist.xml&showdigits=true&autostart=true" />
|
LINKS:
ffmpeg (free)
Macromedia Flash ($699)
Flash Video Player (free)
Ed Wiget
Technical Support
http://www.xtremewebhosts.com |
