Are you wondering how to add Video and Audio to your web pages? It's easy now with HTML5. Yes, you read it right. HTML5 provides us with and tags.

In the IE era, audio and video cannot be added that quickly as we needed plugins like Flash and Silverlight. These plugins weren't that easy to use as well, they had compatibility and security issues. After the new version HTML5, things were easy to add video and audio to websites.

Video Element

With the use of element, it is easy to embed video. Let me demonstrate with a code sample.

Without mentioning controls, width, and height for the video, it doesn't display anything in the browser. These are the mandatory attributes to be mentioned.

Attributes of video element:

Code with the attributes

Formats supported for audio: MP4, WEBM, and OGG.

The reason why we use different formats is:

For whatever reason, if the browser is unable to load the mp4 file, it will then go through the list of other source paths and reload the next and play.

Audio Element

With the use of element, it is easy to embed audio. Let me demonstrate with a code sample.

Without mentioning controls for the audio, it doesn't display anything in the browser. This is the mandatory attribute to be mentioned.

Attributes of audio element:

Formats supported for audio: MP3, WAV, and OGG.

The reason why we use different formats is:

For whatever reason, if the browser is unable to load the mp3 file, it will then go through the list of other source paths and reload the next and play.