HTML Multimedia
Read about the main multimedia formats (audio and video formats) and the multimedia tags that allow adding different multimedia files on your website.
Multimedia is almost anything you can hear or see (e.g. sound, music, images, recordings, videos, films, animations, etc.). It comes in different formats. Web pages can contain multimedia elements of different formats and types.
Multimedia Tags
HTML allows adding different multimedia files on your website by various multimedia tags. These tags include:
<audio>for displaying an audio file on the web page,<video>for displaying a video file on the web page,<embed>for embedding multimedia files on the web page,<object>for embedding multimedia files on the web page.<iframe>for embedding other web pages.
Here is a basic example using the controls attribute and <source> tags:
<audio controls>
<source src="audio.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<video controls>
<source src="video.mp4" type="video/mp4">
Your browser does not support the video element.
</video>Multimedia Formats
Multimedia elements such as audio or video are stored in media files. You can discover the file type by looking at the file extension.
Multimedia files have formats and different extensions: .mp3, .mp4, .mpg, .swf, .wav, .mpg, .wmv, and .avi.
Audio Formats
The newest format for compressed recorded music is MP3. This term is synonymous with digital music.
MP3 is a good choice if your website is about recorded music.
| Format | File | Description |
|---|---|---|
| MIDI (Musical Instrument Digital Interface). | .mid .midi | This is the main format for all electronic music devices (e.g. synthesizers and PC sound cards). MIDI files contain digital notes that can be played by electronics, but they do not include sound. It plays well on music hardware and computers, but not natively in web browsers. Modern browsers can handle MIDI via the Web Audio API. |
| RealAudio | .rm .ram | Allows streaming of audio with low bandwidths. In web browsers, it does not play. |
| WMA | .wma | This format has been developed by Microsoft and is usually used in music players. It plays well on Windows computers, but not in web browsers. |
| AAC | .aac | This format has been developed by Apple as the default format for iTunes. Raw .aac files have limited browser support, but AAC audio is widely supported when packaged inside .mp4 containers. |
| WAV | .wav | This format has been developed by IBM and Microsoft. It plays well on Windows, Linux, and Macintosh operating systems. Supported by HTML5. |
| Ogg | .ogg | This format has been developed by the Xiph.Org Foundation. Supported by HTML5. |
| MP3 | .mp3 | This is the most popular format for music players. The format has good compression (small files) and high quality. Supported by all browsers. |
| MP4 | .mp4 | This is a video format but can be used for audio as well. MP4 video is the future video format on the internet leading to automatic support for MP4 audio by all browsers. |
HTML5 natively supports MP3, AAC (in MP4 containers), WAV, and Ogg audio formats.
Video Formats
| Format | File | Description |
|---|---|---|
| MPEG | .mpg .mpeg | Created by the Moving Pictures Expert Group. It is the first popular video format on the web. Not supported in HTML5. |
| AVI (Audio Video Interleave) | .avi | Created by Microsoft. It is normally used in TV hardware and video cameras. It plays well on Windows computers, but not in web browsers. |
| WMV (Windows Media Video) | .wmv | Created by Microsoft. It is normally used in TV hardware and video cameras. It plays well on Windows computers, but not in web browsers. |
| QuickTime | .mov | Created by Apple. It is normally used in TV hardware and video cameras. It plays well on Apple computers, but not in web browsers. |
| RealVideo | .rm .ram | Created by Real Media and allows video streaming with low bandwidths. It is still used for Internet TV and online video but does not play in web browsers. |
| Flash | .swf .flv | Deprecated. Adobe Flash Player was removed from all modern browsers in 2020. This format is now considered legacy and requires third-party emulators to play. |
| Ogg Theora | .ogg | Created by the Xiph.Org Foundation. Supported by HTML5. |
| WebM | .webm | Created by Mozilla, Opera, Google, and Adobe. Supported by HTML5. |
| MPEG-4 or MP4 | .mp4 | Created by the Moving Pictures Expert Group. It is generally used in TV hardware and newer video cameras. Recommended by YouTube. Supported by all HTML5 browsers. |
Only WebM, MP4, and Ogg video formats are supported by the HTML5 standard.
Browser Support
Audio, video, and animation are handled natively by modern browsers. While format support varies, HTML5 has standardized playback without requiring third-party plugins.
Practice
What kinds of files can HTML multimedia display?