Intégrer une vidéo sans casser l'accessibilité

Ce qu'entend un lecteur d'écran

Une vidéo intégrée est un cadre venu d'un autre site web, placé dans votre page. Un lecteur d'écran annonce le cadre avant que le visiteur décide d'y entrer. Si le cadre n'a pas de titre, l'annonce est le mot cadre et rien d'autre, ou l'adresse du service vidéo. Le visiteur ne peut pas savoir s'il s'agit d'un message de la directrice ou d'une boucle d'arrière-plan.

Le correctif est un attribut title sur le cadre qui dit ce qu'est la vidéo : l'allocution de l'assemblée annuelle, une visite de la nouvelle clinique. Les contrôles automatiques signalent son absence sur chaque page, et c'est le constat d'accessibilité le plus fréquent sur les sites d'organisations que nous analysons.

Les sous-titres sont la norme, pas l'option

Une vidéo préenregistrée avec de la parole a besoin de sous-titres selon la norme d'accessibilité à laquelle renvoient tous les organismes publics et la plupart des bailleurs, WCAG 2.1 au niveau AA. Les sous-titres automatiques du service vidéo sont un point de départ et rien de plus : ils ratent les noms, les chiffres et toute personne avec un accent, et un chiffre faux dans un sous-titre est pire que pas de sous-titre.

Budgétez des sous-titres corrigés. Le service vidéo permet de modifier le texte automatique sur place, et une vidéo de dix minutes prend environ une demi-heure à corriger. Les sous-titres rendent aussi la vidéo cherchable et regardable sans le son, ce qui est la façon dont la plupart des gens regardent sur un téléphone.

Rien ne se lance tout seul

Un son qui démarre sans qu'on le demande est un obstacle pour qui utilise un lecteur d'écran, dont il couvre la propre voix, et une gêne pour tous les autres. La norme est simple : aucun audio en lecture automatique de plus de trois secondes sans un contrôle pour l'arrêter. Laissez la lecture automatique désactivée. Si une page a besoin d'un fond animé, il doit être muet, court et arrêtable.

Une transcription, ou au moins un résumé

Certains visiteurs ne peuvent pas du tout utiliser la vidéo : une connexion lente, un service vidéo bloqué sur un réseau de bureau, une personne sourde-aveugle avec une plage braille. Une transcription sous la vidéo les sert et devient aussi le texte que les moteurs de recherche indexent. Un résumé de deux paragraphes est le minimum acceptable quand une transcription complète n'est pas disponible.

Le faire sous WordPress

Le bloc d'intégration standard prend un lien et ne vous offre aucun champ pour le titre du cadre. La méthode fiable est un bloc HTML personnalisé avec le code d'intégration du service vidéo, modifié à la main.

Le même extrait règle deux autres problèmes. L'attribut lazy empêche le lecteur vidéo de se charger tant que le visiteur ne s'en approche pas en défilant, ce qui retire un lecteur lourd du premier rendu. L'adresse de confidentialité du service, quand il en propose une, empêche le service de déposer des cookies tant que le visiteur n'a pas appuyé sur lecture, ce qui compte pour la notice de confidentialité de votre propre site.

<iframe
  src="https://www.youtube-nocookie.com/embed/VIDEO_ID"
  title="2026 annual meeting: the executive director's report"
  loading="lazy"
  allow="picture-in-picture"
  allowfullscreen>
</iframe>

Donnez au cadre une largeur et une hauteur dans les styles de la page pour qu'il réserve sa place avant de se charger. Sinon la page saute quand le lecteur arrive, ce qui est le sujet d'une partie précédente de cette série.

Ce que l'audit gratuit détecte

L'audit gratuit vérifie la page d'accueil avec les mêmes règles d'accessibilité automatiques par lesquelles commence un vérificateur de conformité. Un cadre sans titre est signalé par son nom. La lecture automatique est signalée quand le lecteur la déclare. Les sous-titres et les transcriptions ne peuvent pas être vérifiés par une machine, et c'est précisément pour cela que ce sont ceux à vérifier vous-même.