Rise 360 : Notre parcours d'accessibilité

Dernière mise à jour de l’article le

Cet article s'applique à :

Nous voulons que tous les apprenants interagissent aussi pleinement que possible avec les cours que vous créez dans Rise 360. Nous savons que c'est important pour vous également. C'est pourquoi l'accessibilité est un élément essentiel de notre feuille de route. Ci-dessous, nous avons dressé un journal du travail que nous avons accompli jusqu'ici. Et nous garderons cela à jour pendant que nous poursuivrons notre parcours d'accessibilité.

Opinions contrastées

31 mars 2022

Il existe une règle très claire en ce qui concerne l'accessibilité et les éléments non textuels dans une interface : ils doivent avoir un rapport de contraste d'au moins 3:1 entre l'élément et l'arrière-plan. Il existe maintenant des vérificateurs de contraste et des utilitaires que nous utilisons pour garantir que l'interface Rise 360 répond à ce ratio. Mais lorsque les utilisateurs utilisent quelque chose qui modifie fondamentalement le contraste de la ligne de base, comme le mode de contraste élevé de Windows, il devient plus difficile de maintenir ce rapport d'or.

Plus dur. Mais ce n'est pas impossible.

Dans cette mise à jour, nous avons poursuivi le travail commencé plus tôt ce mois-ci, garantissant que les éléments de l'interface sont facilement visibles, même si vous utilisez un paramètre système à contraste élevé.

En mode Contraste élevé de Windows, nous avons ajusté les éléments suivants afin qu'ils ne soient pas lavés en mode contraste clair ou sombre.

  • Leçon sélectionnée dans la barre latérale
  • Menu de hamburgers du cours (ces trois petites lignes dans le coin supérieur gauche)
  • Dans les blocs de guillemets et de galerie, les flèches suivante et précédente

Pour les éléments d'interface suivants, nous avons augmenté ou, dans certains cas, éliminé le contraste de survol :

  • Aperçu du cours
    • Bouton Démarrer/Reprendre le module
    • Bouton Détails
  • Barre latérale
    • Icônes Search/Close Search
  • Hyperliens
  • Dans les blocs Scénario, le bouton Continuer
  • Dans les blocs de guillemets et de carrousel de galerie, les icônes de sélection de diapositive et les flèches précédente et suivante

Nous avons également supprimé une info-bulle inutile qui apparaissait lorsque vous survolez l'icône de progression de la leçon.

Et ce n'est que le début. Nous nous engageons à faire en sorte que tout le monde puisse facilement utiliser Rise 360, quelle que soit la façon dont ils nous rencontrent. Nous reviendrons bientôt avec encore plus d'améliorations !

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : contraste non textuel 1.4.11 (niveau AA), Headings and Labels 2.4.6 (niveau AA), Focus Visible 2.4.7 (niveau AA)

Réglage fin

4 mars 2022

Il y a un moment où vous travaillez sur quelque chose, n'importe quoi, où vous avez quelques grandes parties au carré mais que vous n'avez pas encore commencé la prochaine série de grands changements. Vous voulez aller de l'avant, mais il y a des petits morceaux que vous devez obtenir juste avant de le faire.

Nous sommes occupés depuis le mois dernier à affiner l'accessibilité dans Rise 360, à trouver les petites choses juste et les détails les plus fins avant de passer à la prochaine grande chose.

  • Mode de contraste élevé de Windows :
    • Lorsque vous avez sélectionné un bouton radio (comme lorsque vous cliquez sur une réponse à choix multiples dans un quiz) en mode blanc ou noir à contraste élevé, il n'apparaît pas sélectionné. Nous avons amélioré la visibilité de la sélection des bouton radio dans ces modes.
    • En mode blanc à contraste élevé, le bouton de recherche n'était pas visible.
  • Sur les appareils Android utilisant Talkback :
    • Certains blocs ont été annoncés deux fois lorsque les utilisateurs naviguaient dans les leçons.
    • Des graphismes décoratifs, qui ne devraient pas être annoncés, étaient annoncés.
  • Nous avons ajouté une étiquette « close modal » à la fenêtre contextuelle des informations graphiques étiquetées.
  • Nous avons également amélioré l'expérience des blocs graphiques dans les navigateurs Microsoft Edge. Désormais, les lecteurs d'écran annoncent les en-têtes du graphique comme prévu.

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Contenu non textuel 1.1.1 (niveau A), contraste non textuel 1.4.11 (niveau AA), en-têtes et étiquettes 2.4.6 (niveau AA), Focus Visible 2.4.7 (niveau AA)

