Embedding video in HTML 5

Embedding video in HTML 5

Embedding video in HTML 5: Today’s web browsers support playing of video files without the use of flash player; however, the issue still remains regarding a common video file format for  inserting videos in HTML pages. Currently supported formats include H.264 and Ogg video formats. Let us now try to embed a video in an HTML 5 web page.

 

Step 1:

Let us begin with the basic code to insert a video file into our webpage:

<Video >

  </video>

Step 2: Now insert the location of your video file: the ‘src’ refers to the source video file.

<Video src = “song.ogg”>

  </video>

Step 3: Initiate the controls so that the user can see buttons for video control e.g. play, pause, sound and information about video: a sample image is displayed below which is the result of “controls” function inside the <video> </video> tag.

Play audio in HTML 5

<video src = “song.ogg”

         controls = “controls”>

  </video>

 

Result: Let us run our code inside a regular browser and it would show the below video result:-     

Playing Video in HTML 5

The above video format for playing video files directly in HTML 5 is supported by following modern day browsers:

HTML 5 Video supporting browsers

Tip: Considering the bulk of video files and the bandwidth they use, it is often wise to upload your videos to the video sharing websites like YouTube and embed a link inside your HTML code so that your website does not become too heavy to load. However, embedding a video inside the browser directly does cater certain benefits if your web server/hosting package supports heavy data usage.

Leave a Reply