HTML audio element is a reliable way to embed audio files, music, podcasts, sound and sound effects directly into your webpage, allowing users on your site to play audio content easily without needing extra code, external plugins or software.
We use this element <audio></audio> to embed sound or audio files on a webpage.This audio element is also used in HTML5 and most popular web browsers support it, making it the easiest and reliable way to embed sound or audio files into a webpage.When you want to use the audio element you must specify the source of the sound or audio file using the src="audio.mp3" attribute, and the name between the quotation marks is the name of your audio file.We then use the controls attribute that tells the browser to display controls such as play, volume, pause and progress bar for your audio element, without the control attribute you will not be able to control your audio you will have to control the audio file with javascript.
It is important because it allows developers to embed sound and audio files on a webpage, without needing external plugins or tools like adobe which developers in the past had to rely on to play audio files.This tools developers used to rely on in the past to play audio files like adobe or flash player, often caused security issues on a webpage.The audio element also helps improve user engagement and experience, for example educational websites can include voice explanation audio files so that learners can understand better if they have difficulty to read and understand the text.Music streaming platforms like spotify rely on this element to embed music on their platforms.
<!DOCTYPE html>
<html>
<head>
<title>
This is the title of your webpage
</title>
</head>
<body>
<p>
This is a music player.
</p>
<audio src="audio.mp3" controls>
</audio>
</body>
</html>