Symphony.

Embedding mp3 files as flash is the defacto way for cross browser audio.

However when you prefer to have all your website interaction handled by javascript (good!) it's a bummer you still need a flash plugin for your sounds. Inspired by this post: You can use pure javascript and wav files, supported cross-browser, with this javascript audio engine

Now recently Opera, Webkit and gecko started supporting the audio elements.

This won't change a lot for playing back songs, or video, because cross browser codecs are still utopia. So you need to offer both ogg and quicktime versions of your content. (simple html5) or hit users with a 'download quicktime' message (don't we all have it since iTunes?....) And I wonder with the H.264 support in flash and silverlight, PC's without quicktime would use these to play audio and video?

BUT... for soundeffects as wav files it will do nicely.

So get your firefox beta and when by june 3.5 is out you can offer audio effects to all modern browsers, without javascript.

Now if only all the browsers implemented css3 animations and xforms, then javascript would become a thing of the past?

Let's here some opinions...

The javascript audio engine can also accept MP3s, and possibly other formats as well. It depends on the OS, browser, and the plugins silently relied on. But WAV and MP3 are the safest / lowest common denominator formats. -Jules

Mp3 cannot be played as flash if its not presented as flv.

A browser needs to have windows media player or quicktime plugin to be able to play mp3 files in, without using flash. Except IE on windows can play the file if it has a .wmv extension.

1. Is there a trick to offer the file with both wmv and mp3 extensions without double uploading them?

2. Are there numbers on what percentage of internet explorer users have the windows media plugin installed? Or is it installed by default on each windows machine?

3. I assume gecko and webkit users are knowledgeable enough to have installed the needed plugins anyway.

So in short, will 99 percent of my visitors be able to hear the soundeffects if they are in mp3 (and even if they dont have flash) or is .wav the only option for that?

Actually, Flash Player can in fact play MP3 files if you pull them in during runtime via actionscript. As for your questions...

1. No. They are two completely different file formats you will have to upload a WMV and an MP3 version of each. Or just use Flash Player.

2. WMPlugin is installed by default. However, it can be disabled. Also, it restricts you only to IE (30-60% of your market, depending).

3. There is a plugin for Firefox but it's Windows only. There is no plugin for Webkit.

In short, use Flash Player and MP3s. Never, ever, ever using any Windows proprietary format for Web work as you're cutting off up to 70% of your market at the drop of a hat. Flash Player, however, is about 95+% of the internet if not more and this includes every major platform.

To play any media through your browser you will always need a plugin. It's the nature of the game. The question is how many users can you hit and how easy.

Most web browsers can play WAV/AIFF without any plugin. So it's probably the safest way to go. But you'll have larger file sizes naturally.

For MP3, IE seems to handle that internally as well. Safari and Firefox on Mac use Quicktime.

Scriptaculous's sounds.js is the latest incarnation of my original javascript audio engine mentioned above. It looks like the next version will sniff out available sound-playing plugins to determine which to use: http://github.com/madrobby/scriptaculous/ And here, I propose cleaning up the dom on page unload: http://github.com/WebVeteran/scriptaculous

Thanks for the input guys. But my original challenge was how to play soundeffects without any plugins, javascript and flash. (wether this is realistic or wise is another discussion all together ;-) For instance on a examplary website advocating the use of xhtml(5) and css3 only. Also playing the sounds on an iPhone, without flash. The sounds would be played by using html5 tags, thus only available on the latest and greatest non-IE browsers. No problem because the sounds are optional, just like some nice css effect, nice to have, but not part of the core content of a site.

I have no experience in windows or linux, but from the answers I understand:

'all web browsers can play WAV/AIFF without any plugin' and playing of mp3 depends on wma or quicktime plugin being active, which is an uncertainty... But considering the few users with the latest and greatest browsers, wouldn't it be an educated guess they have quicktime installed...

So wav is the answer I was looking for, or mp3?

However, when I read the initially referenced pages again; Opera, Webkit and gecko it seems I always need some javascript in the end if i want any sounds beyond a visible player? All I want is to attach a sound to a onload, hover or onclick...

I will say this again just to make sure we're clear on this: None of the major browsers have built-in audio file support. The best you could ever hope to get is in browsers that support HTML5 which, in the spec, has a proposal for a standard audio format. However, most browsers do not have this implement even in their most recent betas.

As for formats,

• WMA: Never use this as you will restrict yourself to Windows only. It is also a bloated format that delivers bad quality for a big file size (My opinion as an audiophile).
• AIFF: Great quality and lots of compatibility but insanely large file size.
• WAV: Similar issues as with AIFF.
• AAC: Great quality for a small file size but would require QuickTime Player be installed.
• MP3: Good quality for a small file size but would require a media player plugin installed.
• Flash: Good enough quality for a small file size but would require Flash Player installed.

There are also other formats such as FLAC and OGG which are being proposed as a universal format, specifically OGG.

As for percentages, the vast majority of web users have some version of Flash Player installed up to version 9, 98.5% of users to be exact. Those with WMPlugin are going to be in the 50-60% range by default and QuickTime will be smaller.

However, the percentage of users with JavaScript is 100% and very few of them have it disabled. The question becomes how important is your audio and are those sorts of users likely to visit your site.

Thanks dougoftheabaci,

I finally understand that NO browser has built in support for audio (and some will in the future, html5)

That I need some javascript to play soundeffects on hover or load. So I might as wel use Scriptaculous's sounds.js instead of a yet to be supported html5 new audio object.

And for my original goal to have soundeffects even when flash is disabled on the browser; The next version of sounds.js will sniff out available sound-playing plugins to determine which to use; this would mean play with quicktime/wm if available, and if not play with flash? Could you elaborate on this?

Also for video I digg this solution; use jeroenwijerings player when no quicktime is available, and otherwise use quicktime. I would then encode the video as H.264, since most flash players can use that now. Would you agree, elaborate on this?

I have no experience with Scriptaculous so I can't comment on that. I try to avoid using sounds on my sites as they're a usability liability and most times just annoy users.

As for video, you're safest with just using Flash. Thanks to YouTube and sites like Hulu it's pretty much the preferred method for video on the web. It's cross-platform and has a number of streaming features, including h.264 codec support.

Besides, I think you'll find that people who don't have Flash aren't likely to have other plugins installed or aren't going to be the sorts of people who're going to look at your video.

Just use SWFObject 2 to sniff out if they have Flash or not and if not give them alternative content that has a nice link saying where they can download it.

And for my original goal to have soundeffects even when flash is disabled on the browser; The next version of sounds.js will sniff out available sound-playing plugins to determine which to use; this would mean play with quicktime/wm if available, and if not play with flash? Could you elaborate on this?

Flash is totally avoided with scriptaculous. I don’t think that flash would be used as a final resort - it would require even more JavaScript for the interaction. Personally I only user flash if video is involved.

Firefox 3.5 has been released, including support for open video formats. Does anyone have any experience with implementing these formats?

I’ve seen a few tutorials floating around and from what I’ve seen it’s not too horribly difficult.

And aside from no support in IE— big surprise there—it’s actually supported by most of the major players: http://molly.com/html5/html5-0709.html

Audio, however, is only supported in Safari and the latest version of Firefox, which just came out today. By now it’s pretty close to a million downloads globally. Normally it takes a week or two for it to percolate to the majority of Firefox users. I’m sure Chrome will support it in the next WebKit update.