HTML5 introduces two new tags " < audio > " and " < video > " to insert multimedia content in the HTML documents.

To insert the content with these tags, it is only necessary to place the tags " < audio > and < video > where we want the file to appear on our website, include a src = "" for the path of the file that we want to play and we will see on our website the player with our file (either video or audio , according to the one we have chosen).

Within these tags, we can add functions that will be added to the players, for example:

  • "controls": shows the standard controls of each player.
  • "autoplay": causes the audio or video to be automatically played when the player is loaded. page.
  • "loop": causes the audio or video to be repeated again and again.
  • "preload": this attribute is to specify if we want the file to be temporarily stored. We have three values: "none", "auto" and "metadata". The first is to tell you not to store, the second to store it and the last one to store only the metadata of the file temporarily.

We also have a tag " < source > " that must be included between the tags to open and close the element (in the case of the video would go "< video > < source > "). This tag gives us the option to provide files encoded in different formats by different browsers. We simply have to put the "src" attribute in the "source" to give it the path of each file and a "type" attribute with the format of the file so that the browser can consult if it accepts it. We can repeat it as many times as we want to introduce files.

Keep in mind that the order in which they are placed is important. The browser will try to play the first one it finds, if it does not support the format, it will try to play the second and so on until it finds one that it accepts. If you still do not accept any of the format we have loaded, we can include under the last "source" a message like "Your browser does not accept the file", and the browser will display the message.

Below you we leave a table with the compatibility of the formats in each browser:

Browser

MP3

ORG

Wav

Internet Explorer 9 +

Yes

No

No

Chrome 6 +

Yes

Yes

Yes

Firefox 3.6+

No

Yes

Yes

Safari 5 +

Yes

No

Yes

Opera 10 +

No

Yes

Yes