picture picture
janvier 19, 2006 (X)HTML 26 Commentaires

Insérer du son dans une page HTML

… exercice délicat si l’on vise à l’universalité.

Deux balises principales permettent d’insérer un son dans une page HTML : la balise EMBED et la balise BGSOUND.
Plusieurs sons peuvent être lus dans un navigateur internet : MP3, WAV ou mid sont les plus utilisés.

Pour insérer un son, et lancer son écoute lors d’un clic de l’utilisateur par le player, vous devez utiliser la balise EMBED et spécifier le chemin du fichier son à lire.
Exemple :
<embed src="../musique/music.mid" hidden="false" autostart="true" width="200" height="50" />

lool cherchez pas… si vous n’êtes pas sous Internet Explorer ou Netscape, vous ne verrez rien… :(( Eh! oui… c’est une balise propriétaire…
Et si vous n’entendez toujours rien… c’est qu’en plus la version de votre navigateur a désactivé les sons ou ne les lit carrément pas :non: …

HIDDEN =true empêche l’affichage du contrôleur son (si =true, il est invisible)
AUTOSTART =true fait démarrer le son (si =false, c’est la commande du contrôleur son qui le permettra)
LOOP =1 fera lire le fichier 1 fois (si 2, 2 fois, si infinite, il sera lu en boucle).
WIDTH ET HEIGHT déterminent la largeur et la hauteur du contrôleur de son.

Vous pouvez également placer un son en arrière-plan d’une page HTML. Pour cela, vous devez utiliser la balise BGSOUND
exemple :
<bgsound src="music.mid" loop="1" / >

:/ même problême que pour la balise embed… lecture aléatoire en fonction du navigateur. A priori, IE est un des seuls à la lire correctement.

Dernier soucis :si vous voulez être valide en XHTML, …cette balise a disparu du catalogue et elle ne fait pas partie du standard HTML :C !

Et pour finir, si le visiteur peut parfois activer et désactiver à sa guise le son à l’aide du contrôleur de son, utilisez de préférence ce script avec des fichiers sons de faible taille, car la page HTML est chargée avec les fichiers sons.

Moralité : vive les baladeurs mp3 : c’est plus fiable que les sons web ! Et puis Flash fait ça très bien, utilisez donc plutôt une anim. Flash si vous tenez vraiment à embarquer des sons sur vos pages ;)

Vous n’en avez pas marre de mon midi ? Moi si… 8)

26 Responses to “Insérer du son dans une page HTML”

