HTML 5 : audio

HTML 5 permet nativement d'intégrer de l'audio dans vos pages web grace à la balise <audio>. Avant, il fallait le faire via un plugin comme flash.

Pour intégrer/lire un fichier audio sur votre page web, il suffit d'utliser la balise <audio> comme suit :

<audio controls>
  <source src="audio.ogg" type="audio/ogg">
  <source src="audio.mp3" type="audio/mpeg">
  <p>Votre navigateur ne prend pas en charge l'élément audio</p>
</audio>

Expliquons certains attributs : 

  • controls : permet d'ajouter à votre lecteur des contrôles audio comme la lecture, la pause et le volume
  • source : permet au navigateur de choisir le fichier audio à lire. Le navigateur va essayer de lire le premier fichier et s'il ne peut pas (pas compatible par exemple), il essaiera avec le deuxième et ainsi de suite. Par contre, lorsqu'il arrive à lire un fichier, il s'occupera plus des suivants.
  • src : permet d'indiquer le chemin du fichier à lire
  • type : il s'agit du media/type qui accompagne le format de l'audio. Ainsi audio/mpeg pour mp3, audio/ogg pour ogg et audio/wav pour wav.

Les navigateurs supportant la balise <audio>

Navigateur Chrome IE / Edge Firefox Safari Opera
Version A partir de la version 4.0 A partir de la version 9.0 A partir de la version 3.5 A partir de la version 4.0 A partir de la version 10.5

Compatibilité Navigateur / format audio

En HTML5, les formats audio pris en charge sont : MP3, WAV et OGG.

Navigateur Chrome IE / Edge Firefox Safari Opera
MP3 OUI OUI OUI OUI OUI
WAV OUI NON OUI OUI OUI
OGG OUI NON OUI NON OUI

Partager :
comments powered by Disqus

Suivez-moi sur Twitter

Copyright © 2010-2020 Lookman Design, tous droits réservés .