The video and audio Tags (Embedding Media)

In this lesson you'll learn how to embed media using the video and audio tags, so you can achieve playback functionality using only standard HTML features. This is for people searching "HTML video tag usage."

Using the <video> and <audio> tags lets you embed video or audio into a page. Adding the controls attribute automatically shows things like play and pause buttons. This used to require a separate plugin like Flash, but now it's achievable with standard HTML features alone.

The sample code specifies <source src="movie.mp4" type="video/mp4"> inside a <video> tag, and also prepares fallback text for browsers that don't support it. The <audio> tag can embed an audio file using the same style of writing.

A common beginner stumbling block is not understanding the point of preparing multiple <source> tags. Since different browsers support different video and audio formats, preparing several formats is meant to make sure it plays back in as many environments as possible. With only one format, there's a chance it won't play in some environments.

Playback features like those on a video streaming site have become achievable without any complex plugins. Situations where you want to embed media on a website — educational content, promotional videos, and more — are extremely common, so it's worth knowing the basic usage.