XHTML 5 Reference

go to previous section go to next section


Sound and Motion

The following tags are used to attach other objects to your page. Because audio and video are now such an important part of many web pages these now have their own tags which allow such files to be embedded into the web page natively without requiring a separate plugin to run them.

Motion

<video width="" height=""> </video> provides a placeholder into the web page where a video can be displayed. An optional poster attribute allows you to attach a static image file to be displayed when the video is not playing. An optional controls attribute determines whether the page should display controls allowing the video to be paused etc. Note that I recommend using height and width in the XHTML rather than applying them from the stylesheet as this way the space for the video is reserved as the page is first loaded.

<source src="" type=""/> - one or more of these tags inside of the video tag define a video file and the codec that it uses. Not all browsers support all codecs and so it is common to include two or three versions of the video file using different codecs so that the different browsers can choose one that they do support.

To support older browsers that do not recognise the video tag you can also include an object tag after the last source tag and before closing the video and attach an older format video or audio file that uses a plugin to the web page to use when none of the native file formats are supported.

Sound

<audio src=""> </audio> attaches an audio file to the page in the same way that the video tag attaches a video except that no space needs to be allocated in the page to 'display' an audio file. An optional controls attribute determines whether the page should display controls allowing the audio to be paused etc.

The audio tag wraps around the same <source> tags as with video except that in this case it will be audio files and codecs that are attached rather than video ones.

To support older browsers that do not recognise the audio tag you can also include an object tag after the last source tag and before closing the audio and attach an older format video or audio file that uses a plugin to the web page to use when none of the native file formats are supported.

go to previous section go to next section

 

This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow
Donate