Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I have a site for a musician that includes music in mp3 format, but these are played through a Flash file (xspfplayer). Of course, without Flash this is useless.

Is there a better future-proof, and reasonably backwards-compatible way to include mp3 audio snippets on a page without forcing users to use Flash, and also not forcing them to download the mp3 first, or to leave the page entirely?

share|improve this question

3 Answers 3

up vote 5 down vote accepted

Another solution is to use a JavaScript library called Sound Manager. By default, it embeds an invisible Flash object in the page and uses it to play audio files (including MP3s). The newest version includes the ability to use HTML5's audio tag when available.

You can then write your player in HTML/CSS/JS, and have Sound Manager figure out whether to use Flash or audio tag to play the audio file. This way your player will work in IE6 and also on the iPhone/iPad.

share|improve this answer
    
SoundManager looks pretty good! And actually incorporates the already accepted answer of using <audio>. Great stuff and welcome to Pro Webmasters! –  artlung Jul 27 '10 at 23:30

Your best bet is to continue to use the Flash player and use the HTML5 audio tag, for any browsers that supports it. Eventually, all browsers will support HTML5 and you will be able to kill off the flash audio player.

There is a great document on the HTML5 audio tag and how to use it here, http://html5doctor.com/native-audio-in-the-browser/. It seems to be extremely easy to use.

It looks like Safari 4, and Chrome 3 both support the tag AND the mp3 format. Opera and FF 3.5 support WAV format.

share|improve this answer
2  
Also, Opera and FF support ogg vorbis, which is probably a better bet than MP3. –  luiscubal Jul 26 '10 at 21:27
    
@luiscubal - That is true. If forgot to mention that. Thanks! –  RandomBen Jul 26 '10 at 21:32
1  
If jQuery is your thing, you may want to have a look at jPlayer; it uses HTML5 but falls back to Flash when needed: happyworm.com/jquery/jplayer –  deizel Jul 27 '10 at 1:06
    
I actually meant "better bet than WAV", but I guess it also could apply to MP3. –  luiscubal Jul 27 '10 at 21:32

I believe this solution matches your requirements more exactly:

Create an M3U playlist file which points to the MP3's URL, upload the M3U to your server, and then create a link to the M3U file on your page.

When the visitor clicks the link to the M3U file the (tiny) M3U file will be downloaded and he or she will have the option to open it in the media player of his or her choice (i.e. whatever's already installed on the machine - no need for Flash whatsoever).

Once opened, the MP3 will begin streaming.

share|improve this answer
    
It's a standard filetype, but won't think force opening in an external player? My hope was to keep the user on my page and using existing browser resources as the player. This sounds like the same problem with just linking to an mp3, it sometimes (often?) takes the user out of the browser. –  artlung Jul 27 '10 at 16:32
    
It's true, the action will open the M3U file with the preferred application on the system once it has downloaded - I'm sorry if I misinterpreted your requirement RE: leaving the page. The accepted answer for your question remains the best bet (and, unless the site's user stats indicate otherwise, I would bet that it will be sufficient to the site's needs). –  danlefree Aug 3 '10 at 17:25

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.