Lecteur d'écran, améliorations du contraste et plus encore

14 janvier 2022

Les changements de cette semaine visent à améliorer l'expérience utilisateur et à faciliter l'accès à ses cours pour tous, mais ils interagissent avec Rise 360. Voici ce que nous avons fait au cours de ces deux premières semaines de la nouvelle année.

  • Pour les lecteurs d'écran, nous avons modifié le bloc d'onglets afin que les boutons précédent et suivant cachés ne soient plus annoncés et éliminent les repères redondants.
  • Pour les exigences de contraste, la piste de progression audio est désormais noire, elle est donc toujours clairement visible et nous avons assombri l'étiquette de recherche de la barre latérale afin qu'elle réponde aux exigences.
  • Nous avons également amélioré les interactions des tables afin que vous puissiez accéder à toutes les colonnes d'une table, même lorsque votre écran est à 400 % de zoom.

Les améliorations que nous avons apportées dans cette mise à jour respectent les critères WCAG : Info and Relationships 1.3.1 (niveau A), 1.4.10 (niveau AA), contraste non textuel 1.4.11 (niveau AA), Ordre de mise au point 2.4.3 (niveau A), localisation de refusion et amélioration de la mise au point

Améliorations de la localisation et du focus

14 décembre 2021

Et nous sommes de retour ! Cela fait près d'un an depuis notre dernière mise à jour, mais cela ne signifie pas que nous n'avons pas travaillé sur l'accessibilité. En fait, nos développeurs ont travaillé en coulisses pour mettre l'accent sur l'accessibilité à toutes nos nouvelles fonctionnalités et à venir.

Dans ce sens, nous avons une nouvelle amélioration et trois nouveaux correctifs qui nous aident à nous rapprocher un peu de notre objectif d'une expérience Rise 360 inclusive.

  • Vous pouvez désormais localiser le lecteur vidéo dans l'une des 16 langues suivantes. Cela est basé sur la langue que vous choisissez pour vos étiquettes de texte.
  • Sur les appareils mobiles sur lesquels VoiceOver est activé, le focus se poserait sur un élément masqué après avoir soumis une réponse au quiz. Maintenant, lorsque vous soumettez une réponse, concentrez-vous sur les retour comme prévu.
  • Lorsque vous appuyez sur le bouton Suivant, la couleur de surlignage n'était pas conforme à WCAG. Nous avons modifié le comportement pour qu'il soit cohérent avec le bouton Précédent, qui ne change pas de couleur lorsque l'onglet est défini sur.
  • Nous avons amélioré la réactivité des questionnaires et des contrôles de connaissances sur les appareils mobiles afin qu'ils soient plus faciles à lire.

Et on est juste en train de se réchauffer. Regardez cet espace pour plus de détails sur nos plans d'accessibilité pour 2022.

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : contraste (minimum) 1.4.3 (niveau AA), ordre de mise au point 2.4.3 (niveau A), langue de la page 3.1.1 (niveau A)

Section 508 et accessibilité améliorée pour les blocs graphiques étiquetés

28 janvier 2021

Article 508

Lorsque les agences américaines présentent des informations et offrent des services, ce qu'elles produisent doit être accessible aux personnes handicapées. Pour s'assurer qu'ils sont en conformité, ces agences (et les personnes qui produisent du contenu pour eux) respectent les normes révisées de l'article 508.

Pour faciliter la tâche de ceux qui travaillent avec le gouvernement américain, nous avons ajouté les critères de la section 508 à notre rapport sur l'accessibilité Rise 360.

Blocs graphiques étiquetés

