Search⌘ K
AI Features

How It Works: Supporting Multiple Video Formats

Explore how to use the HTML5 video tag with multiple source elements to support different video formats across browsers. Understand how this approach enhances user experience by ensuring videos play seamlessly whether a browser supports WebM, MP4, or falls back to text. Gain hands-on knowledge to create compatible and richer multimedia web pages.

How it works

In step one, you used the <source> tag, instead of the src attribute of <video>, to specify the stream to play:

HTML
<video controls
poster="Images/VideoPoster.png">
<source src="Video/Caribbean.webm" type="video/webm" />
</video>

With Google Chrome (in step two) the video played seamlessly because Chrome supports WebM out-of-box, so it was able to play the ...