HTML5 Audio & Video Tags - 2020

HTML Multimedia:

Multimedia on websites are the various sounds, musics, videos, movies, animations, etc.

Multimedia comes in many different formats. It can be anything like images, music, sound, videos, records, films, animations, and more.
Web pages often contain multimedia elements of different types and formats.
Common audio formats are MP3, AAC, WMA, MIDI, Ogg.
Common video formats are MP4, AVI, WMV, Flash, QuickTime.

HTML5 features include native audio and video support without the need for Flash.
The HTML5 <audio> and <video> tags make it simple to add media to a website. You need to set src attribute to identify the media source and include a controls attribute so the user can play and pause the media.

HTML Audio tag:

<audio controls>
  <source src="music.mp3" type="audio/mpeg">
</audio>

Explanation:
The controls attribute adds audio controls, like play, pause, and volume.
The <source> element allows you to specify alternative audio files which the browser may choose from. The browser will use the first recognized format.
The text between the <audio> and </audio> tags will only be displayed in browsers that do not support the <audio> element.

HTML Video tag:
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
</video>

Explanation:
The controls attribute adds video controls, like play, pause, and volume.
It is a good idea to always include width and height attributes. If height and width are not set, the page might flicker while the video loads.
The <source> element allows you to specify alternative video files which the browser may choose from. The browser will use the first recognized format.
The text between the <video> and </video> tags will only be displayed in browsers that do not support the <video> element.

Conclusion:
So, HTML Multimedia.... helps you to add multimedia files on your website by providing various multimedia tags. These tags include AUDIO, VIDEO, EMBED & OBJECT. The AUDIO tag is used to display the audio file on the Web page, whereas the VIDEO tag is used to display the video files on the Web page.

Happy Learning !