0

I'm creating a website for a musician who's website will be checked around the globe, so the compatibility of the reproduction of the audio element is essential.

Therefore I thought about the following to cover all possible browsers:

<audio controls="controls" data-music data-bind-target="{{ fileName }}">
    <source src="assets/audio/mp3/fileName.mp3" type="audio/mpeg" />
    <source src="assets/audio/ogg/fileName.ogg" type="audio/ogg" />
    <source src="assets/audio/webm/fileName.webm" type="audio/webm" />
    <source src="assets/audio/wav/fileName.wav" type="audio/wave" />
</audio>

I've seen websites which only insert mp3 and ogg, so I would like to know if I'm taking it too far. I've checked the MDN site regarding the formats but not sure what to follow, therefore I would like the opinion of other developers.

Creating these formats takes no effort so thats not the issue. I would like to know:

  • If this helps to make the audio file better cross-browser?
  • Does it affect the global performance or not?
  • Do all the files download or only the first one which works in the order displayed?
  • Which order would you recommend? if it matters...
Daniel Ramirez-Escudero
  • 3,877
  • 13
  • 43
  • 80
  • 1
    `Do all the files download or only the first one which works in the order displayed?` As far as I know its "only the first one which works in the order displayed" or browser tests the next one on list until it can play or list ends.. Check on Google which browsers support which formats at this time (2014). Also test in various browser brands. If you dont hear two songs at the same time, then you're doing okay with multiple entries. – VC.One Nov 26 '14 at 05:02
  • Does anyone have any more answers for the other questions? I really would like the opinion of other developers. – Daniel Ramirez-Escudero Nov 27 '14 at 09:04

0 Answers0