Les blocs graphiques étiquetés sont un excellent moyen d'apporter une touche visuelle à vos cours et de permettre aux apprenants d'explorer à leur propre rythme. Toutefois, en particulier s'ils sont associés à un fond blanc, les marqueurs graphiques étiquetés par défaut doivent être plus contrastés pour respecter les directives d'accessibilité.

C'est pourquoi les auteurs ont désormais la possibilité de modifier leurs marqueurs à l'aide d'un sélecteur de couleurs pratique. Le sélecteur de couleurs vous permet de modifier rapidement la couleur de tous vos marqueurs en saisissant le code hexadécimal, en utilisant la couleur de la marque ou en sélectionnant une couleur personnalisée de votre choix.

Les autres améliorations apportées au bloc graphique étiqueté sont les suivantes :

  • Les marqueurs sont désormais lus sous forme de liste ordonnée par les lecteurs d'écran.
  • Les lecteurs d'écran annoncent les icônes des marqueurs dans le marqueur.
  • L'état du marqueur (qu'il ait été visualisé ou non) est également annoncé par les lecteurs d'écran.
  • Lorsque vous ouvrez un marqueur, vous allez maintenant accéder d'abord au contenu au lieu des contrôles pour une expérience plus conviviale.
  • La fermeture d'une étiquette de marqueur à l'aide de la touche ESC ramène le focus sur le marqueur.
  • Lorsque vous vous éloignez d'une étiquette de marqueur ouverte, elle se ferme automatiquement.
  • Avec ces mises à niveau en place, nous pouvons maintenant dire que les blocs graphiques étiquetés sont accessibles à 100 % !

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Contenu non textuel 1.1.1 (niveau A), Info et relations 1.3.1 (niveau A), étiquettes descriptives 2.4.6.b (niveau AA), nom, rôle, valeur 4.1.2.a (niveau A)

Support pour lecteur d'écran et notre VPAT ® !

2 décembre 2020

Au cours des dernières semaines, nous avons amélioré les réponses des lecteurs d'écran aux quiz et aux vérifications des connaissances. Pour les questions à choix multiples et à réponses multiples, il est évident lorsque les apprenants entrent des éléments de liste. De plus, la navigation au clavier indique clairement quand un choix est mis au point. Les réponses, les avis et les révélations sont désormais accessibles aux lecteurs d'écran, et les annonces de retour sont plus intuitives. La page des résultats du quiz suit un ordre logique avec moins de distractions, ce qui permet aux apprenants de mieux comprendre leurs résultats.

Avec ces dernières mises à jour, nous prenons désormais officiellement support technique les lecteurs d'écran NVDA, JAWS, VoiceOver et TalkBack avec les cours Rise 360. Notre objectif est de garantir que les apprenants qui comptent sur des lecteurs d'écran bénéficient d'une expérience d'apprentissage aussi satisfaisante et riche que tout le monde lorsqu'ils explorent les cours Rise 360.

Aujourd'hui, nous avons également publié un modèle Voluntary Product Accessibility Template ® (VPAT®) qui décrit la conformité aux critères WCAG de niveau A et de niveau AA pour Rise 360.

Avec notre VPAT ® en place, nous sommes convaincus que Rise 360 offre désormais une expérience d'apprentissage accessible. Bien module, le respect des critères n'est que la première étape. Notre travail d'accessibilité est en cours. Au cours des prochains mois, nous allons approfondir nos efforts pour apporter encore plus d'améliorations et aborder les exceptions que nous avons répertoriées dans notre VPAT ®. Nous voulons nous assurer que tout le monde dispose de la meilleure expérience Rise 360 possible, quoi qu'il en soit.

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Info and Relationships 1.3.1 (niveau A), Séquence significative 1.3.2 (niveau A), Clavier 2.1.1 (niveau A), Ordre de mise au point 2.4.3 (niveau A), Focus Visible 2.4.7 (niveau AA), Nom, Rôle, Valeur 4.1.2 (niveau A)

S'assurer que le texte alternatif est disponible là où c'est nécessaire

15 septembre 2020

