Media Elements in HTML

HTML supports embedding multimedia content such as audio and video directly on the page. The two main elements used are <audio> and <video>.

Embedding Audio – <audio>

The <audio> element allows embedding MP3, OGG, or WAV files. The 'controls' attribute displays a player interface for users to play, pause, or rewind the audio.

Embedding Video – <video>

The <video> element lets you play videos on your page. You can use the 'controls' attribute to show a player, and additional attributes like 'autoplay', 'muted', or 'loop' to modify behavior.

Common Attributes

The <audio> and <video> elements support several attributes. 'controls' shows the player, 'autoplay' starts playback automatically, 'muted' silences the media, and 'loop' repeats it.

Supported File Formats

Common audio formats include MP3, OGG, and WAV. For video, MP4, WebM, and OGV are widely supported. Providing multiple formats ensures better browser compatibility.

Fallback Content for Unsupported Browsers

Text placed inside <audio> or <video> elements will appear in browsers that don’t support them. This can include warnings or download links.

Practical Tips

Always include multiple <source> elements for better browser support. Optimize files for fast loading, and ensure the user experience is smooth and clear.