# Guide AccessiWeb

vous êtes ici : Accueil > Fiches AccessiWeb : Multimédia > Fiche 4.2

## Fiche 4.2 : Le contenu multimédia est-il synchronisé avec son alternative ?

Sommaire de la fiche :

- Carte d'identité
- Comprendre

- Comment évaluer
- Comment mettre en oeuvre

- Illustrations
- Références

### Carte d'identité

- Critère AccessiWeb : 4.2
- Niveau AccessiWeb : bronze
- Point(s) de contrôle WCAG 1.0 correspondants (Priorité 1 de WAI) : 1.4

revenir en haut de la page

### Comprendre

#### Bénéfices pour les utilisateurs

- Bénéfice 1 :
  Comme toute information électronique, il est nécessaire qu'une présentation multimédia (son, video, animation, ...) ait une alternative équivalente pour les personnes handicapées la consultant via leurs aides techniques (plage braille, synthèse vocale, raccourcis claviers, ...). Cette alternative (fournir l'information véhiculée dans la présentation multimédia sous-forme textuelle et sonore) doit être synchronisée avec la présentation multimédia. Ainsi, chacun pourra avoir accès de manière équivalente et en temps réel à l'information.
  Cette alternative doit être constituée de sous-titres synchronisés (captions en anglais) contenant uniquement les paroles exprimées dans la présentation multimédia (les sous-titres sont utiles pour les personnes sourdes ou malentendantes pouvant les lire) et d'une audio-description synchronisée (information sonore utile aux personnes déficientes visuelles). L'audio-description contient des commentaires audio des détails importants ne pouvant être compris à partir de l'écoute seule de la piste sonore principale comme des informations sur les actions, les personnages, les changements de scène et le texte à l'écran. Cette audio-description (information sonore) est le plus souvent insérée entre les silences afin de ne pas parasiter le signal audible principal.
- Bénéfice 2 :
  L'alternative équivalente synchronisée vient compléter l'alternative texte (consulter la fiche 4.1). Ces 2 alternatives complémentaires donnent aux personnes handicapées qui accèdent au Web via des aides techniques une liberté de consultation de la présentation multimédia.
- Bénéfice 3 :
  L'alternative équivalente synchronisée profite à tous. En effet, il peut arriver à chacun que les conditions de consultation d'une présentation multimédia soient non optimales: bruit extérieur empêchant l'écoute, luminosité de l'écran non suffisante pour distinguer parfaitement les images, liaison Internet à faible débit introduisant des perturbations dans la lecture de la présentation multimédia comme des images saccadées ou un son coupé par moment, etc. La possibilité de pouvoir lire des sous-titres ou d'écouter une audio-description de la présentation multimédia vient alors résoudre un problème ponctuel d'accès à l'information.

#### Valeur ajoutée pour le site

- Bénéfice 1 :
  Rendre accessible ses présentations multimédia élargit son audience à tous les internautes et assure un service de consultation de qualité quelque soit les conditions d'accès.

revenir en haut de la page

### Comment évaluer

#### Par le code source

1. Il est possible de lire le code utilisé pour la présentation multimédia (SMIL par exemple) et vérifier ainsi qu'il respecte les standards. Cependant, il suffit de lancer la présentation multimédia dans un lecteur multimédia pour s'apercevoir tout de suite si elle contient une alternative équivalente synchronisée.

#### Par l'utilisation d'outils

Pour une liste complète des outils utilisés pour évaluer l'accessibilité des pages web, et un résumé de leurs principales fonctionnalités, reportez-vous à la page Outils d'aide à l'évaluation.

##### Evaluer avec la barre AccessiWeb (version 1.0) :

1. Sous Internet Explorer, ouvrir la page à analyser.
2. Dans le menu "4. Multimedia" de la Barre AccessiWeb, activer le critère 4.2.
3. Le code source de la page s'affiche dans une nouvelle fenêtre.
4. Il est possible de lire le code utilisé pour la présentation multimédia (SMIL par exemple) et vérifier ainsi qu'il respecte les standards. Cependant, il suffit de lancer la présentation multimédia dans un lecteur multimédia pour s'apercevoir tout de suite si elle contient une alternative équivalente synchronisée.

##### Evaluer avec la barre d'accessibilité AIS pour Internet Explorer (version 1.2 en français) :

1. Cliquer sur le menu "Source", puis sur l'option "Voir le code source [Nouvelle fenêtre]"
2. Il est possible de lire le code utilisé pour la présentation multimédia (SMIL par exemple) et vérifier ainsi qu'il respecte les standards. Cependant, il suffit de lancer la présentation multimédia dans un lecteur multimédia pour s'apercevoir tout de suite si elle contient une alternative équivalente synchronisée.

##### Evaluer avec la Barre d'Outils Web Developper pour Firefox (version 1.0.2 en français) :

