Accessibilité web
Aide à la navigation pour Radio-Canada.ca
Utilisez des raccourcis clavier pour effectuer des actions spécifiques plutôt que votre souris, votre pavé tactile ou tout autre périphérique d’entrée.
Pour utiliser un raccourci clavier, appuyez sur la touche spéciale, tel que spécifié plus bas, une seule fois ou en séquence si plusieurs actions sont souhaitées.
Utiliser la barre de navigation ou tout autre raccourci courant
- Touche de tabulation (Tab.) : Permet de passer d’un élément à un autre.
- Touche Entrée ou Espace (Barre d’espace) : Ouvre le panneau ou bien permet d’accéder au lien sélectionné.
- Touche Échap (Esc) : Permet de sortir d’un panneau d’un menu quand celui-ci est ouvert.
Naviguer dans les différentes sections du menu
- Touche de tabulation (Tab.) : Permet de passer d’une section à une autre dans le menu.
- Touche Entrée ou Espace (Barre d’espace) : Ouvre la section sélectionnée, pour accéder aux liens que celle-ci contient.
- Touche Échap (Esc) : Ferme le menu lorsque celui-ci est ouvert.
L’accessibilité web désigne un ensemble de normes qui permettent aux personnes handicapées de percevoir et de comprendre le web, d’y naviguer et d’interagir avec lui. Ces normes profitent également aux personnes âgées qui vivent des changements quant à leurs capacités physiques. Au Canada en 2017, 22 % de la population (6,2 millions de Canadiens) a déclaré vivre en situation d’handicap.
L’accessibilité web permet d’offrir un accès sans discrimination aux utilisateurs, peu importe les technologies utilisées pour accéder à une information. Par exemple, les personnes non voyantes doivent pouvoir naviguer sur un site web sur lequel les logiciels de synthèse vocale peuvent interpréter le contenu informationnel, et les personnes malentendantes doivent pouvoir accéder au contenu d’une vidéo à l’aide de sous-titrage.
Le World Wide Web Consortium (W3C), une organisation à but non lucratif permettant de définir des standards pour les technologies liées aux web, supervise un ensemble de standards, dont l’accessibilité (WCAG 2.0 et UAAG 2.0), qui compte trois niveaux (A, AA et AAA). Le travail d’évaluation et d’optimisation quant à l’accessibilité du site web de Radio‑Canada a commencé en mai 2014. Le standard que nous visons est l’AA.
Nous avons constitué un groupe-conseil composé de membres de chacune des professions concernées (intégrateurs, programmeurs, designers et contributeurs éditoriaux). Celui-ci analyse les meilleures pratiques suggérées, les techniques utilisées du WCAG 2.0 et les tests associés de l’UAAG 2.0. Le groupe-conseil a rédigé un référentiel de base pour tout projet. L’optimisation de nos sites quant à l’accessibilité est donc un processus évolutif.
Afin d’améliorer l’accès à nos contenus, certaines normes d’accessibilité sont en vigueur, telles que :
Applications mobiles
Sports et Info (iOS)
- Un nouveau bouton pour le grossissement des fontes a été ajouté. Le menu a été amélioré et optimisé pour le lecteur d’écran.
- Tableau des résultats électoraux : la gestion du grossissement des fontes a été améliorée et la lecture des résultats en mode lecteur d’écran a été raccourcie.
- Il est maintenant possible de naviguer vers les liens avec des commandes personnalisables.
- La source de la photo est lue dans les articles en mode lecteur d’écran.
- De l’information a été ajoutée dans les cartes : les préfixes « Vidéo », « Chronique » et « Analyse » et la date de publication en mode lecteur d’écran.
Sports et Info (Android)
- Un nouveau module entièrement accessible a été développé pour les élections. L’utilisateur peut le sélectionner pour que le lecteur d’écran lise de nouveau les données mises à jour.
- Dans le profil de l’utilisateur, la description des boutons est plus précise et explique correctement l’action posée.
- Nouvelle fenêtre de dialogue sur mesure : À l’affichage du dialogue, la lecture d’écran commence automatiquement par une description et explique le retour à l’écran précédent.
- La fenêtre de dialogue améliorée est utilisée dans différentes sections : formulaire d’abonnement à RDI, dialogue de manipulation des suivis et dialogue pour contacter les auteurs.
- Les champs de texte dans un article sont découpés en plus petits segments pour faciliter la navigation et la lecture du contenu par un lecteur d’écran.
- L’ordre des éléments lus dans un article respecte l’ordre normal de lecture en tout temps.
- De nouveaux modules ont été intégrés dans les médias sociaux et rendent la lecture du contenu plus descriptive pour l’utilisateur.
- Le nouveau menu de sélection pour les régions est entièrement accessible. Il permet d’ordonner ou de déplacer des éléments de la liste plus facilement avec un lecteur d’écran.
- Le type de média (audio, vidéo) est lu sur une carte contenant du contenu multimédia.
ICI Tou.tv (Android)
- Les contrôles de la console peuvent être cachés lorsque TalkBack est ouvert.
- Le mot « Vidéodescription » est lu à l’ouverture de l’option d’audiodescription dans le menu du lecteur vidéo.
- Les contrôles s’affichent sur les publicités lorsque TalkBack est ouvert.
- Le temps est lu avec le lecteur d’écran dans la console.
- Les flèches du lecteur vidéo sont lues par le lecteur d’écran.
- Correction de l’état de focus dans la page Épisodes sur LG G6 6.0.1.
- L’état de focus du lecteur d’écran reste sur la page lue sur la tablette Galaxy Tab E 7.0.1.
Sites web
Radio-Canada.ca
- L’état de focus a été uniformisé dans l’ensemble du site.
- Les liens externes sont tous bien indiqués par une icône.
- Les pages régionales offrent une expérience uniformisée avec le reste du site.
- Il est possible de cliquer sur un logo pour retourner à l’accueil d’une sous-section.
- Les onglets et accordéons offrent la même expérience utilisateur dans le site.
- Les boutons de partage, notamment dans les pieds de page, sont optimisés pour les lecteurs d’écran.
- Les tailles de polices ont été revues dans les cartes immersives.
- Les fils en continu sur les pages régionales ont été complètement revus et sont maintenant lus et vus par les lecteurs d’écran.
- Les cartes « Twitter » dans les fils en continu sont complètement accessibles.
- L’ordre de lecture dans le module météo des pages régionales a été amélioré.
- Les titres de type logos affichés dans les conducteurs sont mieux reconnus par les lecteurs d’écran.
- Les récits numériques à chapitres multiples sont accessibles. Il est possible de cliquer sur le titre ou le logo à l’intérieur du menu pour retourner dans le haut de la page des récits numériques.
- Dans la console audio des récits numériques, l’état de focus a été ajouté sur toutes les options du lecteur.
- L’état de focus se déplace sur le chapitre choisi lorsqu’on navigue à l’intérieur du menu des récits numériques.
- Les accordéons dans la page Accessibilité ont été optimisés.
- L’enchaînement de l’ordre de l’état de focus a été amélioré dans la navigation principale.
Info
- La navigation dans le tableau de bord des élections s'effectue désormais à l’aide de la souris, du clavier ou du lecteur d'écran (Alberta, Île-du-Prince-Édouard et Terre-Neuve-et-Labrador depuis le printemps 2019) :
- La lecture des résultats par parti, par circonscription et par candidat été améliorée.
- Les mises à jour se font automatiquement, sans rafraîchissement de la page, permettant une navigation en continu.
- La recherche est adaptée à tous les types de navigation.
ICI Tou.tv (Web)
- Le bouton d'incitation à l’action (CTA) « En savoir plus » est lu par le lecteur d’écran.
- L’état de focus est visible sur l’hyperlien d'incitation à l’action (CTA) « Légal » lorsque ce dernier est présent sur une publicité.
Applications mobiles
Sports et Info (iOS)
- Configuration des thèmes et des régions à l’aide du lecteur d’écran
- Possibilité de suivre un dossier ou un journaliste à l’aide du lecteur d’écran
- Sauvegarde des articles à l’aide du lecteur d’écran
- Amélioration de la lecture des cartes par le lecteur d’écran (notamment concernant l’ordre de lecture des éléments ainsi que les informations lues par le lecteur d’écran)
- Amélioration de la navigation et de l’ordre de lecture des éléments dans les sous-menus
Sports et Info (Android)
- Ajustement des contrastes des titres et sous-titres des messages en fenêtre contextuelle
- Ajout d’un message de confirmation à la fermeture de la session de l’utilisateur
- Possibilité de n’avoir qu’une fonction par écran (ajout, suppression, ordonnancement)
- Configuration des thèmes et des régions à l’aide du lecteur d’écran
- Possibilité de suivre un dossier ou un journaliste à l’aide du lecteur d’écran
- Sauvegarde des articles à l’aide du lecteur d’écran
- Création d’un compte Radio-Canada et connexion à l’aide du lecteur d’écran
- Amélioration de la lecture des cartes par le lecteur d’écran (notamment concernant l’ordre de lecture)
- Amélioration de la navigation et de l’ordre de lecture des éléments dans les sous-menus
ICI Première (iOS)
- Lecture du bouton « Pause » sur la une du bloc en direct et dans les autres contenus sur demande
- Section Réglages :
- Lecture du bouton de téléchargement par VoiceOver sur wi-fi
- Lecture du bouton « Ma région » par VoiceOver
- Correction des éléments des menus pour les signaler comme étant des boutons
- Section Horaire : Correction pour éviter que le VoiceOver lise la région précédente lors d’un changement de région
- Section Ma radio : Les boutons « Effacer » et de téléchargement sont détectés par VoiceOver.
- Section Émissions : Lecture des noms des émissions par VoiceOver
- Correction du défilement dans la page « Choisir une région »
- Contrôleur audio : Le texte dans la fenêtre contextuelle d’information est lu par le lecteur d’écran.
- Bouton « Options » : Accès aux éléments du menu déroulant
- Des corrections ont été apportées au contrôleur audio en mode ouvert :
- Les boutons ont maintenant les bons libellés.
- La possibilité de changer de région est indiquée.
- Des corrections ont été apportées au contrôleur audio en mode petit.
- Le bouton « Démarrer l’écoute » a le bon libellé.
- Un message indique la possibilité de mettre le contrôleur audio en plein écran.
ICI Première (Android)
- Section Ma radio : Le bouton « Télécharger » a le bon libellé.
- Contrôleur audio en mode ouvert : Les minutes ne sont plus lues en heures.
ICI Tou.tv (iOS)
- Amélioration de la navigation des menus déroulants avec le lecteur d’écran sur la page en direct
- Amélioration de la navigation des menus déroulants avec la tabulation sur la page en direct
- Navigation améliorée lors du passage du lecteur d’écran
ICI Tou.tv (Android)
- Amélioration de la navigation des menus déroulants avec le lecteur d’écran sur la page en direct
- Amélioration de la navigation des menus déroulants avec la tabulation sur la page en direct
- L’ordre des éléments sur la page en direct est respecté sur le téléphone Pixel lors du passage du lecteur d’écran.
- L’horaire sur la page en direct est lu par le lecteur d’écran sur le téléphone Pixel.
- La navigation est possible lorsque le contenu est grossi sur la page en direct.
Sites web
Radio-Canada.ca
- Mode adaptatif :
- Zoom possible sur les pages du site (Android seulement)
- Annonce claire de la page courante avec VoiceOver
- Liens dans le pied de page accessibles sur la tablette
- Optimisation de la visibilité de la police d’écriture utilisée sur Radio-Canada.ca
- Amélioration de la navigation dans le module de pagination à l’aide des lecteurs d’écran
- Lecture de l’abréviation (ABBR) par les lecteurs d’écran
- Accessibilité des widgets comme Juxtapose et des tableaux à l’aide d’un lecteur d’écran
- Mise en place d’une nouvelle navigation plus accessible
- Ajout d’un lien d’évitement vers l’aide à la navigation
Info
- Refonte de la page d’accueil avec une lecture plus adaptée aux lecteurs d’écran
- Optimisation de la navigation à l’aide du clavier dans les fils en continu des pages des articles
Sports
- Amélioration de l’accessibilité du carrousel des résultats (mise en place de liens d’évitement, énonciation claire des dates, etc.)
- Refonte de la page d’accueil avec une lecture plus adaptée aux lecteurs d’écran
- État de focus visible sur les cartes ayant des informations affichées sur des images
ICI Première
- Arrêt de la lecture des publicités par les lecteurs d’écran
- Durée des contenus affichés lue en minutes par les lecteurs d’écran
ICI Télé
- Arrêt de la lecture des publicités par les lecteurs d’écran
ICI Tou.tv
- Section Rattrapage : Ajout de textes de remplacement lors du survol des images
- Menu Parcourir : Ajout de textes de remplacement lors du survol des images des chaînes
- Page Mon compte :
- Ajustement de l’ordre de tabulation
- Ajustement de la couleur du texte
- Détails ajoutés au message d’erreur
- Ajustement des contrastes
- Page En direct :
- Fonction de grossissement du texte fonctionnelle
- Ajustement de la disposition du texte
- Ordre de tabulation ajusté
- Amélioration de la navigation des menus déroulants avec le lecteur d’écran
- Texte affiché lors du survol des logos des chaînes sur la page d’accueil
- Ordre des éléments respecté sur le lecteur vidéo lors du passage du lecteur d’écran
- Amélioration de la couleur des champs en état de focus
- Amélioration des états de sélection lors de la création d’un compte
- Amélioration de l’emplacement des zones de saisies actives sur les champs
- Correction de la nomenclature des H1, H2, etc.
Console audio-vidéo
- Efforts en cours pour une refonte du lecteur audio/vidéo
Formations en accessibilité Web
- Lecteur d’écran – Atelier de sensibilisation aux nouveaux employés
Une vingtaine d’employés issus de divers métiers (designers UX-UI, développeurs web, développeurs d’applications mobiles, analystes en contrôle qualité, chefs de projets) ont participé à un atelier de trois heures visant à les initier au fonctionnement d’un lecteur d’écran. Cette formation est donnée régulièrement aux nouveaux employés, et elle a pour but de les sensibiliser à l’effet de leur travail sur les utilisateurs des lecteurs d’écran. - Contenu
Une nouvelle formation sur l’accessibilité web est offerte aux contributeurs éditoriaux. Elle propose des lignes directrices afin de créer des contenus accessibles à tout utilisateur du site de Radio-Canada.ca.
Applications mobiles
Sports et Info (iOS)
- Les applications offrent une nouvelle expérience utilisateur (incluant la navigation par en-têtes)
- Un nouveau module électoral avec résultats en direct fait maintenant partie des applications
- Une nouvelle zone audio-vidéo a été ajoutée
- Le lecteur vidéo affiche les sous-titres (s’il y a lieu)
Sports et Info (Android)
- Les applications offrent une nouvelle expérience utilisateur
- Un nouveau module électoral avec résultats en direct fait maintenant partie des applications
- Une nouvelle zone audio-vidéo a été ajoutée
ICI Première (iOS)
- L’accès au menu principal (le menu « burger ») et à la flèche retour via un lecteur d’écran sont offerts
- Le lecteur donne le bon terme pour le bouton « Jouer »
- Des titres ont été ajoutés sur l’ensemble des boutons
- Le lecteur ne lit plus la barre de défilement après avoir lu les onglets
- Un message indique que le contrôleur audio peut être mis en mode plein écran
- L’état de Focus demeure sur le bouton « Jouer » de la une lorsque ce dernier est activé
- La sélection d’un élément dans la fenêtre « Options » est possible
ICI Tou.tv (iOS)
- L’application offre une nouvelle expérience utilisateur conçue pour être accessible
- Contraste des couleurs en fonction des standards d’accessibilité AA
- Meilleure navigation avec VoiceOver
- Accès rapide au menu à partir de chaque section de l’application
- Navigation des contenus simplifiée par en-têtes et conteneurs
- Le lecteur d’écran peut lire les commandes du lecteur vidéo
ICI Tou.tv (Android)
- L’application offre une nouvelle expérience utilisateur conçue pour être accessible
- Contraste des couleurs en fonction des standards d’accessibilité AA
- Meilleure navigation avec TalkBack
- Accès rapide au menu à partir de chaque section de l’application
- Le lecteur d’écran peut lire les commandes du lecteur vidéo
Sites web
Radio-Canada.ca
- L’information fournie à l’utilisateur lorsqu’il ouvre ou ferme le menu principal en naviguant à l’aide du lecteur d’écran a été améliorée
- Les liens externes menant à de l’information connexe lors de la navigation à l’aide du lecteur d’écran ont été ajustés
- L’état de Focus a été amélioré et uniformisé dans l’ensemble du site pour qu’il soit visible peu importe l’arrière-plan, aussi bien sur fond clair que sur fond foncé
- L’état de Focus a été ajouté sur les écrans d’autopromotion
- L’attribut « lang » dans les liens externes est pris en charge
- La recherche des articles (nouvelles) de type information (termes recherchés dans les titres ou amorces) est fonctionnelle
- La recherche des émissions d’ICI Télé, d’ICI Première et d’ICI Musique (par nom d’émission ou par nom d’animateur) est fonctionnelle
- Le tri des résultats d’une recherche par ordre du plus récent au plus ancien, du plus ancien au plus récent ou par pertinence est possible
Régions
- Les cartes des sites régionaux qui utilisent des liens vers les réseaux sociaux ont été améliorées
Info
- Les liens « Afficher plus » ont été remplacés par de la pagination dans la page « Dossiers »
- Le contenu des balises dans les cartes des pages de sous-thème n’inclut maintenant que le titre de l’article
- Fil en continu : La date du jour figure en haut de la page, et les heures sont ajoutées aux titres des articles et masquées pour les lecteurs d’écran
- Les informations nécessaires et existantes ont été ajoutées au texte de remplacement du titre dans les cartes vidéo
- Un texte de remplacement pour les lecteurs d’écran a été ajouté sous les widgets et les images complexes
- Le module de résultats électoraux a été amélioré
- Le tableau des résultats électoraux a été mis à jour pour respecter la règle des 48 pixels pour un bouton sur mobile et des 36 pixels sur ordinateur
- Le visuel de l’état de Focus est maintenant cohérent avec celui du site Radio-Canada.ca
- Le contraste entre les couleurs des logos des différents partis est suffisant
Sports
- Les titres des articles sont maintenant de niveau H3 sur la une de « Podium »
- Les logos des partenaires sont mis en contexte
- L’état de Focus sur les images lors de la navigation par tabulation a été ajouté
- Les dates sont maintenant de niveau H3 dans la section « Horaire de diffusion »
ICI Première
- Le contraste de l’icône proposant l’ouverture d’une nouvelle fenêtre a été amélioré
- L’élément actif a été identifié pour les lecteurs d’écran
- La lecture de la durée des contenus est en minutes (au lieu d’être en heures)
- Les cartes de contenus ont été améliorées sur tout le site
- Un texte de remplacement pour les réseaux sociaux dans le bloc « Suivez-nous » des pages d’émissions a été ajouté
- L’état de Focus pour les boutons « Haut de page » et « Afficher plus » a été corrigé
- Le nombre de résultats trouvés lors d’une recherche dans la page « Liste des émissions » est annoncé
- Les liens qui s’ouvrent dans une nouvelle fenêtre dans le pied de page sont signalés
ICI Télé
- Les cartes de contenus ont été améliorées sur tout le site
- Les balises HTML dans les titres des liens sont prises en charge
- Le titre du bouton « Regarder » n’est plus lu deux fois
- Les images décoratives de la page « Liste des émissions » ont été retirées pour les lecteurs d’écran
- Le nombre de résultats trouvés lors d’une recherche dans la page « Liste des émissions » est annoncé
- Un titre de niveau H1 a été ajouté dans la page « Liste des émissions »
Tou.tv
- Le site offre une nouvelle expérience utilisateur conçue pour être accessible
- Navigation par tabulation rapide et simple
- Compatibilité avec les lecteurs d’écran
- Contraste des couleurs en fonction des standards d’accessibilité AA
- La vidéodescription a été ajoutée au lecteur vidéo (s’il y a lieu)
ICI Musique
- Les liens en images n’ont pas de texte de remplacement, car ce sont des images décoratives dans le pied de page
- Le lien d’évitement en haut de page pour aller au contenu principal a été mis en français
Console audio-vidéo
- La position des sous-titres superposés à la vidéo est maintenant configurable en fonction du contenu proposé
RAD
- Un menu d’options d’accessibilité a été ajouté
- Intégration du mode 200 %
- Intégration du style haut contraste inversé
- Activation forcée par défaut des sous-titres des vidéos
- Ajout d’un point vert lorsqu’une option du menu est activée
- Le menu se ferme au moyen de la barre d’espacement
- La navigation sur les curseurs se fait par les flèches du clavier
- La navigation sur le menu se fait par les flèches du clavier
- La visibilité de l’état de Focus est minimisée sur les éléments, sauf lors d’une navigation par tabulation
- Les couleurs des dossiers respectent le bon rapport de contraste
- La couleur de l’état de Focus a été modifiée pour en améliorer la visibilité, peu importe l’arrière-plan (utilisation d’un contour blanc et d’un contour noir)
- Le domaine Radio-Canada.ca est exclu du script des liens externes
- Le site est accessible par Internet Explorer 11
- La balise « og:image:alt » a été ajoutée
- Les balises schema org suivantes ont été intégrées :
- Organisation
- NewsArticle
- VideoObject
- BreadcrumbList
Applications mobiles
Sports et Info (iOS)
- Les applications acceptent maintenant la taille de caractères choisie par l’utilisateur dans les options d’accessibilité d’iOS
- La disposition des cartes s’adapte aux différentes tailles de caractères
- Le fonctionnement du mode de voix hors champ « VoiceOver » a été revu, incluant l’ordre des éléments à lire, l’ajout d’astuces pour son activation et le groupement de vignettes de nouvelles
Sports et Info (Android)
- Les sous-menus du menu principal sont maintenant clairement définis pour l’utilisateur
- L’utilisateur est en mesure de savoir sur quel onglet il se trouve
- La lecture d’une carte commence par le surtitre et le titre, et se poursuit avec les détails liés à l’image
- L’ordre de lecture des éléments a été revu pour faciliter la navigation
- La taille des polices s’ajuste dans les articles et dans les listes de nouvelles
- La section « Résultats » comprend des étiquettes formatées qui fournissent le nom de l’équipe ainsi que la ville lors d’une lecture vocale
Sites web
Radio-Canada.ca
- Il y a une synthèse des éléments lus par le lecteur d’écran sur les cartes de nouvelles
- L’utilisateur est informé de l’ouverture et de la fermeture des éléments de la navigation principale
- Les liens d’évitement prennent en considération le menu et le pied de page
- Le lecteur d’écran lit la barre d’outils du haut de la page (« En direct », « Connexion »)
- Les types de contenu et les progressions du tiroir « En direct » sont clairement énoncés
- Les alertes sont annoncées une fois la lecture terminée par le lecteur d’écran
- Le pied de page ne fait plus partie de la navigation principale afin d’améliorer la lecture du menu
- Les changements de pages vers la nouvelle ou l’ancienne version du site sont clairement énoncés
- Les contrôles du volume du lecteur audio sont accessibles – l’utilisateur peut maintenant régler le volume et mettre le lecteur en sourdine à l’aide du clavier
- Les liens externes sont maintenant énoncés
Régions - Bloc Services
- Un module d’extension (plug-in) a été développé afin de permettre à l’utilisateur de basculer aisément d’un onglet à l’autre – il informe l’utilisateur sur quel onglet il se trouve et l’avise au moment du changement
- Du texte caché a été ajouté
- Le focus est maintenant placé sur les bons éléments de contenu
Info
- Fil en continu : La date actuelle est présente en haut de la page (avant le premier article)
- Fil en continu : Les heures sont masquées pour le lecteur d’écran et elles sont ajoutées aux titres des articles
- Fil en continu : Un bouton pour afficher plus de contenu place maintenant le focus sur le titre du premier article de la nouvelle liste d’articles
- Pagination (dossiers, archives, thèmes, etc.) : Le numéro est maintenant placé dans le titre de la page
Sports
- L’intitulé des contenus publicitaires a été amélioré dans la section « Podium »
ICI Première
- Tous les titres des textes sont en H3
- Le lien permettant d’accéder à un article de la section « À la une » est simplifié car le texte d’introduction n’est pas lu par le lecteur d’écran
- Le lien pour changer de région a été modifié
- Dans la section « Questions et commentaires » dans le bas de l’article, l’ouverture d’un nouvelle fenêtre est annoncée
- Un ratio a été ajouté sur le zoom des zones de textes pour Firefox et les anciens fureteurs
- Lecteur audio
- Le bouton de contrôle du volume audio est plus accessible
- La tabulation sur les boutons « Précédent » et « Suivant » n’est pas permise lorsqu’ils sont inactifs
- Le lecteur audio est traité comme une fenêtre modale lors de l’écoute en direct afin que l’utilisateur reste dans cette zone
ICI Télé
- Un ratio a été ajouté sur le zoom des zones de textes pour Firefox et les anciens fureteurs
ICI Tou.tv
- La nouvelle version bêta du site web est actuellement en chantier pour accroître son accessibilité d’ici les prochaines semaines
- L’amélioration de l’accessibilité des applications mobiles est en cours
- La vidéodescription est disponible au sein de la console vidéo sur la version bêta. À l’aide d’un bouton dans la barre de contrôle, l’utilisateur peut activer ou non cette fonction. Par défaut, la vidéodescription est désactivée
- La vidéodescription est active et synchronisée avec le contenu vidéo dès le début de la lecture
Console audio-vidéo
- Des raccourcis claviers ont été ajoutés sur la console audio-vidéo. Le raccourci CTRL + Y permet de voir la liste des raccourcis disponibles
- La section « Information » est maintenant accessible en naviguant avec le clavier
- Les intitulés des boutons ont été renommés plus clairement – par exemple, le bouton « Extraire » a été renommé « Ouvrir » dans une nouvelle fenêtre
- En mode plein écran, la navigation se fait au sein de la console audio-vidéo
- Le lecteur d’écran indique à l’utilisateur s’il entre ou s’il quitte le mode plein écran
- Lorsque l’utilisateur sélectionne un des boutons de partage, le lecteur d’écran l’avertit qu’une nouvelle fenêtre s’ouvrira
- Lorsque l’utilisateur clique sur un des boutons de partage et qu’il quitte la liste sans faire de choix, le focus est ensuite placé sur l’icône de partage et non pas sur la croix pour fermer
- Une fois le partage terminé, le focus est placé sur le bouton « Écouter » pour que la reprise de la lecture se fasse aisément
- Lorsque la vidéo joue, seul le son de la vidéo peut être entendu
- L’utilisateur est informé lorsque les éléments visibles ne sont pas actifs – par exemple, lorsque le bouton « Résolution » de la vidéo affiche la résolution courante, mais qu’il est inactif parce que la résolution est fixe
- Un plus grand nombre d’éléments sont accessibles par la navigation, par tabulation et par flèches
Outil de gestion de contenu
- Les édimestres peuvent mettre un style dans un encadré ainsi que d’utiliser les balises H5 et H6 en plus des autres balises de titres et sous-titres dans notre outil Scoop ! (v4)
- Les images informatives complexes peuvent être enrichies dans notre outil Scoop ! (v4) grâce à l’ajout d’information en format textuel compatible avec les lecteurs d’écrans
- Il est aussi possible de renseigner les mots dans des langues étrangères en utilisant l’attribut « lang » dans les balises
<span>
- Avant la publication de nouvelles fonctionnalités sur le site web, l’outil Pa11y détectera dans la majorité des cas, les codes de programmation qui sont non conformes à nos normes d’accessibilité
Applications mobiles
Info (iOS)
- Amélioration du mode de voix hors champ « VoiceOver » pour les conducteurs de nouvelles
- Ajout de descriptions vocales pour les boutons de l’application
- Contrôles du lecteur vidéo tous fonctionnels
- Ajout des descriptions visuelles des photos et des vidéos autant dans les conducteurs de nouvelles que dans les articles
ICI Musique (iOS)
- Identification adéquate des éléments d’interface
- Amélioration de la navigation
- Aide pour les contenus et les boutons d’interaction
ICI Radio‑Canada Première (Android)
Mise en valeur des émissions diffusées en direct sur ICI Radio‑Canada Première. Nous avons également apporté d’autres modifications, notamment à l’accessibilité du contenu lors de la navigation.
- Démarrage de l’écoute du direct
- Contrôle de l’audio (marche, arrêt, suivant, précédent, etc.)
- Navigation dans les sections de l’application
- Amélioration de l’exploration du contenu
Sites web
Radio‑Canada.ca
Plusieurs améliorations dans les fils en continu :
- Navigation entre les éléments
- Bouton « afficher plus »
- Nouveaux contenus offerts
Le nouveau Radio‑Canada.ca
Grâce à notre nouveau site, nous testons des fonctionnalités pour évaluer la suite de leur développement. Les visites sur cette nouvelle page d’accueil et tous vos commentaires permettront d’optimiser l’expérience utilisateur sur le site de Radio‑Canada.
- Navigation principale accessible sans souris et lien d’évitement à la fin du menu qui retourne au début de celui-ci
- Possibilité de fermer les sous-menus avec le raccourci-clavier « Échapper »
- Amélioration de la navigation sans souris, en n’ayant qu’un seul lien par nouvelle
- Révision des couleurs de marque pour avoir un meilleur contraste
- Optimisation du formulaire de commentaire pour la version bêta pour une utilisation avec les lecteurs d’écran et la navigation sans souris
- Augmentation de l’espace cliquable des liens
- Ajout d’une icône dans les liens textuels sortants permettant d’illustrer le fait qu’il s’agit d’un lien externe
- Navigation par tabulation fonctionnelle et uniforme à travers le site; les éléments sélectionnés ont un aspect différent des autres
- Nom de l’article et mention « écouter la vidéo » affichés dans le titre lorsqu’on clique sur une carte vidéo; en cliquant sur le lien, on peut lire l’article, et la vidéo se lance automatiquement
- Suppression des doublons d’identification pour les publicités
- Possibilité de navigation par tabulation dans les portails thématiques
Console audio-vidéo
- Accentuation de l’état survolé (hover) et de l’état cliqué (focus) sur tous les boutons
- Navigation par clavier fonctionnelle pour le positionnement, le volume et le changement de résolution; le lecteur indique la position courante sur la barre de recherche, et la valeur du volume et de la résolution choisis
- Mise à niveau globale du design de la console pour une meilleure accessibilité
Radio‑Canada.ca
- Plus de 55 applications widgets en cours d’analyse en accessibilité afin de faire des recommandations d’utilisation
- Lorsqu’un formulaire est soumis et qu’il y a des champs non remplis, l’ancrage de la page se déplace vers le premier champ non rempli
Info (site)
- Correction de la mention entre parenthèses (écouter la vidéo)
- Ajout d’une indication lorsqu’une page s’ouvre dans un nouvel onglet
Info (application iOS)
Amélioration de la lecture du contenu d’une nouvelle à l’aide de la voix hors champ « VoiceOver »
ICI Radio‑Canada Première (site web)
- Nous sommes en train de renouveler notre technologie émission par émission dans le site d’ICI Radio-Canada Première. Ceci occasionne des changements dans les pages contenant les balados; celles-ci ne seront plus entièrement à jour jusqu’à ce que la nouvelle technologie soit complètement implantée.
- Entre-temps, voici les indications pour accéder à un balado à partir d’une émission :
- Point de départ : https://ici.radio-canada.ca/premiere/emissions#Toutes
- Faire simultanément « Inser+F7 »
- Rechercher le nom de l’émission
- Appuyer sur « Entée »
- Faire simultanément « Inser+F7 »
- Rechercher le lien « Écouter et accéder au téléchargement en MP3 » (nouvelle fiche émission) ou « Écouter le MP3 » (ancienne fiche émission)
- Appuyer sur « Tab »
- Choisir « Se déplacer au lien »
- Ouvrir le menu contextuel (MAJ+F10 sur clavier PC) et choisir :
Avec Internet Explorer : « Enregistrer la cible sous »;
Avec Chrome : « Enregistrer le lien sous »;
Avec Firefox : « Enregistrer la cible du lien sous ».
ICI Radio‑Canada Première (Android)
Amélioration de l’accessibilité de l’écoute en direct
Tou.tv (site web)
- Vérification et correction de la logique de tabulation
- Ajout des attributs Title et Aria-label sur tous les boutons « Écouter la vidéo » dans les émissions
- Changement des balises de liens afin d’améliorer la navigation par tabulation et la recherche de liens dans les pages
- Ajout de la langue du site dans le HTML
- Ajout d’une étiquette et d’un Aria-live dans « Recherche »
- Correction de la hiérarchie des titres (H1)
- Possibilité de se rendre à « Ma Liste » au moyen de la touche de tabulation
- Bouton « Connexion » lu par le lecteur d’écran
- Vignettes d’émissions améliorées (vignettes traitées comme un bouton, dates, hiérarchie des titres, titres explicites et traités comme des liens, répétition de termes éliminée)
- Libellé corrigé pour « Catégorie de classement des films au Québec »
- Harmonisation de l’état de Focus et du survol de souris
- Présentation des renseignements sur les émissions sous forme de listes
- Ajout d’étiquettes sur la publicité dans la page émisode
- Vérification et correction du choix d’un lien versus un bouton
ICI Tou.tv (iOS et Android)
- Amélioration de la navigation avec l’application iOS, des différents conducteurs ainsi que des sections de l’application, dans lesquelles on peut maintenant naviguer à l’aide des services d’accessibilité
- Lecteur vidéo de l’application désormais accessible (iOS seulement)
- Ajout de l’état de Focus sur le premier élément après le démarrage de l’application
- Ajout des descriptions pour les boutons « Favoris », « Info », « Menu », « Navigation arrière », « Partager », « Réglages » et « Fermer »
- Accessibilité à la page d’authentification, à la page de réglages et à la liste des vidéos
Console audio-vidéo
- Mise en ligne d’une nouvelle version de la console audio-vidéo (l’interface sur ordinateur passera de Flash à HTML5, ce qui permettra à terme de se libérer complètement de Flash)
- Navigation par clavier fonctionnelle pour les boutons « Info » et « Partage »
- Affichage des contrôles du bas de la console lors d’un changement de l’état de Focus
- Ajout de la description des boutons
- Lecture du titre de la vidéo désormais possible
- Démarrage de la vidéo au moyen de la touche « Entrée »
- Suspension de la vidéo quand les fenêtres Partage ou Info sont ouvertes
- Affichage de la description des boutons « Écouter la vidéo » et « Pause » au survol de la souris
- Mettre en place le bouton d’arrêt du rafraîchissement de la page d’accueil accessible par la navigation au clavier
- Afficher un message lorsque JavaScript est désactivé
- Ajouter un message d’avertissement pour les jeux en Flash
- Implanter graduellement le Fil d’Ariane
- Spécifier la langue et la direction du texte par défaut
- Permettre le zoom du site sur mobile (en cours)
- Offrir sur les carrousels un contrôle de pause et de reprise
- Nouveau document pour les articles, permettant de :
- Redimensionner la page
- Fournir un titre précis sur chaque page
- Signaler l’ouverture des nouvelles fenêtres
- Baliser les listes à puces en utilisant <ul> et <li>
- Baliser des listes numérotées en utilisant <ol> et <li>
- Baliser les blocs de citation en utilisant <blockquote>
- Garantir la lisibilité des contenus même lorsque la taille du texte est doublée
- Utiliser uniquement des tailles relatives pour les polices de caractères
- Garantir la lisibilité des contenus lorsque les images ne sont pas affichées
- Le contenu vidéo préalablement diffusé à la télévision et accessible par la suite sur le web comprend des sous-titres
- L’élément courant des menus se distingue des autres éléments des menus
- Les polices de caractères utilisées sont des Google Fonts ou des polices web sur l’ensemble du site
- L’interlignage des textes respecte les standards d’accessibilité AA
- Les textes sont généralement alignés à gauche; les courts textes sont parfois centrés
- Les contrastes respectent les standards d’accessibilité AA sur la majorité des pages
- Les liens ont tous des intitulés clairs
- Une police de caractères a été spécialement créée pour l’usage des icônes
- L’usage de textes sur les visuels photo n’est plus permis sans que le texte de remplacement (alt. text) créé soit clairement écrit au préalable
- Un titre précède toute illustration de données
- Un titre précède tout formulaire
- Les intitulés des formulaires sont clairs et situés à proximité du champ auquel ils renvoient
- Les champs des formulaires proposent la valeur requise
Afin de mieux naviguer sur Radio‑Canada.ca, voici quelques informations :
- Banque d’icônes de Radio‑Canada https://ici.radio-canada.ca/tele/signaletique
- La page où sont consignées nos normes d’accessibilité : https://cbcradiocanada.atlassian.net/wiki/spaces/RCR/overview (Nouvelle fenêtre)
- Nous nous efforçons de fournir les meilleurs services en accessibilité. Il est, par contre, de la responsabilité des utilisateurs de bien comprendre le fonctionnement de leurs appareils informatiques, de leurs navigateurs et de leurs logiciels. Les compagnies qui offrent ces produits et services fournissent également les explications quant à leur utilisation.
Pour tout commentaire ou suggestion, ou si vous souhaitez faire partie de notre groupe témoin pour tester l’accessibilité de nos produits, merci de nous écrire à accessibilite@Radio-Canada.ca.