Best method for audio playback

Get Started
1

Hi,
I have an English Tutorial website which contains sound files for visitors hear the correct pronunciation of words.
Dictionary.com have audio pronunciation as well, and when you click their little speaker icon, playback is instant without any obstacles like:

“Internet Explorer has blocked an Active X …bla bla bla” or a superfluous dialog opens requesting user to verify intention to download… bla bla bla.
All of this will scare potential customers away.

I inspected the speaker graphic element on www.dictionary.com and Firebug showed me the following code:

<embed id="speaker" width="17" align="texttop" height="15" flashvars="soundUrl=http://static.sfdict.com/dictstatic/dictionary/audio/luna/T04/T0442100.mp3" wmode="transparent" allowscriptaccess="sameDomain" salign="t" menu="false" loop="false" quality="high" src="http://static.sfdict.com/dictstatic/d/g/speaker.swf" type="application/x-shockwave-flash">

So, it appears that the answer is to just insert a Flash rollover triggering the mp3 right?

Given that over 90% of users have flash installed, I’m hoping that it would be a safe bet that flash is the way to go.

Any help appreciated.

2

There are various options here, including using the new <audio> element in HTML, which works best with a Flash fallback for older browsers that don’t support <audio>. As an example, check out audioJS and [URL=“http://www.jplayer.org/”]jPlayer.

Out of interest, what format was you audio file in? (That is, what was the fie extension—such as .mp3 etc.)

3

Thanks ralph,

Audio file is mp3.

4

Hm, I’m not a Windows user, so I can’t say much about that error message, but certainly you don’t want it. Is this happening for the site that’s online, or is this just happening to a test page on your own computer? It’s not uncommon for this to happen if you are running the page locally, but should be OK when the page is online.

Also, what code are you currently using on your page? (That is, how is the audio file linked to the page?)

5

I’m just using the object tag

<object data=“audio/14-01-13/fossilFuel.mp3”></object>

The site is live at a subdomain on my server and I’ve just tested it and got those annoying messages I mentioned.
I tried www.dictionary.com and got instant playback - no hassles!

6

O well, I recommend trying something like audio.js, to which I linked above.

7

If you can convert it into wav file then its more easy for you by using it.
<embed src=“bgsound.wav” hidden=“true” autostart=“true” loop=“1”>
<a href=“success.wav”>Play Sound</a>

8

Flash is the way to go even if many says otherwise.

9

Comments like that are pointless unless you back them up with some kind of reasoning or evidence. Flash does not work on many devices, and even where it does, it requires third party plugins. How is that better than using native browser options—even if not perfect at this stage?