Embedding videos in HTML

Inserting video in HTML is not easy because browsers did not have a uniform standard for defining the video files. Videos can be inserted to your web pages in two different ways. One method is to use the <embed /> tag to display your media file. The embed tag does not require a closing tag. In fact, it works much like the image tag. A src attribute must be defined by the correct URL (local or global) in order for the video file to be displayed correctly. Another method is to include <object>tag to display  video files

<embed> Tag

<embed> tag is to embed video files on your web page

EXAMPLE:


<embed src="watchvideo.swf" height="200" width="200"/>

<object> Tag

<object> tag is to embed video files on your web page

EXAMPLE:


<object src="watchvideo.swf" height="200" width="200"/>

<video> Tag

<video> tag is to include the video files on your web page

EXAMPLE:


<video width="320" height="240" controls="controls">
<source src="movie.mp4" type="video/mp4" />
<source src="movie.ogg" type="video/ogg" />
<source src="movie.webm" type="video/webm" />
Your browser does not support the video tag.
</video>

NOTE:

  • The use of ogg file is to make it work in Firefox, Opera and Chrome
  • To make the audio to work in Internet Explorer and Safari, a file of the type MP3 is added

Using HYPERLINK

If a web page includes a hyperlink to a video file, most browsers will use a “helper application” to play the file.

EXAMPLE:


<a href="watchvideo.mp3">Play the Video</a>

INLINE VIDEOS

When a video is included in a web page it is called inline video.


Posted in Html Tagged with: ,