Skip to main content
Practice

video Tag

The video tag creates an area on a web page for playing videos.

For example, you can use the video tag to insert a video into a webpage as shown below.

How to Use the video Tag
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>

The above code creates a video player that plays a video file named movie.mp4.

The key elements of the code are as follows:

  • width and height: specify the dimensions of the video player

  • controls: display video controls like play/pause buttons

  • <source>: specify the path and file type of the video


Considerations When Using the <video> Tag

  1. File Format : Video file formats supported by the web are not universally supported across all browsers. Therefore, it is advisable to prepare multiple formats to enhance compatibility.

  2. Alternative Text : The text written within the video tag defines the content displayed on browsers that do not support video. It's recommended to include a description of the video here.

  3. Consider Video File Size : Video files can be large, impacting page loading speed. Therefore, use videos judiciously and compress file sizes as much as possible.

Want to learn more?

Join CodeFriends Plus membership or enroll in a course to start your journey.