HTML Introduction HTML Basic Structure Create an HTML Page HTML Elements Element Attributes HTML Heading HTML Paragraph HTML Links HTML Image HTML Lists HTML Forms HTML Tables HTML Audio HTML Video HTML Comments HTML CSS HTML Events HTML Canvas HTML Colors HTML Code Symbols

Audio in HTML

Last updated Apr 25, 2024

Adding audio elements to your web pages can significantly enhance user engagement. It creates a multisensory experience, appealing not only to visual learners but also to those who prefer auditory information. Users with visual impairments or those who prefer listening over reading can discover your website to be more beneficial with the inclusion of audio. HTML provides a dedicated <audio> element for embedding audio files.

Here's a basic example of the <audio> element:

<audio controls>
   <source src="audio-file.mp3" type="audio/mp3">
   Your browser does not support the audio element.
</audio>

The controls attribute adds play, pause, and volume controls.
The <source> element specifies the audio file and its type.

Supported Audio Formats

Different browsers support different audio formats. To ensure compatibility, include multiple <source> elements with various formats. For example:

<audio controls>
   <source src="audio-file.mp3" type="audio/mp3">
   <source src="audio-file.ogg" type="audio/ogg">
   Your browser does not support the audio element.
</audio>

It's good practice to provide alternative content within the <audio> element. This ensures that users with browsers that don't support audio can still access relevant information.