Playing Video on the Web

Depending on the HTML element you use, videos can be played 'inline' or through some 'helper'.

Inline Videos

When a video is included in a web page or as part of a web page, it is called inline video.

Inline video can be added to web pages using the <img> element.

If you plan to use inline video in web applications, you need to be clear about one thing: many people really hate inline video. Also, note that some users may have already turned off the inline video option in their browsers.

Our suggestion is to only include inline video where the user is likely to want to hear sound. For example, when the user clicks a link to watch the video after opening the page.

Using helper (Plug-In, plugin)

Helper applications are programs that can be started by browsers to 'help' browsers play videos. Helper applications are also known as plugins (Plug-Ins).

Helper applications can be started by using the <embed> element, or the <applet> element and <object> element.

One of the great advantages of using helper applications is that they allow users to control certain settings of the player.

Most helper applications allow manual or programmatically controlled volume settings and playback functions, such as replay, pause, stop, and play.

Using the <img> element

Internet Explorer supports the dynsrc attribute in the <img> element.

The role of this element is to embed multimedia elements in web pages:

<img dynsrc="video.avi" />

The above code snippet sets an embedded AVI file for the web page.

Note:The dynsrc attribute is not a standard HTML or XHTML element. It is only supported by Internet Explorer.

Using the <embed> element

Both Internet Explorer and Netscape support the <embed> element.

The role of this element is to embed multimedia elements in web pages:

<embed src="video.avi" />

The above code snippet sets an embedded AVI file for the web page.

You can find the attribute list of the <embed> element in the last section of this tutorial.

Note:Both Internet Explorer and Netscape support the <embed> element, but it is not a standard HTML or XHTML element. The World Wide Web Consortium (W3C) recommends using the <object> element instead.

Using the <object> element

Both Internet Explorer and Netscape support the <object> element.

The role of this element is to embed multimedia elements in web pages:

<object data="video.avi" type="video/avi" />

The above code snippet embeds an AVI file in the web page.

You can find the list of attributes for the <object> element in the last section of this tutorial.

Using Hyperlinks

If a web page contains a hyperlink to a media file, most browsers will use an 'assistant program' to play the file:

<a href="video.avi">Click here to play the video file</a>

The above code snippet sets a link to an AVI file. If the user clicks on this link, the browser will launch an assistant program (such as Windows Media Player) to play the AVI file.