Accueil    HTML    Balise Source
 



balise audio  Balise SOURCE : source média

«  Partie précédente  |  Index  |  Partie suivante  »


  • Tag de fermeture : non ( ... /> en XHTML) | Support :
  • Google Chrome 20.0 et plus
  • Firefox 14.0.1 et plus
  • IE 9 et plus
  • Opera 12 et plus
  • Safari 5.1.7 et plus



La balise <source> est utilisée pour définir différents formats alternatifs d'un média au sein des éléments <audio> ou <video> pour permettre un support plus large du média par les différents navigateurs (ceux-ci ne supportant pas les mêmes formats).

L'emploi de la balise <source> implique de supprimer l'attribut "src" de la balise <audio> ou <video> et de lister chaque ressource alternative dans un nouvel élément <source>.
L'ordre d'apparition des fichiers multimédia dans les éléments <source> correspond à l'ordre de priorité dans lequel le navigateur tentera de lire les fichiers. Dès qu'un fichier est pris en charge, les suivants sont ignorés.

Pour couvrir la prise en charge par les principaux navigateur :
audio : il est préférable de fournir un fichier au format .mp3 et un fichier au format .ogg.
vidéo : il faut essayer de couvrir les formats .mp4, .ogg et .webm.

Pour celà il faut employer un logiciel de conversion comme par exemple :
sothinkmedia video-converter
(gratuit, gère les formats webm - mp4 - ogg ...)


Le support des formats audio et video les plus courant par les navigateurs est le suivant :

firefox
V 14 et +
chrome
V 20 et +
internet explorer
V. 9
safari
V 5.1 et +
opera
12 et +
mp3 non supporté ok ok ok non supporté
ogg ok ok non supporté non supporté ok
wav ok ok non supporté ok ok
h264 non supporté ok ok ok non supporté
ogg ok ok non supporté non supporté non supporté
webm ok ok non supporté non supporté ok

Propriétés pour la balise source :




Propriétés Définition Valeurs
media Indique quel sera le dispositif utilisé pour affiché le fichier multimédia all
screen
...
src URL du fichier son ou vidéo qui sera lu URL
type type mime de la ressource audio/mp3
audio/ogg
video/mp4
video/ogg
video/webm
...


Exemple d'utilisation de la balise source :




Définition de plusieurs formats de fichiers son au sein de la balise <audio> :

<audio controls="controls">
   <source src="exemples/exemple.mp3" type="audio/mp3" />
   <source src="exemples/exemple.ogg" type="audio/ogg" />
   Votre navigateur ne supporte pas le tag <audio>.
</audio>

Définition de plusieurs formats de fichiers video au sein de la balise <video> :

<video controls="controls" poster="exemples/exemplechatbg.jpg">
   <source src="exemples/exemplechat.webm" type="video/webm" />
   <source src="exemples/exemplechat.mp4" type="video/mp4" />
   <source src="exemples/exemplechat.ogv" type="video/ogg" />
   Votre navigateur ne supporte pas le tag <video>.
</video>


Définition de plusieurs formats de fichiers son au sein de la balise <audio> :



Définition de plusieurs formats de fichiers video au sein de la balise <video> :