retour vers le site AccessiWeb

Guide AccessiWeb

vous êtes ici : Accueil > Fiches AccessiWeb : Multimédia > Critère 4.5

Critère 4.5 : Chaque objet multimédia a-t-il si nécessaire une audio-description synchronisée avec le contenu multimédia (hors cas particuliers) ?

revenir en haut de la page

Carte d'identité du critère 4.5 [niveau AccessiWeb : Bronze]

Test(s) AccessiWeb permettant de vérifier le critère 4.5

Note : le(s) test(s) suivant(s) sont issu(s) de AccessiWeb v1.1 [Déployé].

Autre(s) fiche(s) AccessiWeb à consulter en relation avec cette fiche

Correspondances avec des critères d'autres référentiels sur l'accessibilité du Web

revenir en haut de la page

Comprendre

Comprendre le critère

Chaque objet multimédia doit avoir si nécessaire une audio-description synchronisée à l'exception des cas particuliers pour le critère 4.5.

Bénéfices pour les utilisateurs

Valeur ajoutée pour le site

revenir en haut de la page

Comment évaluer

Note : de manière générale, il est conseillé de faire l'évaluation d'un critère via l'analyse de son code source. Ce procédé d'évaluation par le code source est détaillé ci-après quand il est possible : procédé d'évaluation en 3 étapes via le ou les tests associés au critère. Les procédés d'évaluation par différents outils sont donnés en complément de l'évaluation par le code source.

Par le code source

  1. Sélectionner le(s) élément(s) à tester :
    • Ouvrir le code source de la page Web et sélectionner le code associé à tous les éléments suivants (exemple de code source : <object type="..." data="..."><param name="..." value="..." />...</object>) :
      • balise object de type son (wave, mp3, ...), de type video (avi, rm, wmv...), de type animation (Flash, Java, SVG...)
      • balise a avec l'attribut href de type son (wave, mp3, ...), de type video (avi, rm, wmv...), de type animation (Flash, Java, SVG...)
      • balise applet de type son (wave, mp3, ...), de type video (avi, rm, wmv...), de type animation (Flash, Java, SVG...)
      • Evènements générés par un script permettant de jouer ou de lancer un fichier de type son (wave, mp3, ...), de type video (avi, rm, wmv...), de type animation (Flash, Java, SVG...)
    • Identifier dans un navigateur graphique les objets multimédia de type son (wave, mp3...), de type video (avi, rm, wmv...), de type animation (Flash, Java, SVG...).
    • Lancer la lecture de chaque objet multimédia.
    • Vérifier la présence d'une information visuelle.


  2. Appliquer le(s) test(s) suivant(s) :
  3. Valider le critère : le critère est validé si vous répondez oui à tous les tests applicables précédents.


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 d'outils Accessibilité du Web pour Internet Explorer (version 2.0 beta en français) :

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

revenir en haut de la page

Comment mettre en oeuvre

Avertissement : les informations du paragraphe "Comment mettre en oeuvre" sont données à titre indicatif. Les contenus des sous-paragraphes Implémentation et Exemple de bonne pratique ne présentent pas tous les codes d'implémentation.


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 à l'objet 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.

Pour implémenter l'audio-description et si cela est nécessaire et possible, il faut d'abord lire l'objet 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 l'objet multimédia.

Si vous synchronisez l'audio-description avec l'objet 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

revenir en haut de la page

Fiche précédente : fiche du critère 4.4 Fiche suivante : fiche du critère 4.6

Guide AccessiWeb (version 3.1, 2 mars 2009) | Conditions d'utilisation | Contact
Copyright © 2009 Association BrailleNet. Tous droits Réservés.