Ce critère n'est pas évaluable par la barre d'outils Web Developer version 1.0.2 pour Firefox.

##### Evaluer avec le lecteur d'écran Jaws (version 5 et 6.2 en français) :

Ce critère n'est pas évaluable par le lecteur d'écran Jaws.

revenir en haut de la page

### Comment mettre en oeuvre

#### Qui est concerné ?

C'est le développeur HTML qui va implémenter ce critère mais c’est au rédacteur de contenu de fournir le contenu des sous-titres associés à la présentation de multimédia, le contenu de l’audio-description si celle-ci est possible et les temps de synchronisation.

#### Implémentation

Le W3C préconise l'utilisation du langage de programmation SMIL (Synchronized Multimedia Integration Language), en français : langage d'intégration multimédia synchronisée. Il permet d'intégrer des éléments multimédia sur le Web. Le mot "synchronisé" indique bien que ces éléments (images, mais aussi sons, vidéos, textes...) peuvent être synchronisés les uns avec les autres, pour créer au final de véritables présentations multimédia. Sa capacité à séparer les médias permet d'obtenir un contenu plus léger à charger.
Il faut veiller à implémenter le fichier multimédia de telle manière que l’internaute puisse le consulter quelque soit son aide technique (plage braille, raccourcis claviers, …) et en gardant toujours le contrôle (en l’état actuel des plugins, il semble que seule la lecture dans un lecteur multimédia extérieur permette de respecter ces 2 exigences qui correspondent au critère AccessiWeb 13.7. Plus d’informations sur la fiche 13.7).
Pour implémenter les sous-titres, il faut d'abord écouter la bande son de la présentation multimédia et transcrire le texte et son temps de synchronisation. Puis, soit à l'aide d'un éditeur de texte, soit avec un outil de synchronisation type MAGpie, il faut créer le fichier texte SMIL qui contient les informations pour le contenu des sous-titres et des temps de synchronisation avec les images de la présentation multimédia.
Il faut veiller à ce que l’internaute qui la lira via un lecteur multimédia puisse choisir de lire ou pas les sous-titres (en l’état actuel des lecteurs multimédias gratuits sur le Web, il semble que les 3 lecteurs multimédias les plus connus permettent ce choix: Window Media Player, Quicktime et Real Player). Si vous synchronisez les sous-titres avec la présentation multimédia en utilisant SMIL, vous devez mettre l'attribut systemCaptions à "on" dans votre fichier SMIL principal pour laisser à l'internaute le choix de lire ou pas les sous-titres (note: dans la version 1.0 de SMIL, il s'agit de l'attribut system-captions).
Pour implémenter l'audio-description et si cela est nécessaire et possible, il faut d'abord lire la présentation multimédia et décider quelles informations descriptives doivent être dites et leurs temps de synchronisation. Puis, soit à l'aide d'un magnétophone multimédia comme celui présent dans Accessoires sous Windows, soit avec un outil de synchronisation type MAGpie, il faut créer le fichier texte SMIL qui contient les liens vers les informations sonores pour le contenu de l'audio-description et les temps de synchronisation avec les images de la présentation multimédia.
Quand une audio-description est insérée dans une présentation multimédia, il faut veiller à ce que l’internaute qui la lira via un lecteur multimédia puisse choisir d'écouter ou pas cette audio-description (en l’état actuel des lecteurs multimédias gratuits sur le Web, il semble que Window Media Player ne lise pas la piste sonore d’audio-description, que Quicktime la lise mais ne permette pas de contrôler son utilisation, que Quicktime Pro le permette mais est payant et que seul Real Player la lise et permette également son contrôle par l’internaute). Si vous synchronisez l'audio-description avec la présentation multimédia en utilisant SMIL, vous devez mettre l'attribut systemAudioDesc à "on" dans votre fichier SMIL principal pour laisser à l'internaute le choix d'écouter ou pas l'audio-description (note: cet attribut existe uniquement dans la version 2.0 de SMIL).

#### Exemple de mauvaise pratique

Note: les éléments multimédia présentés dans ce paragraphe sont issus du WAI WCAG Curriculum: Multimedia Software Page. Les codes sources ont été modifiés pour les besoins propres à ce paragraphe.
Dans le code ci-après, un lien vers une video est proposée (video sur "une voiture et Einstein"). Mais elle ne contient ni sous-titres, ni audio-description.

<html>
<body>
Voir la
<a href="http://www.domaine.com/car.smi">
video sur "une voiture et Einstein" (format <span lang="en">SMIL</span>, 515 <acronym title="kilo octets">ko</acronym>)
</a>.
</body>
</html>

Le code source du fichier SMIL "car.smi" est le suivant:

