mis à jour le 01.11.2003

remarques, réflexions : Christian Oïhénart

Sons et vidéos                                                  

Insertion d'un son

En préalable, il faut absolument dire que la possiblité d'afficher des sons dans une page Web dépendra beaucoup de la configuration de l'ordinateur de l'internaute. Il suffit que les navigateurs (netscape ou IE, sans compter tous les autres) ne soient pas configurés correctement ou ne contiennent pas les bons plug-ins pour que certains formats ne soient pas lus. Sans compter que par exemple Netscape et Internet Explorer ne gèrent pas tous les formats de la même manière.

Plusieurs possibilités existent pour mettre du son sur une page html (son au format AIF, WAV, AU, MP3, QuickTime, Real Audio, Midi,,...). L'inconvénient des trois premiers formats (Aif sur Macintosh et Wav sur Windows) est qu'ils ne sont pas compressés. Or, comme pour les images, avant de mettre un son sur une page, il faut lui faire subir une sérieuse cure d'amaigrissement. Ainsi, un fichier MP3 est à peu près dix fois moins lourd que son équivalent en WAV, pour une sonorité très semblable.

D'une manière générale, quatre possibilités existent pour insérer une séquence sonore dans une page web, correspondant chacune à une balise différente:

- <BGSOUND> pour diffuser de la musique en arrière plan. Mais Internet Explorer est le seul à reconnaître cette balise. Nous n'en parlerons pas ici.
- <A HREF> Balise universelle, mais dont les résultats sont très tributaires de la configuration du visiteur
- <EMBED> Balise provenant de l'univers de Netscape qui donne la plupart du temps les meilleurs résultats. Seul inconvénient, certains types de fichiers nécessitent un plug-in.
- <OBJECT>, balise récente que nous ne traiterons pas ici.

<A HREF>
La manière la plus simple : créer un lien (texte ou image) qui ouvrira le lecteur par défaut sur l'ordinateur de l'internaute. On a ici un simple lien pointant vers un fichier son. Celui-ci sera lu par le player, parfois dans une nouvelle fenêtre.

 

<A HREF="medias/pig.aiff"><IMG SRC="images/cochon.gif" WIDTH=40 HEIGHT=40 BORDER=0 ALIGN=middle>

<EMBED>
- La manière la plus élégante : utiliser la balise <embed> et copier cette balise dans le code source de votre page html (le son se nomme ici bubbles.aif). Le fichier sera alors lu en arrière-plan. Dans la page, seule la fenêtre du panneau de commande de lecture sera visible. On peut fixer la présence d'un contrôleur, la lecture ou non en boucle, le démarrage ou non du son dès l'ouverture d'une page.

<EMBED SRC="medias/bubbles.aiff" WIDTH =160 HEIGHT =16 CONTROLLER=true LOOP =false AUTOPLAY =false>

 

On peut ainsi insérer un fichier aif, au, wav, midi, mp3

 

Dans certains cas, le fichier ne pourra pas être lu par le navigateur, il sera alors téléchargé, et c'est par exemple Winamp sur PC qui jouera les sons mp3.

On peut aussi utiliser QuickTime pour effectuer une compression de la séquence sonore. Cela a permis par exemple de faire passer ce son de 3,1 Mb ( à l'enregistrement) à 44 k, non sans perte de qualité il est vrai.

Si l'on insère une séquence QuickTime (qui ne comprendra en fait qu'une bande-son), on le fait très facilement par le menu Insertion. Différents réglages sont alors possibles, qui correspondent aux réglages vus plus haut pour la balise <embed>. La fenêtre ci-dessous correspond donc au code-source dans le cadre bleu. Le nom du fichier son est ici musique.mov, se trouvant dans le dossier medias à côté de la page html.

<EMBED SRC="medias/musique.mov" PLUGINSPAGE="http://www.apple.com/quicktime/download" WIDTH=160 HEIGHT=16 CONTROLLER=true LOOP=false AUTOPLAY=false>

 

Insertion d'une vidéo QuickTime

Il faut retenir que pour visualiser une séquence QuickTime dans un navigateur, celui-ci doit être muni des plugs-in adéquats. Ceci est aussi valable pour d'autres données multimédia (plug-in Flash par exemple).
Comme pour les images, il faut stocker ces différents éléments dans un dossier à l'intérieur du dossier de site.

D'autres formats de vidéos sur le net existent, mais je me suis restreint à celui-ci car il est directement géré par Home Page.

L'insertion d'un movie QuickTime se fait simplement en choisissant Séquence QuickTime dans le menu Insertion ( ce qui correspond à l'utilisation d'une balise embed). Par un double-clic sur la séquence, on ouvre l'éditeur de Séquence QuickTime ou différents paramètres peuvent être réglés (démarrage automatique, boucle, présence du contrôleur, ...).
Le problème de la vidéo reste bien évidemment sa taille très importante, difficilement compatible avec le Net dans sa structure actuelle. Donc le vrai travail est en amont, afin de rendre les vidéos les plus petites.

Page contenant la 1ère vidéo : video1.html

Page contenant une vidéo qui se déclenche dès le chargement de la page: video2.html

Comme nous l'avons vu pour les sons, il est aussi possible d'utilser simplement un lien vers un fichier : video2

 

 Mais pour plus de détails, je ne peux que vous renvoyer sur les excellentes pages faites par François Lombard. 

Les ressources du Web, les bonnes adresses, ont été centralisées sur la page des ressources.

Page précédente Page suivante