Le texte alternatif (texte alternatif) est un élément clé de l'accessibilité. Avec la multitude de blocs basés sur des images dans Rise 360, nous avons veillé à ce que vous puissiez ajouter du texte alternatif à vos images et que les lecteurs d'écran annoncent ce texte avec élégance.

Tout d'abord, nous avons parcouru nos blocs d'images et vérifié que le texte alternatif n'est lu qu'une seule fois par les lecteurs d'écran. Cela inclut :

  • Centré sur l'image
  • Image Plain-pied largeur
  • Image et texte
  • Texte sur l'image
  • Carrousel d'image
  • Grilles d'images (2, 3 et 4 colonnes)
  • Accordéon
  • Onglets
  • marqueur graphiques étiquetés (pas l'image d'arrière-plan)
  • Processus
  • Chronologie
  • Vérifications des connaissances
  • Quiz

S'il y a des images dans ces blocs qui ne contiennent pas de texte alternatif, les lecteurs d'écran ignorent la balise et les annoncent simplement en tant qu'images ou lisent le nom de fichier.

Pour terminer les choses, nous avons abordé les images clic-à-zoom. Les lecteurs d'écran annoncent désormais un bouton de zoom pour les images. L'interface ne sera pas différente pour les utilisateurs voyants, mais garantit que ceux qui utilisent des lecteurs d'écran bénéficient d'une expérience comparable. Lorsque les utilisateurs effectuent un zoom avant sur une image, les lecteurs d'écran annoncent le texte alternatif qui lui est associé pour le contexte.

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Info and Relationships 1.3.1 (niveau A), Séquence significative 1.3.2 (niveau A), Analyse 4.1.1 (niveau A), Nom, Rôle, Valeur 4.1.2 (niveau A)

Amélioration du contraste des couleurs

14 août 2020

La plupart des gens ne réfléchissent pas au contraste des couleurs et à la façon dont il affecte le design. Mais cela a un effet marqué sur la façon dont vous et vos apprenants abordez Rise 360.

Si le contraste entre les éléments est trop prononcé, comme les cases à cocher noires sur fond blanc, cela peut rendre les choses un peu basiques. Inversement, si le contraste est trop subtil, comme les boîtes gris clair sur fond blanc, il devient plus difficile pour les apprenants malvoyants de profiter pleinement de l'impact de votre contenu.

C'est pourquoi nous avons examiné de près le contraste des couleurs et l'opacité des éléments suivants et effectué des ajustements. Ils sont plus accessibles, tout en veillant à ce que vos apprenants apprécient le design haut de gamme qu'ils attendent de Rise 360. Voici ce que nous avons fait pour améliorer le contraste dans Rise 360 :

  • La couleur de l'icône X a été assombrie dans la barre de recherche
  • Augmentation de l'opacité par défaut du texte sur les blocs d'image pour améliorer la lisibilité
  • Amélioration du contraste entre les compteurs de pas non sélectionnés dans les blocs de processus
  • Assurez-vous que le texte « Cliquer pour retourner » sur les blocs de carte mémoire n'apparaît pas plus léger que ce que vous choisissez dans les paramètres des blocs
  • Les couleurs de plusieurs éléments de vérification des connaissances ont été assombries, notamment les boutons radio, les cases à cocher, les bordures de champs de texte et les bordures glisser-déposer
  • Couleur de bordure assombrie pour les éléments interactifs des activités de tri
  • Augmentation de l'opacité sur les points non sélectionnés et assombrit les flèches de progression pour les carrousels de citations
  • Remplacer les icônes de téléchargement du bloc de pièces jointes par des alternatives plus accessibles

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Contraste (Minimum) 1.4.3, Contraste non contextuel 1.4.11 (niveau AA))

Amélioration de l'accessibilité du volet

28 mai 2020

La barre latérale est bien plus qu'un simple menu. Il affiche une liste de leçons et de sections et fonctionne également comme zone de résultats lorsque vous utilisez la barre de recherche. Nous voulions rendre encore plus facile l'accès aux informations de la barre latérale lorsque vous utilisez uniquement le clavier ou un lecteur d'écran.

Navigation au clavier

