Chaque média non temporel a-t-il, si nécessaire, une alternative (hors cas particuliers) ?
Une visite virtuelle en Flash, une maquette 3D propriétaire, une animation Silverlight : ces technologies non standard n’exposent pas leurs données aux lecteurs d’écran. Un utilisateur aveugle n’y accède pas. Le critère 4.8 impose qu’un lien ou un bouton adjacent permette d’atteindre une alternative accessible.
Contrairement aux images ou aux vidéos, les médias non temporels utilisent des technologies qui n’ont jamais intégré l’accessibilité dans leur conception. Flash est disparu, Silverlight abandonné, mais les visites virtuelles 3D, maquettes architecturales interactives et animations vectorielles propriétaires subsistent dans certains secteurs. Ce critère cible exactement ces cas, devenus rares mais pas inexistants.
L’alternative doit être accessible via un lien ou un bouton adjacent, clairement identifiable. Il peut pointer vers une page dédiée ou déclencher l’affichage d’un contenu directement dans la page. Dans les deux cas, cette destination doit elle-même être accessible : une page alternative remplie d’images sans alt ne valide pas le test 4.8.2.
Attention : un carrousel HTML animé en JavaScript n’est pas un média non temporel au sens du RGAA. Le HTML expose nativement ses données via les API d’accessibilité du navigateur. Ce type de composant relève du critère 7.1.
2 tests pour vérifier qu'une alternative accompagne chaque média non temporel
Lien ou bouton adjacent vers alternative d'un média non temporel
- Identifiez tous les médias non temporels dans la page : éléments
<object>,<embed>, applets, animations propriétaires non-HTML. - Pour chaque média non temporel, cherchez un lien ou un bouton adjacent et clairement identifiable comme tel.
- Vérifiez que ce lien ou bouton :
- soit pointe vers une URL contenant une alternative complète au média ;
- soit déclenche l’affichage d’une alternative directement dans la page courante.
- Si aucun lien ou bouton adjacent n’existe pour un média : le test échoue.
Accessibilité de l'alternative au média non temporel
- Reprenez chaque média non temporel pour lequel un lien ou bouton alternatif a été identifié au test 4.8.1.
- Suivez le lien ou activez le bouton adjacent.
- Vérifiez que la destination (page externe ou contenu dans la page) est elle-même accessible aux technologies d’assistance : parcourez-la avec un lecteur d’écran.
- Si l’alternative est inaccessible : le test échoue.
Cas de non-application du critère :
- Le média est purement décoratif (n’apporte aucune information utile) ;
- Le média est diffusé dans un environnement maîtrisé (postes et plug-ins contrôlés par l’organisation) ;
- Le média est inséré par JavaScript après vérification du plug-in, en remplacement d’un contenu alternatif déjà présent dans la source HTML.
Exemples
❌ Non conforme : Visite virtuelle sans alternative
<section>
<h2>Visite virtuelle de l'appartement</h2>
<object data="visite.swf" type="application/x-shockwave-flash" width="800" height="600">
<param name="movie" value="visite.swf">
</object>
</section>Aucun lien ni bouton adjacent ne permet d’accéder à une alternative. Un utilisateur aveugle, ou dont le navigateur ne supporte plus le plug-in, ne peut pas accéder au contenu de la visite. Le test 4.8.1 échoue.
✅ Conforme : Visite virtuelle avec lien vers une page alternative
<section>
<h2>Visite virtuelle de l'appartement</h2>
<object data="visite.swf" type="application/x-shockwave-flash" width="800" height="600">
<param name="movie" value="visite.swf">
</object>
<p><a href="visite-description.html">Accéder à la description textuelle de la visite virtuelle</a></p>
</section>Un lien adjacent clairement identifiable pointe vers une page de description complète. L’intitulé indique sans ambiguïté qu’il s’agit d’une alternative au média. Pour valider le test 4.8.2, la page cible doit elle-même être accessible.
✅ Conforme : Maquette 3D avec alternative affichée dans la page
<figure>
<object data="maquette-3d.swf" type="application/x-shockwave-flash" width="600" height="400">
<param name="movie" value="maquette-3d.swf">
</object>
<button type="button" aria-expanded="false" aria-controls="desc-maquette">
Voir l'alternative textuelle de la maquette
</button>
<div id="desc-maquette" hidden>
<p>Maquette d'un appartement T3 de 65 m² au 3e étage. Entrée avec placard, salon-cuisine ouvert de 28 m² donnant sur un balcon, deux chambres de 12 et 11 m², salle de bain avec baignoire.</p>
</div>
</figure>Un bouton adjacent avec aria-expanded et aria-controls affiche l’alternative directement dans la page. La description textuelle restitue l’information utile de la maquette de façon sémantiquement correcte et lisible par les lecteurs d’écran.
Astuces et pièges
⚠️ Carrousel HTML : ce n’est pas un média non temporel
En audit, la confusion est fréquente. Un carrousel en HTML et JavaScript n’est pas visé par le critère 4.8 car le HTML expose nativement ses données via les API d’accessibilité du navigateur. Seules les technologies non standard (Flash, Silverlight, applets Java, plug-ins propriétaires) n’assurent pas cette exposition. Un carrousel doit être évalué avec le critère 7.1.
⚠️ Valider 4.8.1 sans vérifier 4.8.2
Trouver un lien adjacent ne suffit pas. Le test 4.8.2 exige que la destination soit elle-même accessible. Un lien vers une page PDF non balisé, ou vers une page dont les images n’ont pas d’alternative textuelle, ne valide pas le critère. Les deux tests sont indépendants et doivent être réalisés séparément.
⚠️ Trois cas de non-application à mémoriser
Le critère ne s’applique pas si : (1) le média est purement décoratif, (2) il est diffusé dans un environnement maîtrisé où tous les postes disposent du plug-in requis, ou (3) il est injecté par JavaScript après détection du plug-in, en remplacement d’un contenu alternatif déjà présent dans la source HTML. Ce troisième cas est le mécanisme de progressive enhancement classique.
💡 « Clairement identifiable » a une signification précise
Le RGAA exige que le lien ou bouton soit « clairement identifiable ». Un lien dont l’intitulé est « Cliquez ici » ou qui est stylisé sans apparence de lien ne satisfait pas cette condition. L’intitulé doit indiquer explicitement qu’il donne accès à une alternative au média adjacent.
⚠️ SVG animé intégré via <object>
Un fichier SVG animé (via SMIL ou <animate>) intégré avec <object> peut relever du critère 4.8 si son contenu informatif n’est transmissible qu’à travers ce plug-in. Un SVG inline dans le DOM relève des critères image (1.x) et composant (7.x). La distinction repose sur l’exposition ou non des données via les API d’accessibilité du navigateur.
Questions fréquentes
Pourquoi auditer le critère RGAA 4.8 alors que Flash a disparu depuis longtemps ?
Rarement, mais pas jamais. Flash est mort fin 2020 et Silverlight avant lui. Cela dit, certains sites patrimoniaux ou applications métier héritées intègrent encore des visites virtuelles 3D, des maquettes interactives propriétaires ou des contenus SVG animés via plug-in. Le critère 4.8 s’applique à tous ces cas. En pratique, il est souvent non applicable sur les sites récents, ce qui doit être documenté explicitement dans le rapport d’audit.
Comment auditer le critère RGAA 4.8 sur les alternatives aux médias non temporels en pratique ?
Commencez par identifier les balises <object>, <embed> et <applet> avec des types MIME propriétaires (application/x-shockwave-flash, application/x-silverlight). Cherchez ensuite un lien ou un bouton immédiatement avant ou après le média, visuellement proche et sans ambiguïté. Si ce lien existe, suivez-le et vérifiez que la page cible charge correctement et que son contenu est accessible. L’absence de tout média non temporel dans le document rend le critère non applicable : notez-le.
Que signifie exactement « adjacent » pour le lien vers l'alternative d'un média non temporel ?
Adjacent signifie visuellement et structurellement proche du média dans le code source. Un lien placé trois sections plus bas, ou dans un menu de navigation global, ne remplit pas ce critère. L’utilisateur doit pouvoir identifier sans ambiguïté que ce lien concerne ce média précis. Placez-le immédiatement avant ou après l’élément, avec un intitulé explicite qui nomme le média concerné.
Comment valider RGAA 4.8 pour une alternative textuelle dépliable dans la même page ?
Oui, à condition que le bouton soit clairement identifiable comme lié à ce média, et que le contenu déplié soit effectivement accessible au clavier et aux lecteurs d’écran. Le critère 4.8 accepte aussi bien une alternative sur la même page (via un bouton) qu’une alternative sur une page séparée (via un lien). L’essentiel est que l’alternative soit accessible et équivalente en contenu.
Comment qualifier un <canvas> animé en JavaScript au regard du critère RGAA 4.8 ?
Non, sauf si ce <canvas> est généré par un plug-in propriétaire externe. Un <canvas> piloté par du JavaScript natif est du HTML : il relève des critères images (1.x) selon son rôle — informatif ou décoratif. Si le <canvas> porte une information, vous devez lui fournir une alternative textuelle (aria-label, aria-labelledby, ou contenu entre les balises), mais c’est le critère 1.1 qui s’applique, pas le 4.8.