Using Video in Your Web Page

Video using the Embed tag:

Scuba AVI

You can add most types of multimedia content to your web page by using either the <Object> or <embed> tags. To add the video clip to this web page, I used the <embed> tag

	<embed src="path and filename" 
	 
	 width="in pixels"
	 height="in pixels"
	 align="top|bottom|center|baseline|left|right|
               texttop|middle|absmiddle|absbottom"
         autostart="true|false"
	 loop="true|false" > 
	 <noembed> Message for browser that do not support embed </noembed&ggt; 
	 </embed>
  

In the example, I embedded the video clip scuba.avi so it would play within the web page. The file was saved in the avi folder off the web root. The video had a width of 176 and a height of 120 ( I added 35px to the height to cover the media player's controls).

I use this HTML code:

	<embed src="avi/scuba.avi" 
            width="176" height="155"
            autostart="true"
            loop="false" >
            <noembed> Scuba AVI </noembed> 
	 </embed>

  

If broad browser support is an issue, you should consider the <embed> tag. The <object> tag is used by Internet Explorer on Windows and the <embed> is used by Netscape Navigator on Macintosh and Windows and Internet Explorer on Macintosh. However, one disadvantage is that the HTML 4.0 specification does not recognize the <'embed> tag, so HTML 4.0 validators flag this tag as an error.

To embed a video in Dreamweaver, select Insert then choose Media > Plug in.

Video using the Object tag:

The <object> tag will load the application associated with the data type. In most Windows systems, the Windows Media Player is associated with the avi file type.
<object data="avi/scuba.avi"
        type="video/avi">
	Scuba Video
</object>



The data attribute provides file's path and name for the object. As an example, this code will open Windows Media Player and display the AVI file named scuba.avi. If the browser doesn't support the <object> element, it will display the text Scuba Video. You can also use the Object tag to load the Windows Media Player's ActiveX control. This allows you to play the video within the web page. This method is only suitable if you target audience is using Windows and the correct version of the Windows Media Player. Microsoft has changed the ActiveX control for Windows Media Player 9. While the lastest ActiveX control is backwards compatiable for audio files, video files require the correct control to play.

Video using the Img tag

This is an Internet Explorer specific application of the <img> tag; it's not supported in Netscape.
   <img 
        dynsrc="path and filename"
        controls="1 | 0"         
        loop="1 | n | infinite"
        loopdelay="n"
        start="fileopen | mouseover" 
        width="in px" 
        height="in px" />
 

For the attribute values above 1 is True, 0 is False, and "n" is an integer value. This works all versions of Internet Explorer (IE 3 and above), however it is not a valid implementation of the <ima> according to the HTML 4.0 specifications, so this will get flagged as an error by the validators.

Back