Adding Sound to a Web Page

There are two common ways to add sound to a web page and this tutorial shows you both of them.

Before you proceed: If you're thinking of playing music (or any sound) automatically on your web page, be aware that this is a very unpopular website feature. For more information see Should I put Music on My Web Page? If you must put background music on your web page, at least give visitors the option to turn it off by displaying playback controls (stop/pause/play).

Method 1: Hyperlink

The easiest way to add music is to use a simple hyperlink which points to the sound file. This will open the user's default sound player and play the sound. Add the following code to your page, substituting the file name for your own:

<a href="mysound.wav">Play background music</a>

The link works like this: Play background music

Method 2: Embed

The embedding method places a media player in your page. Here's the most basic version of the code:

The embedded player looks like this:

If you would prefer not to show the player (and give the user no control), use this code:

For more information and options such as autoplay, see HTML5 audio.