Multimedia Websites   «Prev  Next»

Lesson 5Including video in a Web page
ObjectiveDescribe Common Formats used for Video Elements on a website.

Common Video Formats for Web-Based Elements

Just as streaming audio files are revolutionizing music on the Web, video files are revolutionizing motion on the Web. Like the other formats, video files use file extensions with a unique format. As websites continue to evolve into sophisticated multimedia platforms, the integration of video elements plays an increasingly pivotal role in enhancing user experience and engagement. When choosing video formats for web deployment, developers must strike a balance between compatibility, quality, and performance. Let's delve into the most common video formats adopted in the modern web landscape and evaluate their characteristics.
  1. MP4 (MPEG-4 Part 14):
    • Compression: Utilizes the H.264 video codec and AAC audio codec, offering a harmonious blend of high-quality video and audio compression.
    • Compatibility: Supported by nearly all major web browsers, making it one of the most universally accepted video formats for the web.
    • Adaptability: Ideal for both streaming and download-and-play applications due to its low file size with maintained quality.
  2. WebM:
    • Compression: Employs the VP8 or VP9 video codec and Vorbis or Opus audio codec. VP9 offers better compression ratios compared to its predecessor, VP8.
    • Compatibility: Open standard developed by Google, with native support in browsers like Chrome, Firefox, and Opera. Other browsers might require additional plugins or extensions.
    • Purpose: Primarily designed for the web, ensuring efficient streaming with minimal quality loss.
  3. Ogg (Theora):
    • Compression: Uses Theora video codec and Vorbis audio codec.
    • Compatibility: Supported by browsers like Firefox, Opera, and older versions of Chrome. However, it's not natively supported in Internet Explorer or Safari.
    • Open Standard: Ogg is free of patents, which has made it a popular choice among open-source advocates.
  4. AVI (Audio Video Interleave):
    • Legacy Format: One of the oldest video formats, introduced by Microsoft in 1992.
    • File Size: Typically larger compared to modern formats, which can impede streaming efficiency.
    • Compatibility: Due to its age and size, AVI is less commonly used for web applications today but remains supported by various media players.
  5. MOV (QuickTime File Format):
    • Origin: Developed by Apple as a part of its QuickTime framework.
    • Compression: Can encapsulate various codecs, but commonly uses H.264 for video.
    • Compatibility: Native to Apple devices and platforms. While it's playable on non-Apple devices, it might require additional software or conversions for optimal performance on the web.
  6. FLV (Flash Video Format):
    • Legacy Format: Previously dominant in the era of Adobe Flash.
    • Compression: Used codecs like Sorenson Spark and VP6.
    • Current Relevance: With the deprecation of Adobe Flash and a shift towards HTML5-based solutions, FLV has seen a substantial decline in web utilization.
When incorporating video elements into a website, developers must meticulously select the appropriate format, keeping in mind browser compatibility, quality demands, and streaming efficiency. While MP4 and WebM currently dominate the web video landscape due to their balance of quality and compatibility, it's imperative to remain updated with evolving standards to ensure optimal video delivery and user experience.

QuickTime (MOV)

QuickTime (MOV) is a video and animation system developed by Apple that supports full-motion video and animation with synchronized sound. QuickTime files end with a .mov extension and run on Macintosh systems. Windows/NT systems need a special QuickTime driver to run QuickTime files.


Motion Pictures Experts Group (MPEG) is a movie file format that is an international standard multimedia file format for compressing video on any platform. It provides lossy compression, meaning you lose some information from the original image. MPEG-2 standards provide CD-quality audio.


Question: Is the file format RealAudio (RAM) still used to embed video into a HTML5 web page?
No, the file format RealAudio (RAM) is no longer used to embed video into a HTML5 web page. RAM is a proprietary file format developed by RealNetworks, and it is not supported by any modern browsers. If you want to embed video into a HTML5 web page, you should use the `<video>` element. The `<video>` element supports a variety of video file formats, including MP4, OGG, and WebM.
To embed a video into a HTML5 web page, you can use the following code:
<video controls>
  <source  src="my-video.mp4" type="video/mp4>
  <source  src="my-video.ogg" type="video/ogg>
  <source  src="my-video.webm" type="video/webm>

If the user's browser supports any of the video formats that you have provided, the video will play automatically when the page loads. If the user's browser does not support any of the video formats that you have provided, the browser will ignore the `<video>` element.
It is important to note that not all browsers support video playback equally well. For example, some browsers may not support all video codecs. It is a good idea to provide multiple video formats to ensure that your video is playable on all browsers. RealAudio (RAM) was reference file not specific to any particular platform.
RealAudio was a proprietary audio format developed by RealNetworks and first released in April 1995. It used a variety of audio codecs including high-fidelity formats for music. It also used a streaming audio format, that was played at the same time as it is downloaded. Many internet radio stations used RealAudio to stream their programming over the internet in real time.

AVI | Audio Video Interleaved

Audio Video Interleaved (AVI) is developed by Microsoft and is the most common file format for full motion video and animation with sound on the PC platform. It is a computer file format that contains audio and video data and is used to play back the audio and video data simultaneously.

Definition of Video Compression

Video compression is a process of reducing the amount of digital data used to represent a sequence of images normally varying in time and intended to portray motion subject to the requirements that the quality of the reconstructed video is sufficient for a certain application and the complexity of the computation involved is appropriate for that application.
Some researchers, for example, Shi and Sun Microsystems (now Oracle) use the term video to refer exclusively to image frames and sequences associated with the visible band of the electromagnetic spectrum while others, for example, Tekalp refer exclusively to sequences.
In the next lesson, you will learn about common formats used for compressing files.