Le sons, la vidéo et le Web- dernière modification le 07/02/2009 - |
|
Les éléments multimédias proviennent toujours de ressources indépendantes du document HTML. Seul l'usage des images et des petites animations est standardisé. Le support du son, de la vidéo, d'espaces tridimensionnels ou d'autres éléments multimédias repose encore sur des technologies non standardisées. De nombreux navigateurs Web proposent la possibilité de greffer des logiciels (plugin) pour étendre leurs fonctionnalités, notamment le support de types de média non-standard.
Les flux (audio, vidéo) nécessitent un protocole de communication au fonctionnement différent de HTTP. C'est une des raisons pour lesquelles ce type de ressource nécessite souvent un plugin et est mal intégré aux pages Web.
Il en existe de très nombreux plug-ins qui remplissent tous des tâches très spécialisées. Une fois installés et configurés, ces plug-ins multimédias s'activent automatiquement dès que le(s) navigateur(s) les sollicite(nt) ; ils donnent aux pages Web une plus grande capacité de présentation. Ils sont tous téléchargeables gratuitement et fonctionnent avec la plupart des navigateurs et des plateformes, et sont quasiment obligatoires si l'on veut "accéder" aux documents multimédias mis à disposition sur le Web.
Pour en savoir davantage :
- Le multimédia , qu'est-ce que c'est ?
- Les formats audio et les formats vidéo
- Convertissez vos fichiers en ligne gratuitement sur Media-Convert
1. Jouer un fichier audio
1.1. La méthode la plus simple mais la moins ergonomique : l'hyperlien
Il suffit de créer un hyperlien standard vers un fichier au format adéquat (son et vidéo) ; l'exmple qui suit se fonde sur un fichier MP3 pour des raisons de simplicité, mais il est valable avec tous les formats audio.
Ainsi, en introduisant dans le code HTML les éléments suivants : <A HREF="docs/exemple.mp3">Mon fichier audio</A>, on obtient un hyperlien actif (ex : Mon fichier audio) qui permet de télécharger le fichier audio (clic droit, enregistrer sous...) ou, selon les machines et les paramétrages, qui affiche une fenêtre pour contrôler l'écoute du son.
Une fois mis à disposition, la séquence pourra pourra être copiée par l'utilisateur sur son disque dur et restituée dans son intégralité sur la machine cliente avec un player adapté.
Dans les 2 cas, rien n'est intégré à la page Web, il faut agir dans la seconde fenêtre, de manière plus ou moins contrôlée, ou la quitter pour jouer le fichier audio dans un autre logiciel que le navigateur.
MP3 | AAC | WMA | WAV | OGG VORBIS |
---|---|---|---|---|
compressé
|
compressé
|
compressé
|
non-compressé
|
compressé
|
format propriétaire |
format propriétaire | format propriétaire | format propriétaire | format libre |
Le MP3 (MPEG-1/2 Audio Layer 3), est un
algorithme de compression (codec) capable de réduire drastiquement la
quantité de données nécessaire pour restituer de
l'audio, mais qui, pour l'auditeur, ressemble à une reproduction
du son original non compressé.
|
Le AAC (Advanced Audio Coding) est un
codec audio basé sur la norme MPEG-4, d'où son surnom MP4.
Ce nouveau standard serait vu comme le successeur du célèbre MP3. |
Le WMA (Windows Media Audio) est un format
de compression audio destructeur développé par Microsoft.
Il offre pour spécificité la possibilité de protéger dès l'encodage les fichiers de sortie contre la copie illégale par une technique nommée gestion des droits numériques (GDN). |
C'est un algorithme de compression et de
décompression (codec) audio numérique, sans brevet, ouvert
et libre, avec pertes imperceptibles par l'oreille humaine. Il
est plus performant en terme de qualité et taux de compression
que le MP3.
|
|
DRM : non
|
DRM : non
|
DRM : oui
|
DRM : non
|
DRM : non
|
.: Principaux outils de lecture sous :. |
||||
1.2. Une méthode intégrée : les balises d'inclusion
La balise <EMBED> permet d'inclure de nombreux formats de fichiers multimédias (audio, vidéo, etc.) dans un document HTML ; elle fait appel à des modules externes (ou plug-in). Il faut toutefois que le plug-in soit installé sur la machine pour que les fichiers puissent être lus et joués. Une fois mis à disposition dans une page HTML, la séquence commencera à se charger et se jouera automatiquement dès que suffisamment de données auront été chargées par le client.
La balise<EMBED...> insère un fichier multimédia et la balise</embed> termine la commande précitée. L'attribut SRC="Adresse du média" indique l'adresse du fichier multimédia à jouer ; il peut être local ou distant (sur un autre site web par exemple)
L'attribut PLUGINSPACE="Adresse de l'application" indique l'adresse de l'application. L'attribut type="Type d'application" spécifie le type d'application destinée à lancer le fichier. La commande <NOEMBED...> insère un contenu alternatif si la commande embed n'est pas supportée. La commande </NOEMBED> termine la commande précitée.
De plus en plus de personnes insèrent des médias dans leur page web avec cette balise non standard <EMBED>. Pourtant il existe une balise standardisée pour ce genre d'insertion : la balise <OBJECT>.
Voir l'excellente page : http://www.cinehig.clionautes.org/spip.php?article256
lire un fichier audio (au format MP3)
avec le plug-in Quicktime
Quoique conforme aux recommandations du W3C, la balise <EMBED> n'est pas compatible avec tous les navigateurs.
En effet, Windows Internet Explorer ne supporte plus les plugins. Mais il existe un contrôle ActiveX QuickTime fourni par Apple. Pour charger ce contrôle ActiveX, il faut inclure la balise <OBJECT> du plugin (pour les autres navigateurs) à l'intérieur d'un <OBJECT> ActiveX (pour Windows Explorer 5.5 et au-delà).
Il faut donc insérer le code suivant pour plus d'universalité.
<OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" WIDTH="340" HEIGHT="260"
CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
<PARAM name="src" VALUE="exemple.mp3">
<PARAM name="autoplay" VALUE="false">
<PARAM name="controller" VALUE="true">
<EMBED TYPE="audio/quicktime"
SRC="exemple.mp3"
WIDTH="340" HEIGHT="260"
AUTOPLAY="false"
CONTROLLER="true">
</EMBED>
</OBJECT>
Remarque: Ce code provoque le chargement automatique du contrôle ActiveX mais ne dispense pas de l'installation par l'utilisateur de Quicktime pour Windows.
.: Remarques :.
- Si on change autoplay=FALSE par autoplay=TRUE et controller=TRUE par controller=FALSE, on a une séquence de son qui se lancera automatiquement au chargement de la page sans que n'apparaisse le contrôleur de sons.
- Vous pouvez effectuer des réglages assez fins en vous servant des attributs de la balise <EMBED>.
| haut |
Ce sont des programmes externes au navigateur, écrits en Flash, qui vont prendre en charge la lecture du fichier au format MP3. Aujourd'hui des solutions assez simples existent, mais elles s'appuient sur le plug-in propriétaire Flash player, permettant de rendre les fichiers MP3 audibles dans le navigateur web sur Mac, Windows, Linux ou Unix à condition d'installer le plug-in.
Pour mettre
en œuvre cette solution, il faut copier ces programmes externes,
les fichiers audio (au format MP3) dans un dossier de votre site Web (sur
Internet ou en intranet), puis indiquer le chemin du fichier audio dans
le code
source de la page (voir les exemples ci-dessous). Une fois cette
dernière phase réalisée, tout est transparent pour
le visiteur.
Une fois mis à disposition dans une page HTML, la
séquence commencera se jouera automatiquement et en
direct.
player_mp3.swf |
||
Le fichier
SWF nécessaire est téléchargeable (12 ko)
(clic droit, enregistrer sous...). Plus d'infos sur le player et aide pour générer le code sur http://emff.sourceforge.net |
Le fichier
SWF nécessaire est téléchargeable (8 ko) (clic droit, enregistrer sous...). Plus d'infos sur le player et aide pour générer le code sur http://flash-mp3-player.net/fr/ |
Le fichier SWF nécessaire
est téléchargeable (8 ko)
(clic droit, enregistrer sous...). Plus d'infos sur le player et aide pour générer le code sur http://www.alsacreations.fr/dewplayer |
|
|
|
La balise <OBJECT> suffit pour utiliser ce player ; il suffit de placer le fichier emff_lila.swf à la racine du site et de saisir le code suivant : | La balise <OBJECT> suffit pour utiliser ce player ; il suffit de placer le fichier player_mp3_maxi.swf à la racine du site et de saisir le code suivant : | La
balise
<OBJECT> suffit pour utiliser ce player ; il suffit
de placer
le fichier dewplayer.swf à la racine du site et de saisir le
code suivant : |
|
|
|
Nécessite Flash Player
|
Nécessite Flash Player
|
Nécessite Flash Player
|
Il existe plusieurs formats de vidéo
numérique. Tous ces formats sont plus ou moins
compressés, car sans compression, 1 seconde de vidéo
occuperait une taille non-conciliable avec sa manipulation et son
transport (22 Mo par seconde) !
Mettre une vidéo sur le Web demande une petite
préparation afin de réduire la taille du fichier. Pour
cela, il faut utiliser un compresseur ou un codeur (CODEC).
Il existe deux types : les CODEC logiciels et les CODEC
matériels. Pour qu’une vidéo soit lisible sur un
ordinateur, il faudra donc que CODEC approprié et qu'une
application de lecture de fichier média soient installés.
WMV
|
MOV
|
MPG / MPEG
|
AVI
|
RM/RAM
|
FLV |
conteneur qui utilise divers CODECs vidéo
|
Adobe Flash |
||||
format propriétaire | format propriétaire | format propriétaire | format propriétaire | format propriétaire | format propriétaire |
téléchargement et
streaming |
téléchargement et
streaming |
téléchargement
|
téléchargement
|
lecture directe | |
Flip4mac.com propose un module
pour Quicktime qui permet de lire le format WMV |
|
Nécessite Flash Player |
|||
Des logiciels spécifiques ou
propriétaires existent pour tous ces formats.
Le logiciel libre VLC media player permet de TOUS les lire, que ce soit sur son ordinateur ou en streaming. |
lecture dans le
navigateur |
Le téléchargement est la technique la plus simple
à mettre en œuvre et la plus compatible. De plus, cette
méthode ne nécessite que peu de moyens.
Ainsi, en introduisant dans le code HTML les éléments
suivants : <A HREF="docs/mon_clip.mov">Mon
clip vidéo</A>, on obtient un hyperlien
actif (ex : Mon clip
vidéo) qui permet de télécharger le
fichier vidéo (clic droit, enregistrer sous...) ou,
selon les machines et les paramétrages, qui affiche une
fenêtre pour contrôler son visionnage.
Dans les 2 cas, rien n'est intégré à la page Web,
il faut agir dans la seconde fenêtre, de manière plus ou
moins contrôlée, ou la quitter pour jouer le fichier audio
dans un autre logiciel que le navigateur.
Une fois mis à disposition dans une page HTML, la
séquence pourra pourra être copiée par
l'utilisateur sur son disque dur et restituée dans son
intégralité sur la machine cliente avec un player adapté.
Le principal problème est le temps de chargement : pour un
fichier de 1mn de 20 Mo, au travers d'une liaison modem classique (soit
un débit moyen de 4 ko/s) nécessitera un temps de
chargement de 1 heure et 26 minutes ! .
Une seconde solution consiste à diffuser les fichiers en streaming, mais iles contraintes techniques sont trop importantes pour envisager un projet de cette nature dans un cadre non-professionnel.
La balise <EMBED> permet d'inclure de nombreux
formats de
fichiers multimédias (audio, vidéo, etc.) dans un
document HTML ; elle fait appel à des modules externes
(ou plug-in). Il faut toutefois
que le plug-in soit installé sur la machine pour que les
fichiers puissent être lus et joués. Une fois mis
à disposition dans une page HTML, la
séquence commencera à se charger et se jouera
automatiquement dès que suffisamment de données
auront été chargées par le client.
Beaucoup de monde insère des médias dans leur page web avec cette balise non standard <EMBED>. Pourtant il existe une balise standardisée pour ce genre d'insertion : la balise <OBJECT>.
lire un fichier vidéo (au
format MOV) avec le plug-in Quicktime |
!!
Test de détection du plug-in !! |
Quoique
conforme aux recommandations du W3C, la balise <EMBED> n'est pas
compatible avec tous les navigateurs.
En effet, Windows Internet Explorer ne supporte plus les plugins. Mais il existe un contrôle ActiveX QuickTime fourni par Apple. Pour charger ce contrôle ActiveX, il faut inclure la balise <OBJECT> du plugin (pour les autres navigateurs) à l'intérieur d'un <OBJECT> ActiveX (pour Windows Explorer 5.5 et au-delà). Il faut donc insérer le code suivant
pour plus
d'universalité.
Remarque: Ce code provoque le
chargement automatique du contrôle
ActiveX mais ne dispense pas de l'installation par l'utilisateur de
Quicktime pour Windows.
|
|
.: Remarques :. | |
|
.:
D'autres players pour d'autres
formats… :. |
||
WMV
|
Real
|
DivX
|
Licence propriétaire |
Licence propriétaire | Licence propriétaire |
En savoir davantage : |
| haut |
Jusqu'à aujourd'hui, intégrer de la vidéo sur
un site web était plutot complexe, il fallait se confronter aux
problèmes liés aux différentes plateformes,
à la compatibilité des formats, à la taille
importante des fichiers et aux faibles vitesses de connexion.
Aujourd'hui des solutions assez simples existent, mais elles s'appuient
sur le plug-in propriétaire Flash player, permettant de
rendre
les vidéos visibles dans le navigateur web sur Mac,
Windows, Linux ou Unix à condition d'installer le plug-in.
Pour mettre en œuvre cette solution, il faut copier ces programmes externes, les fichiers vidéo (au format FLV) dans un dossier de votre site Web (sur Internet ou en intranet), puis indiquer le chemin du fichier audio dans le code source de la page (voir les exemples ci-dessous). Une fois cette dernière phase réalisée, tout est transparent pour le visiteur.
Les fichiers portants l'extension .FLV (pour FLash Video) sont des fichiers vidéos encodés dans un format réservé à être utilisé propriétaire par l'outil de développement Macromedia Flash. On peut toutefois les encoder avec d'autres libres ou gratuits.
FLV player : un lecteur vidéo
pour le Web (licence Creative Commons 2.0 by-sa) |
|
le fichier SWF nécessaire
est téléchargeable (8,5 ko) (clic droit, enregistrer sous...). plus d'info sur http://flv-player.net/fr/ Explications - Exemple Nécessite Flash Player |
|
Et voilà la résultat !! |
|
Outils pour |
|
Télécharger des vidéos de Dailymotion, Google Video, YouTube... |
Les Environnements Numériques de Travail (ENT) sont une réalité ; c'est à nous, enseignants, de nous lancer dans des innovations pédagogiques intégrant les Technologies de l'Information et de la Communication dans les EPLE (TICE). C'est pourquoi, nous devons nous aider de notre imagination et des ressources en ligne (techniques, multimédias ou pédagogiques) :
Ripper : opération qui consiste à copier le contenu de vos DVD sur votre disque dur
.: Des outils pour le faire :.
|
||||
gratuit
|
|
manuel (1,5 Mo)
|
||
gratuit
|
|
.: Des outils pour le faire :.
|
||||
gratuit
|
|
|||
gratuit
|
|
Audacity est un logiciel libre, fonctionnant sous plusieurs platerformes et OS , qui permet d'enregistrer des fichiers audio à partir de nombreuses entrées : le microphone, la carte son de l'ordinateur ou des diffusions en direct sur le Web, etc. C'est un logiciel puissant qui sait aussi s'utiliser simplement :
|
.: Des outils pour le faire :.
|
||||
gratuit
|
|
Une nouvelle façon de publier des contenus sonores émerge : le podcasting. Le mot podcasting est un mot-valise provenant de la fusion des mots "iPod" (c'est le baladeur d’Apple Computer) et "broadcasting" (qui signifie diffusion). Les traductions baladodiffusion et baladiffusion ont été proposées, fin octobre 2004, par l’Office québécois de la langue française. Ces deux mots-valises sont formés de "baladeur" et de "radiodiffusion".
Pour accéder à une émission podcastée, la procédure est semblable à celle utilisée pour accéder aux flux RSS puisque vous vous abonnez à l'alimentation d'un podcast. La différence entre les deux est que vous recevez du contenu audio au lieu de contenu texte.
Les auteurs mettent des émissions à disposition des auditeurs à partir de logiciels ad hoc. Les auditeurs créent des listes de lecture pour écouter et/ou télécharger ces émissions sur toutes sortes d’appareils, notamment sur les baladeurs numériques. Ensuite, le logiciel de podcasting repérera les fluxs auxquel vous êtes abonnés, puis téléchargera automatiquement les nouvelles émissions sur votre ordinateur.Pour accéder aux émissions podcastées, vous avez besoin d'un ordinateur avec accès à Internet et d'un lecteur qui puisse lire les fichiers MP3. En janvier 2006, cinq radios généralistes françaises publient divers contenus (souvent leurs émissions et chroniques quotidiennes) sous forme de podcasts : Europe 1, RTL, RMC, Radio France et RFI.
On les repère grâce au logo du podcast
Quelques sites sites de podcast :
.: Des outils pour le podcast :.
|
||||
gratuit
|
|
|||
libre
|
|
3.6. Créer une vidéo avec une caméra numérique
L'utilisation de la vidéo numérique en classe représente à la fois un défi et une occasion pour l'intégration des matières, mais aussi de compétences.
L'activité de production vidéo sera donc forcément un projet assez long mettant en apprentissage diverses équipes avec des approches qui pourront être différentes selon le thème choisi, l'âge et l'expérience des élèves ou le matériel disponible. Certains projets peuvent être plus courts, d'une technicité réduite, avec une approche de sensibilisation plutôt que de réalisation.Voir le volet technique d'un tournage sur
http://www.rtsq.qc.ca/video_en_classe/numerique_tournage.htm
.: Des outils pour le montage vidéo :.
fourni avec l'OS fourni avec l'OS libre