HTML Video

Having just been connected to a fibre Internet connection I thought it was a good opportunity to look at media presented on webpages.

The 1st W3C example has control buttons defined using JavaScript. I added the "controls" parameter to see what it did. I added another video in which only contained the "controls" parameter so the video is controlled just by the embedded controls.

The W3C example


2nd example

Flying to Munt Cottage

How this works on an iPad/iPhone

There is another attribute, "autoplay" but....

The autoplay attribute does not work in mobile devices like iPad and iPhone.

Also when viewed on an iPad the video initially displays as a "Play" button and displays the contents when the video is played.

Bandwidth Implications

As I said I was holding off starting this project until I had an unlimited fibre Internet connection. It is not that the playing of a few videos would have used a lot of bandwidth, but the testing and devlopment cycle can easily "eat" vast chunks of bandwidth.

So far, at the time of wrting this, I had only uploaded 2 drone videos to my server and provided links to them. The video files are 4k and are 407Mb and 461Mb for videos that are little over 1 minute each. Testing over a couple of days has used around 300Gb of bandwidth.

The use of YouTube in your own webpages

W3C do actually suggest this. I have even implemented a solution to provide some instructional videos linked from my Parish Council website.

Links

External Sources

HTML Video - January 2021