Note : Vous trouverez ci-dessous les vidéos de la Web Accessibility Initiative diffusées lors de la conférence "Du design inclusif au développement accessible : quand le web incarne l’universalité" accompagnées de sous-titres et d'une transcription textuelle en français.
Ces traductions ont été réalisées par les conférenciers et ne sont en aucun cas des traductions officielles.
Support de présentation
Le support de présentation de cette conférence a été réalisé à l'aide de Microsoft PowerPoint.
Lien de téléchargement : 2025-02-13-support_conference.pptx (fichier .pptx, 10.3Mo)
Vidéo : Outils et techniques - Perception
Vidéo originale en contexte : Perception - hearing, feeling and seeing | Web Accessibility Initiative (WAI) | W3C
Transcription textuelle avec description des visuels
| Audio | Visuel |
|---|---|
| Comment les personnes handicapées utilisent les technologies numériques. Perception - entendre, ressentir et voir. | Comment les personnes handicapées utilisent les technologies numériques. Perception - entendre, ressentir et voir. |
| Quand le contenu est accessible, les gens peuvent le percevoir à travers différents sens, en fonction de leurs besoins et préférences. Par exemple, certaines personnes qui ne peuvent pas voir un écran ou entendre de l'audio, dépendent de sites web et d'applications capables de présenter l'information de différentes manières. | Collage de trois personnes utilisant des appareils technologiques. |
| Les personnes aveugles peuvent utiliser des technologies d'assistance sur ordinateurs et téléphones portables appelées lecteurs d'écran. Ces outils logiciels lisent les informations à l'écran à haute voix, ou peuvent les présenter en braille. | Un homme aveugle utilise un ordinateur portable pour explorer une page de type Wikipédia sur les oiseaux. |
| Lien, Titre de niveau 2, Oiseau. Les oiseaux sont un groupe de vertébrés à sang chaud constituant la classe des Aves, (/’eIvi:z/) caractérisés par des plumes, des becs sans dents et la ponte. | Le contenu lu est mis en surbrillance sur la page pendant la narration. |
| Les lecteurs d'écran traitent mieux les sites web et applications avec des titres, listes, liens, boutons et autres structures correctement codés. | L'homme continue d'utiliser l'ordinateur portable. |
| Les personnes aveugles s'appuient sur l'audition ou le toucher, plutôt que sur la vue. Pour les vidéos, les créateurs de contenu doivent s'assurer que les informations visuelles sont également fournies sous forme auditive. | La caméra zoome pour mettre en évidence un bouton "Description audio" disponible sous un lecteur vidéo sur un site web. |
| Souvent, ces descriptions d'informations visuelles peuvent être insérées dans les pauses existantes de l'audio, ou le script peut être créé dès le départ avec des descriptions suffisantes des scènes, personnages, et autres informations visuelles importantes. | L'homme continue d'utiliser son ordinateur portable à son bureau. |
| Les personnes sourdes et aveugles utilisent également des lecteurs d'écran pour présenter les informations avec un appareil appelé plage braille. Les caractères en braille sont une combinaison de points en relief ou aplatis, que les gens lisent en les parcourant avec le bout de leurs doigts. | Une femme sourde et aveugle parcourt du doigt un appareil Braille. |
| De même que les personnes aveugles et sourdes-aveugles, les personnes sourdes ou malentendantes peuvent également utiliser le retour haptique ; par exemple, via des alertes vibrantes sur un téléphone mobile au lieu de notifications sonores. | Une femme sourde utilise son ordinateur portable à un bureau avec son téléphone à côté d'elle. Le flash de l'appareil photo de son téléphone clignote pour l'alerter d'un nouveau message dans une application de chat. |
| Les personnes sourdes ou malentendantes s'appuient souvent sur la vue au lieu de l'ouïe. Par exemple, en regardant une vidéo, elles peuvent utiliser des sous-titres ou la langue des signes comme alternative à l'audio. | Un homme sourd signe à ses collègues lors d'un appel vidéo, et un interprète signe leur réponse verbale. |
| Vous pouvez aider à rendre la technologie accessible pour moi. | Une femme sourdaveugle signe devant la caméra. |
| Accessibilité : Il s'agit des personnes. | Collage de 12 personnes avec des fonds de couleurs différentes. |
| Pour plus d'informations de la Web Accessibility Initiative sur la façon dont les personnes handicapées utilisent les technologies numériques, visitez w3.org/WAI/people | Accessibilité : Il s'agit des personnes ; w3.org/WAI/people |
Vidéo : Outils et techniques - Présentation
Vidéo originale en contexte : Presentation - distinguishing and understanding | Web Accessibility Initiative (WAI) | W3C
Transcription textuelle avec description des visuels
| Audio | Visuel |
|---|---|
| Comment les personnes handicapées utilisent les technologies numériques. Présentation - distinguer et comprendre. | Comment les personnes handicapées utilisent les technologies numériques : Présentation - distinguer et comprendre |
| Quand le contenu est accessible, les gens peuvent en ajuster la présentation pour le rendre plus facile à distinguer et à comprendre. Cela peut inclure l'ajustement de la taille de l'écran et des couleurs pour mieux voir, l'ajustement du volume audio pour mieux entendre, ou encore l'ajustement de la présentation du texte pour mieux le lire. | Collage de 4 personnes faisant différentes activités. |
| Certaines personnes malvoyantes augmentent la taille du texte pour le rendre plus lisible. Elles peuvent ajuster des propriétés dans le navigateur web ou le système d'exploitation, comme augmenter la taille par défaut du texte, le type de police et l'espacement des lignes pour mieux voir le texte. | Femme malvoyante regardant son moniteur de bureau à travers un écran de loupe placé devant le moniteur. |
| Les sites web et applications programmés et conçus pour s'adapter à ces propriétés permettent aux utilisateurs d'accéder au contenu sans que le texte ne se chevauche, ne soit coupé, ou qu'ils aient besoin de faire défiler le contenu verticalement et horizontalement. | Le texte sur un site web W3C-WAI est agrandi à l’aide de la fonction de zoom du navigateur, ce qui déclenche un design responsive. Lorsque la taille du texte augmente, les menus de navigation se réduisent en un seul bouton et le texte s’ajuste pour que tout le texte tienne dans la largeur de l’écran, comme sur un appareil mobile. |
| D'autres personnes malvoyantes agrandissent tout l'écran, pas seulement le texte. Elles peuvent utiliser des logiciels de grossissement d'écran, comme une loupe numérique. Certaines personnes changent également les couleurs du texte et d'arrière-plan pour mieux lire le texte ou utilisent des lecteurs d'écran pour écouter le texte en le lisant. Cela signifie que les sites web et applications doivent être conçus et programmés pour permettre aux gens de modifier les couleurs plutôt que de leur imposer qu'elles apparaissent d’une certaine manière. | La femme explore maintenant un site web scolaire en utilisant un logiciel de magnification, ce qui lui permet de voir des portions de la page tout en déplaçant la souris vers la droite, en ouvrant un menu de navigation, puis en déplaçant vers la gauche pour lire la liste des choix. |
| La présentation n'est pas seulement visuelle. Les personnes ayant des handicaps auditifs, par exemple, peuvent avoir besoin d'augmenter le volume des réunions en ligne et des contenus multimédia comme les vidéos, podcasts et musiques, sans pour autant augmenter le volume d'autres sons du système comme les alertes de notification. Ajuster les basses, les aigus et la balance du son peut rendre l'audio plus compréhensible, et les systèmes d'exploitation ainsi que les lecteurs multimédias doivent fournir ces réglages. De plus, ces réglages fonctionnent mieux avec un son de haute qualité sans bruit de fond. | Un homme portant un appareil auditif regarde une vidéo sur son ordinateur portable. Pendant le visionnage, il augmente le volume à l’intérieur du lecteur vidéo. |
| Les ajustements de présentation peuvent également faciliter la concentration sur le contenu, particulièrement pour les personnes avec différents troubles cognitifs et troubles de l'apprentissage. Cela inclut les « modes lecture » qui masquent les parties moins pertinentes du contenu, comme les barres latérales et les éléments de présentation ; les bloqueurs de pop-up et d'animations qui aident à éviter les distractions et interruptions ; et les guides de lecture numérique qui permettent aux lecteurs de se concentrer sur une ligne à la fois. | Un homme explore un site web W3C-WAI sur une tablette et active la fonctionnalité de mode lecture dans le navigateur. Cela supprime tout le contenu à l’exception du texte et fait en sorte que la page ressemble davantage à une page de livre d'un lecteur électronique avec des couleurs sépia. |
| Certaines assistans de lecture, par exemple, ceux que certaines personnes dyslexiques pourraient utiliser, ajustent la présentation du texte pour le rendre plus facile à lire. Cela inclut le changement de type de police, de la taille du texte, des couleurs, et de l'espacement entre les lettres, les phrases et les paragraphes. Certaines personnes lisent mieux avec des polices de type sérif, d'autres avec des polices sans sérif. L'ajustement de ces propriétés varie d'une personne à l'autre, c'est pourquoi une conception flexible est si importante. | Une femme utilise son ordinateur portable pour lire un article. Elle utilise les paramètres de police dans le navigateur pour changer la taille et le style de la police du texte de l'article. |
| D'autres assistans de lecture favorisent la compréhension. Certains peuvent traiter un texte pour simplifier des mots et des phrases, et parfois aussi simplifier des phrases complexes. Ces outils dépendent d'une programmation et d'un design adéquats pour fonctionner. | Une femme atteinte de la trisomie 21 lit un article sur le basket-ball. Le mot « calorie » est souligné et, lorsqu'on survole, il affiche une définition et une image dans une fenêtre contextuelle. |
| Vous pouvez aider à rendre la technologie accessible pour moi. | Une femme atteinte de la trisomie 21 parle à la caméra. |
| Accessibilité : Il s'agit des personnes. | Collage de 12 personnes avec des arrière-plans colorés différents. |
| Pour plus d'informations de la Web Accessibility Initiative sur la façon dont les personnes handicapées utilisent les technologies numériques, visitez w3.org/WAI/people | Accessibilité : Il s'agit des personnes ; w3.org/WAI/people |
Vidéo : Outils et techniques - Saisie
Vidéo originale en contexte : Input - typing, writing, and clicking | Web Accessibility Initiative (WAI) | W3C
Transcription textuelle avec description des visuels
| Audio | Visuel |
|---|---|
| Comment les personnes handicapées utilisent les technologies numériques. Saisie - Écrire, taper et cliquer | Comment les personnes handicapées utilisent les technologies numériques. Saisie - Écrire, taper et cliquer |
| Quand le contenu est accessible, les personnes peuvent utiliser une variété de matériel et de logiciels pour entrer du texte et activer des commandes. | Collage de quatre personnes dans différents environnements utilisant la technologie. |
| Certaines personnes n'utilisent pas de clavier et utilisent uniquement des dispositifs de pointage. Cela peut inclure une souris spécialisée, un joystick, un trackball ou un écran tactile pour cliquer sur des liens et des boutons et pour taper sur des claviers virtuels. | Un homme en fauteuil roulant avec des membres atypiques tient et utilise une tablette. |
| Cependant, même avec ces outils, les personnes peuvent rencontrer des difficultés à sélectionner de petites cibles, telles que de petits liens, boutons et contrôles. Les sites web et les applications avec de grandes zones cliquables autour des cases à cocher, des boutons radio et d'autres contrôles sont plus faciles à utiliser pour les personnes ayant une mobilité limitée et une dextérité réduite. | Un formulaire de site web apparaît et l'homme tape des informations telles que son numéro de téléphone. Pour la sélection des boutons radio et des cases à cocher, il peut taper le texte du label plutôt que de devoir taper sur les boutons radio et les cases à cocher eux-mêmes. |
| Les sites web et les applications doivent également offrir un support pour les personnes qui utilisent uniquement le clavier. Cela inclut des moyens de sauter des contenus répétés, tels que les en-têtes et les barres de navigation, et de ne pas casser les fonctionnalités par défaut des navigateurs et des systèmes d'exploitation. | Un homme avec un mouvement irrégulier des mains utilise un clavier avec de grosses touches pour taper. |
| Par exemple, utiliser la touche Tab pour naviguer entre les éléments cliquables, la touche Entrée pour sélectionner des éléments, et rendre l'élément actif visible en affichant un encadré autour de celui-ci. | Un formulaire web avec un cercle jaune audacieux autour du champ actuellement actif. Le focus se déplace de "Prénom" à "Nom" avec la touche Tab (plutôt qu'un clic de souris). |
| Les sites web et les applications qui proposent des prédictions de mots et des accélérateurs, par exemple pour les termes de recherche, réduisent lla saisie nécessaure et les rendent plus efficaces pour les utilisateurs de clavier. | Un homme avec un mouvement irrégulier des mains continue d'utiliser un clavier avec de grosses touches pour taper. |
| De plus, toutes les personnes utilisant le clavier ne peuvent voir l'écran ; par exemple, les personnes aveugles. Ainsi, en plus de garantir la compatibilité clavier, les sites web et les applications doivent aussi fournir des instructions claires, des étiquettes pour les champs de formulaire, des messages d'erreur et des notifications de statut, afin que les utilisateurs sachent ce qui se passe. | Un homme aveugle tape sur son ordinateur portable, naviguant à travers un formulaire web avec plusieurs menus déroulants. Il peut faire des sélections et passer au menu déroulant suivant en utilisant uniquement les commandes clavier. |
| Les sites web et les applications doivent aider les utilisateurs à repérer et corriger leurs erreurs de saisie ; par exemple, en affichant un résumé des données saisies avant leur soumission. | Une femme atteinte de la trisomie 21 utilise son téléphone mobile pour remplir un formulaire. Un écran de confirmation apparaît pour confirmer les entrées tapées avant la soumission. |
| Ils doivent aussi accorder suffisamment de temps pour terminer les tâches ou éviter complètement les limitates de temps. De nombreuses personnes handicapées ont besoin de plus de temps pour naviguer, s'orienter dans le contenu, et pour cliquer et saisir du texte. C'est en particulier le cas pour les personnes ayant des troubles cognitifs ou de l'apprentissage. | Une femme continue à utiliser son téléphone tout en étant à la salle de sport. |
| Enfin, les sites web et les applications doivent aussi prendre en compte les personnes qui n'utilisent ni clavier ni dispositifs de pointage et utilisent à la place une commande vocale. Par exemple, les sites web et les applications doivent être conçus et programmés de façon à ce que le nom d'un bouton dans le code corresponde au nom affiché à l'utilisateur. "Cliquez sur envoyer l'email." | Un homme en fauteuil roulant avec des membres atypiques dicte un e-mail sur son ordinateur portable. Une fois terminé, il prononce à voix haute la commande "Cliquez sur envoyer l'email." pour l'envoyer. |
| Vous pouvez aider à rendre la technologie accessible pour moi. | Un homme souriant devant son écran pendant que l'audio de son ordinateur lui relaye son message. |
| Accessibilité : Il s'agit des personnes. | Collage de 12 personnes différentes avec des arrière-plans colorés. |
| Pour plus d'informations de la Web Accessibility Initiative sur la façon dont les personnes handicapées utilisent les technologies numériques, visitez w3.org/WAI/people | Accessibilité : Il s'agit des personnes. w3.org/WAI/people |
Vidéo : Outils et techniques - Interaction
Vidéo originale en contexte : Interaction - navigating and finding | Web Accessibility Initiative (WAI) | W3C
Transcription textuelle avec description des visuels
| Audio | Visuel |
|---|---|
| Comment les personnes handicapées utilisent les technologies numériques. Interaction - naviguer et trouver | Comment les personnes handicapées utilisent les technologies numériques. Interaction - naviguer et trouver |
| Quand le contenu est accessible, les personnes peuvent naviguer et trouver des informations en utilisant différentes stratégies et approches en fonction de leurs préférences, de leurs compétences et de leurs capacités. | Collage de quatre personnes utilisant divers appareils technologiques. |
| Beaucoup de personnes ayant des troubles cognitifs et des difficultés d'apprentissage s'appuient sur une disposition et une conception claires pour trouver des informations sur les sites web et les applications. Cela inclut différentes manières de naviguer dans le contenu, comme l'utilisation de menus hiérarchiques ainsi que la fonctionnalité de recherche ; avec des repères visuels, comme l'utilisation de couleurs de fond pour indiquer différentes parties du contenu, l'utilisation de titres uniques, et la mise en avant des informations pertinentes dans des zones bien visibles. Il est également important d'utiliser un design cohérent et prévisible. | Un homme sur un ordinateur de bureau recherche un produit sur un site web de fournitures pour animaux, y compris en utilisant le champ de recherche. |
| Bien que beaucoup de ces aspects soient typiquement liés à l'utilisabilité et concernent les personnes avec ou sans handicap, ces situations affectent souvent les personnes en situation de handicap dans une plus grande mesure. Par exemple, les personnes ayant une faible vision qui utilisent un agrandissement d'écran s'appuient également sur des repères visuels pour s'orienter et trouver des informations sur les sites web et les applications. | Une femme malvoyante utilise un logiciel de grossissement sur son bureau pour voir le même site web de fournitures pour animaux, ne voyant qu'une portion de l'écran à la fois. |
| Et la cohérence et la prévisibilité aident tout le monde. Par exemple, les personnes aveugles utilisent des lecteurs d'écran pour scanner les structures de contenu, comme les titres, les liens et les menus de navigation afin d'avoir un aperçu et de s'orienter. Les sites web et les applications avec des titres, des étiquettes et une structure clairs et cohérents rendent le contenu plus prévisible et plus facile à naviguer. | Un homme aveugle utilise son ordinateur portable pour naviguer sur une page web concernant une visite à la bibliothèque. Les titres et la navigation latérale sur le site sont mis en évidence lors de la narration. |
| De plus, les personnes aveugles utilisent des mécanismes pour sauter des blocs de contenu, comme les titres, les barres de navigation, ou les menus, répétés dans les sites web et les applications. Elles dépendent également des sites web et des applications pour fournir des instructions claires et aider les utilisateurs à identifier et corriger les erreurs, comme des dates incorrectes, des numéros et d'autres types de saisie. | Un lien « Passer au contenu principal » sur la page de la bibliothèque est mis en évidence puis activé. Il déplace le focus vers le contenu principal de la page de la bibliothèque (en passant les menus de navigation). |
| De plus, les personnes en situation de handicap physique dépendent des étiquettes cohérentes qui permettent aux navigateurs de mémoriser optionnellement les entrées précédentes. Cela accélère la saisie car les gens peuvent sélectionner des entrées précédentes, par exemple, des noms et des adresses. | Un homme en fauteuil roulant tape sur un ordinateur portable dans un formulaire web. Les champs nom et adresse sont automatiquement remplis en sélectionnant un menu déroulant dans le navigateur qui a stocké ces informations. |
| Vous pouvez aider à rendre la technologie accessible pour moi. | Un homme (de la première scène) parle à la caméra. |
| Accessibilité : il s'agit des personnes. | Collage de 12 personnes avec des arrière-plans colorés. |
| Pour plus d'informations de la Web Accessibility Initiative sur la façon dont les personnes handicapées utilisent les technologies numériques, visitez w3.org/WAI/people | Accessibilité : il s'agit des personnes. w3.org/WAI/people |