HTML and CSS Reference
In-Depth Information
Similar to
<object>
, you can put fallback markup between the
tags for older web browsers that do not support native video. You
should at least supply a link to the video so users can download
it to their hard drives and watch it later on the operating system's
media player.
Figure 4.1
shows this code in a modern browser
and fallback content in a legacy browser.
<h1>Video and legacy browser fallback</h1>
<video src=leverage-a-synergy.webm>
Download the <a href=leverage-a-synergy.webm>How to
¬ leverage a synergy video</a>
</video>
However, this example won't actually do anything just yet. All you
can see here is the first frame of the movie. That's because you
haven't told the video to play, and you haven't told the browser
to provide any controls for playing or pausing the video.
FIguRE 4.1
HTML5 video in a
modern browser and fallback
content in a legacy browser.
autoplay
While you can tell the browser to play the video or audio auto-
matically once the web page is loaded, you almost certainly
shouldn't, as many users (and particularly those using assistive
technology, such as a screen reader) will find it highly intrusive.
Users on mobile devices probably won't want you using their
bandwidth without them explicitly asking for the video. Never-
theless, here's how you do it:
<video src=leverage-a-synergy.webm autoplay>
<!-- your fallback content here -->
</video>
