HTML - Intégrer le multimédia
Parfois, vous devez ajouter de la musique ou une vidéo dans votre page Web. Le moyen le plus simple d'ajouter de la vidéo ou du son à votre site Web consiste à inclure la balise HTML spéciale appelée<embed>. Cette balise fait que le navigateur lui-même inclut des contrôles pour le multimédia fourni automatiquement par le navigateur prend en charge la balise <embed> et le type de média donné.
Vous pouvez également inclure un <noembed>balise pour les navigateurs qui ne reconnaissent pas la balise <embed>. Vous pouvez, par exemple, utiliser <embed> pour afficher un film de votre choix, et<noembed> pour afficher une seule image JPG si le navigateur ne prend pas en charge la balise <embed>.
Exemple
Voici un exemple simple pour lire un fichier midi intégré -
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<embed src = "/html/yourfile.mid" width = "100%" height = "60" >
<noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
</embed>
</body>
</html>Les attributs de balise <embed>
Voici la liste des attributs importants qui peuvent être utilisés avec la balise <embed>.
Note−Les attributs align et autostart sont déconseillés en HTML5. N'utilisez pas ces attributs.
| Sr.Non | Attribut et description |
|---|---|
| 1 | align Détermine comment aligner l'objet. Il peut être réglé au centre, à gauche ou à droite . |
| 2 | autostart Cet attribut booléen indique si le média doit démarrer automatiquement. Vous pouvez le définir sur vrai ou faux. |
| 3 | loop Spécifie si le son doit être joué en continu (définir la boucle sur true), un certain nombre de fois (une valeur positive) ou pas du tout (false) |
| 4 | playcount Spécifie le nombre de fois où jouer le son. C'est une option alternative pour la boucle si vous utilisez IE. |
| 5 | hidden Spécifie si l'objet multimédia doit être affiché sur la page. Une valeur fausse signifie non et une valeur vraie signifie oui. |
| 6 | width Largeur de l'objet en pixels |
| sept | height Hauteur de l'objet en pixels |
| 8 | name Un nom utilisé pour référencer l'objet. |
| 9 | src URL de l'objet à intégrer. |
| dix | volume Contrôle le volume du son. Peut être compris entre 0 (désactivé) et 100 (volume complet). |
Types de vidéo pris en charge
Vous pouvez utiliser différents types de fichiers multimédias tels que les films Flash (.swf), les types de fichiers AVI (.avi) et MOV (.mov) dans la balise incorporée.
.swf files - sont les types de fichiers créés par le programme Flash de Macromedia.
.wmv files - sont les types de fichiers Media Video de Microsoft Windows.
.mov files - sont au format Quick Time Movie d'Apple.
.mpeg files - sont des fichiers vidéo créés par le groupe d'experts Moving Pictures.
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<embed src = "/html/yourfile.swf" width = "200" height = "200" >
<noembed><img src = "yourimage.gif" alt = "Alternative Media" ></noembed>
</embed>
</body>
</html>Cela produira le résultat suivant -
Audio d'arrière-plan
Vous pouvez utiliser du HTML <bgsound>tag pour lire une bande-son en arrière-plan de votre page Web. Cette balise est uniquement prise en charge par Internet Explorer et la plupart des autres navigateurs ignorent cette balise. Il télécharge et lit un fichier audio lorsque le document hôte est téléchargé pour la première fois par l'utilisateur et affiché. Le fichier de fond sonore sera également rejoué chaque fois que l'utilisateur actualise le navigateur.
Note- La balise bgsound est obsolète et elle est censée être supprimée dans une future version de HTML. Donc, ils ne devraient pas être utilisés plutôt, il est suggéré d'utiliser l'audio de balise HTML5 pour ajouter du son. Mais toujours à des fins d'apprentissage, ce chapitre explique en détail la balise bgsound.
Cette balise n'a que deux attributs loop et src . Ces deux attributs ont la même signification que celle expliquée ci-dessus.
Voici un exemple simple pour lire un petit fichier midi -
<!DOCTYPE html>
<html>
<head>
<title>HTML embed Tag</title>
</head>
<body>
<bgsound src = "/html/yourfile.mid">
<noembed><img src = "yourimage.gif" ></noembed>
</bgsound>
</body>
</html>Cela produira l'écran vide. Cette balise n'affiche aucun composant et reste masquée.
Internet Explorer ne peut également gérer que trois fichiers de format audio différents: wav, le format natif des PC; au, le format natif de la plupart des stations de travail Unix; et MIDI, un système universel d'encodage de musique.
Balise d'objet HTML
HTML 4 introduit le <object>element, qui offre une solution polyvalente à l'inclusion d'objets génériques. le<object> element permet aux auteurs HTML de spécifier tout ce qui est requis par un objet pour sa présentation par un agent utilisateur.
Voici quelques exemples -
Exemple 1
Vous pouvez incorporer un document HTML dans un document HTML lui-même comme suit -
<object data = "data/test.htm" type = "text/html" width = "300" height = "200">
alt : <a href = "data/test.htm">test.htm</a>
</object>Ici, l' attribut alt entrera en image si le navigateur ne prend pas en charge la balise d' objet .
Exemple - 2
Vous pouvez incorporer un document PDF dans un document HTML comme suit -
<object data = "data/test.pdf" type = "application/pdf" width = "300" height = "200">
alt : <a href = "data/test.pdf">test.htm</a>
</object>Exemple - 3
Vous pouvez spécifier certains paramètres liés au document avec le <param>marque. Voici un exemple pour intégrer un fichier wav -
<object data = "data/test.wav" type = "audio/x-wav" width = "200" height = "20">
<param name = "src" value = "data/test.wav">
<param name = "autoplay" value = "false">
<param name = "autoStart" value = "0">
alt : <a href = "data/test.wav">test.wav</a>
</object>Exemple - 4
Vous pouvez ajouter un document flash comme suit -
<object classid = "clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" id = "penguin"
codebase = "someplace/swflash.cab" width = "200" height = "300">
<param name = "movie" value = "flash/penguin.swf" />
<param name = "quality" value = "high" />
<img src = "penguin.jpg" width = "200" height = "300" alt = "Penguin" />
</object>Exemple - 5
Vous pouvez ajouter une applet java dans un document HTML comme suit -
<object classid = "clsid:8ad9c840-044e-11d1-b3e9-00805f499d93"
width = "200" height = "200">
<param name = "code" value = "applet.class">
</object>le classidL'attribut identifie la version du plug-in Java à utiliser. Vous pouvez utiliser l' attribut facultatif codebase pour spécifier si et comment télécharger le JRE.