Spécification du W3C et spécification du WHATWG

L'élément audio représente un son ou un flux audio.

Pour prévoir un fallback, au cas où le navigateur n'a pas de support pour l'élément audio, on peut mettre du contenu à l'intérieur de l'élément audio. Les navigateurs ne doivent donc pas afficher ce contenu, sauf lorsque le contenu de l'élément audio ne peut pas être joué par manque de support du navigateur.

Pour rendre le contenu audio accessible, il faut ajouter une retranscription.

Exemple

Dans l'exemple-ci dessous le lecteur audio permet de lire un échantillon de son de 10 secondes.

Les boutons de contrôle natifs (attribut controls) ont un rendu différent dans chaque navigateur.

Code

<audio id="monaudio" controls>
  <source src="space.mp3" type="audio/mp3">
  <source src="space.ogg" type="audio/ogg">
  <p>Votre navigateur ne peut pas lire ce flux audio. <a href="space.mp3">Télécharger le fichier mp3</a></>
</audio>

L'attribut controls n'est pas obligatoire. S'il est absent les boutons natifs doivent être remplacés par des boutons 'externes'.
Le fichier audio doit actuellement être fourni en 2 formats d'encodage, au moyen de l'élément source pour pouvoir être affiché dans tous les navigateurs. (Voir la page du Mozilla Developper Network ). S'il n'y a qu'un seul fichier audio, on peut le spécifier dans l'attribut src et ne pas utiliser l'élément source
L'attribut autoplay permet de démarrer le son automatiquement, mais est en général fortement déconseillé.

Support

Navigateurs

L'élément audio est bien supporté par la plupart des navigateurs. Il est possible de l'utiliser pour intégrer des fragments audios dans presque tous les navigateurs récents. Voir Can I use

Les navigateurs sont supposés générer des boutons de contrôle lorsque l'attribut controls est utilisé. Ils le font tous mais avec des rendus différents.

Lecteurs d'écran

Support par les lecteurs d'écran
VoiceOver 6
Jaws 14 avec IE9	Il est possible de lancer et arrêter l'audio. Le texte de l'alternative n'est pas lu mais le lien est lu.
NVDA 2013 & Firefox 25.0.1	Il est possible de démarrer l'audio ('bouton lire') et de contrôler l'audio avec les boutons de contrôle standards. Pendant la lecture du fragment audio NVDA fait des bips de plus en plus aigus pour refléter la barre de progression. C'est inutile et même dérangeant.. Le Bug a été rapporté à NVDA par Bart S le 11 décembre 2013. Ce bug n'apparaît pas si on utilise des contrôles personnalisés.
NVDA 2013 & IE10 NVDA 2013 & IE9	Il n'est pas possible d'utiliser le lecteur audio. C'est la solution de fallback qui est vue.
SuperNova 13.03	Il est impossible de démarrer l'audio ou de contrôler l'audio. Le lecteur audio est invisible. La solution de fallback n'est pas lue.

Clavier

Les boutons de contrôle (attributs controls) sont accessibles au clavier dans IE9, soit en utilisant TAB et ENTER, soit en utilisant la barre d'espace pour démarrer le son, les flèches (gauche et droite) pour avancer et reculer, fleche (haut et bas) pour augmenter/diminuer le volume, 'M' pour mute/unmute, etc.
Dans Firefox le TAB ne fonctionne pas pour accéder aux différents boutons de contrôle. Firefox prévoit des raccourcis clavier pour lecteurs audio: barre d'espace pour démarrer et arrêter, flèches droite et gauche pour avancer et reculer, etc.
Dans Chrome, les boutons ne sont pas utilisables au moyen du clavier.

Conseil

Vous pouvez utiliser l'élément audio. C'est une excellente alternative au Flash. Mais n'utilisez pas les boutons de contrôle natifs. Ajoutez des boutons de contrôle vous-même pour que tout le monde puisse les utiliser. Evitez d'utiliser autoplay.