Lorsque vous utilisez le bouton Tab pour naviguer, vous devez uniquement pouvoir interagir avec les éléments affichés à l'écran. Nous nous sommes assurés que vous ne pouviez pas appuyer sur Tab pour accéder aux leçons cachées sous les en-têtes de section réduits dans la barre latérale.

De plus, lorsque la barre latérale elle-même est complètement masquée par l'conception du module, nous avons constaté que vous pouviez toujours accéder au champ de recherche. Non seulement cela n'est pas conforme à l'accessibilité, mais il peut également contourner l'intention de l'conception. Nous avons modifié cela et vous ne pouvez plus accéder au champ de recherche si la barre latérale est masquée.

En parlant de navigation restreinte dans les module, si l'apprenant doit répondre à un quiz pour continuer dans un module, il existe plusieurs indices visuels, dont une info-bulle contextuelle. Ces infobulles s'affichent désormais lorsqu'un utilisateur effectue des onglets sur une leçon à laquelle il n'a pas encore accès.

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Contenu sur le survol 1.4.13 (niveau AA), clavier 2.1.1 (niveau A), ordre de mise au point 2.4.3 (niveau A), nom, rôle, valeur 4.1.2 (niveau A)

Support pour les lecteurs d'écran

Puisque la barre latérale fait tellement de choses, nous voulions nous assurer que les lecteurs d'écran annoncent correctement chaque section. Nous avons étiqueté chaque partie de la barre latérale avec sa vraie fonction, plutôt que de faire annoncer l'ensemble de l'élément comme un « menu ».

Champ de recherche

La recherche à partir de la barre latérale a nécessité des ajustements supplémentaires pour améliorer le fonctionnement des lecteurs d'écran. C'était délicat. Après tout, nous prenons une section de l'interface que vous utilisez habituellement pour naviguer et la transformer en quelque chose de complètement différent : un champ de recherche et une liste de résultats. Désormais, les lecteurs d'écran annoncent si la barre latérale affiche les résultats de la recherche ou le plan du module.

Nous avons également retravaillé les icônes. Le X qui ferme le champ de recherche a été annoncé simplement comme « X », ce qui nous a donné plus de contexte. Maintenant, les lecteurs d'écran annoncent ce bouton comme « Fermer le formulaire de recherche ». Bien plus descriptif ! Nous avons également caché l'icône de la loupe aux lecteurs d'écran car elle est purement décorative.

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Contenu non textuel 1.1.1 (niveau A), Identifier le but 1.3.6 (niveau AAA)

indicateur de progrès

Lorsque vous parcourez une leçon dans Rise, une chose qui se passe en périphérie est que le « gâteau de progression » se remplit dans la barre latérale lorsque vous arrivez à la fin. Pour les cours de quiz, vous pouvez jeter un coup d'œil sur la barre latérale et voir si vous avez réussi ou échoué en fonction de leurs icônes. Ce sont de bons rappels visuels lorsque vous revenez à un module sur la distance que vous vous trouvez et comment vous allez.

Les lecteurs d'écran annoncent désormais le titre de la leçon ainsi que la progression enregistrée en pourcentage. S'il s'agit d'une leçon de quiz, le lecteur d'écran annonce si vous avez réussi ou échoué ce quiz auparavant.

Et pour support technique notre effort d'étiquetage de la barre latérale, toutes ces leçons sont désormais répertoriées sous forme de boutons avec les états pressés et non pressés nécessaires.

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Contenu non textuel 1.1.1 (niveau A), Identifier le but 1.3.6 (niveau AAA)

Contrôle de la barre latérale

Les apprenants peuvent réduire et développer la barre latérale à l'aide de l'icône de menu (☰) située dans le coin supérieur gauche du contenu de la leçon. Et maintenant, les lecteurs d'écran annoncent la fonction de l'icône pour que les apprenants malvoyants sachent ce qu'elle fait : « Ouvrir/fermer la barre latérale de la leçon ».

Les améliorations que nous avons apportées dans cette mise à jour suivent les critères WCAG : Identifier le but 1.3.6 (niveau AAA), Nom, Rôle, Valeur 4.1.2 (niveau A)