Vid Embed Tutorial

Embeding the Video

We should first concentrate on displaying our video on the website, and we can achieve this using the video tag. If we want to adjust the size of the video, we can specify the dimensions in pixels in the video tag. In addition, we need to include a source tag between the video start and end tags, where we provide the name of the video we want to embed and its file type. After the source tag, we must close the video tag.

Preload Values

After successfully displaying the video on the webpage, we need to decide how it will be loaded. To do this, we can use the preload attribute and choose between three options: auto, metadata, and none. Auto will download some or all of the video file, metadata will download a portion of the data to provide basic information, and none will not download anything until the user clicks the play button.

Boolean Attributes

Boolean attributes give us additional options to customize how our video is displayed. We can use attributes like autoplay, controls, loop, and muted to achieve specific effects. These attributes are named in a straightforward manner that indicates their function. Autoplay starts playing the video automatically once it's loaded. The controls attribute adds buttons such as pause and volume to the video. The loop attribute enables the video to replay automatically once it has finished playing. Lastly, the muted attribute ensures that the video starts in a muted state, and the user can unmute it if desired.

File Type

There are three primary file types that you can choose from when embedding a video: mp4, OGG, or WebM. Among these, mp4 files have the most comprehensive support, while OGG and WebM are both open source and have some unique benefits but are generally less widely supported.

File Size Factors

Maintaining a reasonable file size for your video is crucial. To prevent your file from becoming too large, you need to pay attention to several factors, such as bitrate, framerate, and audio settings. It is important to keep these settings in mind when selecting a video to ensure that your file size remains reasonable..

Iframe

To embed a YouTube video on your website, you will need to utilize the iframe tag. To obtain the necessary code for embedding the video, navigate to the video you wish to embed, select the "share" button, and then click on the "embed" button. This will provide you with the code that you can use to display the desired video on your website. Below is an illustration of an embedded YouTube video that utilizes the iframe tag.