HTML5: How to preload an audio?

Last update on February 06 2024 11:32:16 (UTC/GMT +8 hours)

Solution :

HTML Code :

<!DOCTYPE html><!-- Specifies the document type as HTML -->
<html><!-- Starts the HTML document -->
<head><!-- Contains metadata about the HTML document -->
<meta charset="utf-8"><!-- Defines the character encoding for the document as UTF-8 -->
<title>How to preload an audio</title><!-- Sets the title of the HTML page -->
</head>
<body><!-- Contains the visible content of the HTML document -->
<audio controls preload="auto"><!-- Creates an audio player with playback controls and preloads the audio -->
  Your browser does not support the audio element.  <!-- Fallback message displayed if audio is not supported -->
<source src="https://www.w3resource.com/html-css-exercise/basic/beach.ogg" type="audio/ogg"><!-- Specifies the source file of the audio in Ogg Vorbis format -->
</audio><!-- Ends the audio player -->
</body>
</html>

Explanation:

The <!DOCTYPE html> declaration specifies the document type and version of HTML.
The <html> element is the root element of the HTML document.
The <head> section contains metadata about the HTML document, such as the character encoding and title.
The <meta> tag defines metadata for the HTML document, such as the character encoding, specified here as UTF-8.
The <title> tag sets the title of the HTML page.
The <body> element contains the visible content of the HTML document.
The <audio> element creates an audio player with playback controls and preloads the audio, indicated by the preload="auto" attribute.
The fallback message "Your browser does not support the audio element." is displayed if the audio is not supported by the browser.
The <source> element specifies the source file of the audio in Ogg Vorbis format, with the type attribute indicating the MIME type of the audio file format.

Live Demo:

See the Pen audio_preload-answer by w3resource (@w3resource) on CodePen.

See the solution in the browser

Supported browser


Yes	Yes	Yes	Yes	Yes

Go To Exercise page (audio)