26 Commentaires

  1. webtolosa dit :

    Commentaires fermés pour cause de spam massif de ce post…

  2. @text/css dit :

    yop c’est clair que le son sans flash c’est pas compatible multi-navigateurs …

  3. maya dit :

    :bravo:
    Vous etes vraiment géniale j’aime ta façon d’expliquer les trucs
    merci

  4. text/css dit :

    je peux t’aider 8) , tu vas faire un tour sur le saint des saint 0) Monsieur google 0) tu tape balise compatible avec tout les navigateurs et la tu vas tomber sur des millier de réponse plus ou moins intéressante! mais ça m’étonnerais que tu trouve des balise qui sont à la fois compatible avec Ie safari nets cape , firefox, etc etc

  5. amadou dit :

    slt je cherche qu’elqu’un pour qu’il m’aide a trouver des balises compatibles avec n’importe quel navigateur pour insérer un son dans un fichier html

  6. virJny dit :

    Çà me casse la tête ce son. Je suis en première année src et je suis plutôt douée en html, mais la je bloque…
    Enfin si quelqu’un a une solution sa serai simpa qu’il l’explique de façon claire :]

  7. hihaaa dit :

    :) :] :)) ;) :/ :| lol lool :-D :D :( :[ :(( :C 8) :o :O 8O :"( :""( :-* :* :*) ~:( 0) :p x| zzz ??? :non: :no: oups! :kill: mdr :bravo: :bye: thx :gne: love

  8. thomas dit :

    moi j’ai 1 probleme aidez moi : http://tomstef.ifrance.com/
    merci d’avance

  9. sentenza dit :

    salut à tous je voudré insérer un son à chaque fois ke je clic mé g pa trouvé commen faire. aidé moi je sui noté merci

  10. hess dit :

    je désire savoir quel fichier utiliser en html pour insérer une image au niveau d’une page web

  11. toto dit :

    Pour le embed je sais pas ce que c’est le "chemin" à mettre. Aidez-moiiiii !

  12. Débutant dit :

    Est-ce que vous sauriez comme mettre un son de mon PC sur internet?

  13. momo dit :

    heu moui, je voudrais insérer un son que j’ai enregistrer, un son wav plus précisement, sur un article html, mais lorsque j’ai essayé vos truk :gne: :""( , ca ma affiché le lecteur, mais ca ne démarai pas en cliquant sur play ! :C

  14. webtolosa dit :

    > redrider : qu’apelles-tu "gérer" ??? :gne:

    > mentinet : personnellement je les "collerais" en un seul fichier son. Il y a u ntas d’utilitaires gratits qui font ca tres bien (va voir là par exemple : http://www.cestfacile.org/audacity.htm ). Mais fais attention au poids du fichier final …..

  15. mentinet dit :

    comment mettre plusieurs son d’affiler ?????

  16. redrider dit :

    comment peut on gérer un son sur une page html ? (avec un fichier son :wave)

    et pour la question d’avant:
    <bgsound src=mon_musique.wav loop=1> </bgsound>

    si ca peut t’aider !!

  17. illuvtar dit :

    moi ca march pa ca me met "le module a été trouvé mais une erreur c’est produite a son niveau et j’ai juste l’icone de quicktime…
    aidez moi a inséréer un son WAVE dans ma page please!!!

  18. katsoura dit :

    Je ne cherche pas un bidouillage quelconque. J’apprend simplement à utiliser un code HTML propre, correct et valide. Je m’aide avec le livre "xhtml et css, cours et exercices" de jean engels. Comme tu peux le voir en ligne, même l’exercice ne passe pas dans les navigateurs :(

    > http://www.funxhtml.com/CH4/exemple4-7.html

  19. webtolosa dit :

    euh… si j’ai un dernier conseil, utilise une anim Flash (meme d’un pixel!) qui embarque les sons sous toutes les platefomes, comme je le dis plus haut, c’est douteux, l’embarquement de sons en HTML

  20. julien dit :

    Quelqu’un peut-il me dire comment on insère un son avec object et qui fonctionne sur IE et Firefox ? J’ai tout essayer et y a rien qui marche :-(

    <object data="video-audio/fichier.mp3" type="audio/mp3" width="320" height="40">
    </object>

  21. raiden dit :

    merci pour votr aide j avai vrémnt bes1 de ce truc bon merci)

  22. webtolosa dit :

    > Sim : oui, tu as raison, embed a été supprimé avec XHTML mais object le remplace.
    Reste les pb de compatibilité avec les navigateurs, meme avec object…

  23. sim dit :

    le standard html spécifie néanmoins qu’on peut lire un fichier son avec
    <object type="audio/x-wav" data="test.wav"/>

  24. Web Tolosa dit :

    > Daniel :
    – Non pour ta premiere question, quicktime est necessaire pour les videos mais pas pour les sons. De toute façon tu peux utiliser Quicktime alternative ou le plug-in de Firefox dans ce cas…
    – et oui pour ta seconde question, mais pour les faire lire a Internet Explorer, je crois qu’il te faut avoir installés les codecs ad-hoc sur ton PC (fais une recherche sur gougueul a ce sujet)

  25. daniel dit :

    la config de la balise est la meme pour wm ?

  26. daniel dit :

    on est pas obliger de se taper le plugin quicktime quand meme ?