Embedding Streaming Video Files
Embed a StreamingVideo File
There are a couple of ways to embed a video file on your web page. You can use a hyperlink (simple direct link to it), or you can make use of an embedded file within your web page using special HTML codes.
A hyperlink is a direct link to a file (such as webpage, video, or image) using an HTML anchor tag. In this case, the hyperlink is a link to your hosted video file. This will allow the video file to be opened and played with the viewer's default video player. In other words, when the end user clicks the link and it's linked to a Windows Media File, the Windows Media Player will open the video file and play it (or another program if the user has set a different program on his computer to open that filetype). The HTML code to link to the video will look like this:
<a href="video-filename.mov">Click to watch video</a>
Even though this does provide the end user the ability their preference of players, it provides the least amount of control over how others will view your video and it will not appear to them to be a part of your web page.
Embedded Media Files
Embedding a video or media file is simply putting the file within your web page using HTML codes so that it will be displayed within the webpage, not another program. This will provide the best way to control the way you want your video clip to be viewed.
To embed a video file, you must use the neccessary HTML codes. The precise HTML code you need will depend on the type of video file format you use. For this example, we will show the HTML tags to embed a Windows Media Video file:
<OBJECT ID="MediaPlayer" WIDTH=320 HEIGHT=331 CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"
STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject">
<PARAM name="ShowControls" VALUE="true">
<param name="ShowStatusBar" value="true">
<PARAM name="ShowDisplay" VALUE="true">
<PARAM name="autostart" VALUE="false">
<EMBED TYPE="application/x-mplayer2" SRC="video-filename.wmv" NAME="MediaPlayer"
WIDTH=320 HEIGHT=331 ShowControls="1" ShowStatusBar="1" ShowDisplay="1" autostart="0"> </EMBED>
Notice the <object> and the <embed> tags. These are used to reach the greatest browser compatibility. The <object> tag is for Internet Explorer. The <embed> tag is for Mozilla Firefox and other compatible browers. The HTML tags are case-insensitive, which means it is not important whether the tags are uppercase, lowercase, or mixed case. You can easily see that both tags are pretty much a duplicate of each other. So, remember, for each tag, you'll have to set the filename and any other parameters.
Below are links to tutorials showing the video embedding code for each video format
(click on the one you want):
Windows Media Files (WMF Videos)