Media is a broad category that can include images, audio, video, and plug-in content.
HTML4 included support for displaying images, but it wasn't until HTML5 that native support was included for audio, video, and plug-in content. Before HTML5, audio and video was typically handled by Adobe's Flash player.
The following table lists the image related HTML tags:
|<img>||Defines an image|
|<map>||Defines an image-map|
|<area>||Defines a clickable area inside an image-map|
In HTML, images are defined with the
<img> tag. The
<img> tag is an empty tag, therefore it has no closing tag.
To display an image on a web page, specify the URL of the image to be displayed in the src attribute as shown in the example below:
<img src="smiley.gif" alt="Smiley face" />
This produces the following result:
The alt attribute is required and specifies alternate text for an image, if the image cannot be displayed.
HTML5 Media Related
HTML5 includes a new standard for media content.
The following table lists the media related HTML tags:
|HTML5||= New for HTML5|
|<audio>HTML5||Includes support for multimedia content, sounds, music or other audio streams|
|<video>HTML5||Includes support for video content, such as a movie clip or other video streams|
|<embed>HTML5||Includes support for embedded content, such as a plug-in|
|<source>HTML5||Defines media resources for media elements, defined inside video or audio elements|
<audio> tag allows the embedding of sound content in an HTML document. The following example shows the basic use of this tag:
<audio src="audio.ogg" controls="controls"> Audio element not supported </audio>
At this time, different browsers support various audio formats, but the most common formats are ogg, mp3, and wav.
<source> tag can be used to specify the media with the media type. The
<audio> element allows multiple source elements and the browser will use the first recognized format. The following example shows the basic use of this tag:
<audio controls="controls"> <source src="audio.ogg" type="audio/ogg" /> <source src="audio.wav" type="audio/wav" /> Audio element not supported </audio>
Note: More information about the audio tag can be found under the
<audio> element entry.
<video> tag allows the embedding of video content in an HTML document. The following example shows the basic use of this tag:
<video src="video.mp4" width="300" height="200" controls="controls"> Video element not supported </audio>
At this time, different browsers support various video formats, but the most common formats are:
- ogg - Ogg files with the Thedora video codec and Vorbis audio codec
- mpeg4 - MPEG4 files with the H.264 video codec and the AAC audio codec
Note: More information about the video tag can be found under the
<video> element entry.