<smil xmlns="http://www.w3.org/2001/SMIL20/Language">
<head>
<meta name="title" content="Car"/>
<meta name="author" content="NCAM/NOVA"/>
<meta name="copyright" content="©1998 WGBH Educational Foundation" />
<layout>
<root-layout background-color="black" height="180" width="250"/>
<region id="videoregion" background-color="black" top="5" left="35" height="130" width="180"/>
<region id="textregion" top="135" left="-37" height="120" width="250"/>
</layout>
</head>
<body>
<par>
<!-- VIDEO -->
<video src="carsilent.rm" region="videoregion"/>
<!-- PROGRAM AUDIO -->
<audio src="carnarren.rm"/>
</par>
</body>
</smil>

#### Exemple de bonne pratique

Note: les éléments multimédia présentés dans ce paragraphe sont issus du WAI WCAG Curriculum: Multimedia Software Page. Les codes sources ont été modifiés pour les besoins propres à ce paragraphe.
Dans le code ci-après, un lien vers une video est proposée (video sur "une voiture et Einstein"). Cette video propose des sous-titres synchronisés et une audio description synchronisée. Un lien pour télécharger un lecteur multimedia est donné, ainsi que des renseignements pour bien utiliser les fonctionnalités d'accessibilité. De plus, un message informe l'internaute qu'un fichier texte de transcription de la video (contenant l'alternative textuelle équivalente à cette video) est également disponible.

<html>
<body>
Vous pouvez consulter la video sur "une voiture et Einstein" via un lecteur multimedia (<a href="http://france.real.com/freeplayer_r1p.html">télécharger le lecteur <span lang="en">Real Player</span> en français</a>) ou lire le fichier texte contenant sa transcription. Cette video contient des sous-titres et une audio-description synchronisées. Vous avez la possibilité des les consulter en sélectionnant l'option d'affichage des sous-titres synchronisés ("Utiliser les légendes supplémentaires, si disponibles") et l'option d'écoute de l'audio-description ("Utiliser l'audio-descriptif, si disponible.") dans le menu "Outils > Préférences > Contenu > Accessibilité" du lecteur <span lang="en">Real Player</span>.
<ul>
<li>
Voir la
<a href="http://www.domaine.com/car.smi">
video sur "une voiture et Einstein" (format <span lang="en">SMIL</span>, 515 <acronym title="kilo octets">ko</acronym>)
</a>.
</li>
<li>
Lire la
<a href="http://www.domaine.com/transcription_car.txt">
transcription texte de la video sur "une voiture et Einstein" (<acronym title="texte">txt</acronym>, 2 <acronym title="kilo octets">ko</acronym>)
</a>.
</li>
</ul>
</body>
</html>

Le code source du fichier SMIL "car.smi" est le suivant:

<smil xmlns="http://www.w3.org/2001/SMIL20/Language">
<head>
<meta name="title" content="Car"/>
<meta name="author" content="NCAM/NOVA"/>
<meta name="copyright" content="©1998 WGBH Educational Foundation" />
<layout>
<root-layout background-color="black" height="180" width="250"/>
<region id="videoregion" background-color="black" top="5" left="35" height="130" width="180"/>
<region id="textregion" top="135" left="-37" height="120" width="250"/>
</layout>
</head>
<body>
<par>
<!-- VIDEO -->
<video src="carsilent.rm" region="videoregion"/>
<!-- PROGRAM AUDIO -->
<audio src="carnarren.rm"/>
<!-- CAPTIONS -->
<textstream src="carcapsen.rt" region="textregion" systemCaptions="on"/>
<!-- AUDIO-DESCRIPTION -->
<audio src="cardescen.rm" systemAudioDesc="on"/>
</par>
</body>
</smil>

revenir en haut de la page

### Illustrations

Il n'y a pas d'illustration pour cette fiche.

revenir en haut de la page

### Références

#### Autres fiches à consulter

- Fiche 4.1 : Est-il possible de récupérer les informations fournies dans les supports multimédias d'une autre manière ?
- Fiche 13.7 : Est-ce que la présentation spécifique d'une information n'entrave pas l'accès à son contenu ?

#### Autres ressources

- accessibilité vidéo
- WAI Curriculum: exemple pour le checkpoint 1.4
- WebAIM : Captions
- WebAIM : Captioning Real Media
- Accessible electronic content : Make video accessible
- Skills for Access : Provide text equivalents for audio - general advice on captions
- Skills for Access : Provide audio
- descriptions for video or animated content - general advice
- AccessIT : How do I make multimedia accessible ?
- MAGpie
- WebAIM : Captioning with MAGpie
- MAGpie Documentation : Starting a Captioning Project
- Spécification du langage d'intégration multimédias synchronisés (SMIL) version 1.0
- Langage d'Intégration Multimédias Synchronisés (SMIL 2.0)
- WAI Resource: SMIL 1.0 Accessibility Improvements
- SMIL pour Real Player
- allHTML.com : le langage SMIL

revenir au sommaire de la fiche

revenir en haut de la page

Guide AccessiWeb (version 2.1, 30 août 2006) | Conditions d'utilisation | Contact