En savoir plus sur l'accessibilité

Quels outils sont couramment utilisés pour aider les personnes handicapées à utiliser le Web ?

Choisissez autant de réponses que vous jugez nécessaires.

Périphériques de sortie braille

Lecteurs d'écran

Stations de recharge

Paramètres du système d'exploitation

Quelle est la manière la plus efficace d'apporter des changements sur le Web ?

Choisissez autant de réponses que vous jugez nécessaires.

Vous vous êtes plaint sur les réseaux sociaux.

Engager une action en justice

Contacter directement les développeurs d'une entreprise

Quel est le niveau le plus élevé des normes WCAG ?

Niveau AAA

Niveau A

POUR

Quels sont les exemples de contenu utilisable ?

Choisissez autant de réponses que vous jugez nécessaires.

Toutes les vidéos disposent de commandes.

Les utilisateurs ont suffisamment de temps pour remplir un formulaire.

Tous les éléments actifs sont compatibles avec le clavier et l'écran tactile.

Le langage utilisé est simple.

Quelle est la bonne pratique à suivre pour créer un bouton accessible ?

<div id="saveChanges" aria-role="button" aria-pressed="false" tabindex="0">Go to shop</div>

<a id="saveChanges" aria-label="Some awesome article title">Go to shop</a>

<button id="saveChanges" type="button">Go to shop</button>

Votre site est un manuel en ligne multilingue, où plusieurs langues sont affichées sur une même page. Quelle est la meilleure façon d'indiquer la langue du texte à la technologie d'assistance ?

Définissez une lang principale pour l'élément <html>, et des langues supplémentaires pour les éléments contenant du contenu dans une autre langue.

Ne vous inquiétez pas, la technologie d'assistance peut lire automatiquement chaque langue.

Incluez toutes les langues dans l'élément <html>. Par exemple, <html lang="en,lt,pl,pt">

Quel exemple de style CSS `:focus` est le plus accessible sur un arrière-plan blanc ?

outline: 0.5rem solid yellow;

background-color:black;

outline: none; text-decoration:none; background:none;

text-decoration: dotted underline 2px blue;

À quoi sert un lien de navigation rapide ?

Aidez les utilisateurs de clavier à ignorer les groupes de liens redondants ou inutiles.

Aidez les utilisateurs de clavier à ignorer les contenus qui ne les intéressent pas.

Quelle est la meilleure façon de modifier le style d'un élément avec JavaScript ?

Utilisez JavaScript pour activer ou désactiver la classe d'un élément, et ajoutez le style à votre feuille de style CSS.

Utilisez JavaScript pour appliquer un style dynamique directement dans un élément HTML.

Toutes les actions JavaScript sont-elles compatibles avec les utilisateurs de clavier ?

Oui, toutes les actions sont automatiquement compatibles avec les utilisateurs de clavier.

Oui, mais vous devrez peut-être effectuer des tâches supplémentaires.

Non, vous ne pouvez aider les utilisateurs de clavier qu'avec le HTML sémantique.

Comment rendre les images complexes accessibles ?

Choisissez autant de réponses que vous jugez nécessaires.

Incluez une explication plus loin dans l'article.

Ajoutez un texte alternatif long avec une description complète.

Ajoutez l'attribut aria-describedby à l'image.

Utilisez un lien pour fournir des explications plus longues.

La couleur seule ne suffit pas à identifier un document. Quels autres éléments aident les lecteurs à identifier les éléments de l'UI ?

Modèle

Texte

Icône

Toutes les réponses sont correctes

Que pouvons-nous créer qui reflète les paramètres du système d'exploitation pour le mouvement ?

@prefers-reduced-motion

Boutons bascule JavaScript

Pour que le texte soit lisible, je dois toujours utiliser un contraste élevé entre le texte et l'arrière-plan.

Faux

Vrai

Quelles sont les polices les plus adaptées à l'accessibilité ?

Typographies accessibles.

Polices système telles qu'Arial et Verdana.

Ce n'est pas bien grave.

Parmi les propositions suivantes, quelle est l'entrée de formulaire la plus accessible ?

<label>Email address (required): <input type="email" required aria-describedby="email-validation"> <span id="email-validation" class="validation-message">Please provide a valid email address using the format name@place.com</span></label>

Email address: <input type="email" required>

<label>Email address: <input type="email" required></label>

<label>Email address: <input type="email" required autocomplete="email"></label>

Les composants accessibles le restent-ils toujours pour les utilisateurs ?

Non, vous devez d'abord tester vos composants.

Oui, vous pouvez utiliser ces composants sans travail supplémentaire.

Quels types de tests devez-vous effectuer pour vous assurer que votre site est accessible ?

Choisissez autant de réponses que vous jugez nécessaires.

Tests automatiques

Tests manuels

Tests utilisateur

Tests de technologies d'assistance

Tests d'évaluation.

Quelles erreurs sont détectées lors des tests automatisés ?

Choisissez autant de réponses que vous jugez nécessaires.

Langage inclusif

Texte alternatif manquant

Problèmes de contraste des couleurs

Libellés descriptifs pour les formulaires

Erreurs ARIA

Quels éléments doivent respecter les normes WCAG de contraste des couleurs ?

Icônes

Titres

Corps du texte

Toutes les réponses ci-dessus

Quel est le meilleur lecteur d'écran à utiliser pour tester l'accessibilité ?

Il n'y en a pas

JAWS

VoiceOver

Orca

Quel est l'objectif des tests avec des technologies d'assistance ?

Pour tester les failles de votre site Web ou de votre application.

Pour vivre la même expérience que les personnes qui utilisent une technologie d'assistance.

Quels outils sont couramment utilisés pour aider les personnes handicapées à utiliser le Web ?

Quelle est la manière la plus efficace d'apporter des changements sur le Web ?

Quel est le niveau le plus élevé des normes WCAG ?

Quels sont les exemples de contenu utilisable ?

Quelle est la bonne pratique à suivre pour créer un bouton accessible ?

Votre site est un manuel en ligne multilingue, où plusieurs langues sont affichées sur une même page. Quelle est la meilleure façon d'indiquer la langue du texte à la technologie d'assistance ?

Quel exemple de style CSS :focus est le plus accessible sur un arrière-plan blanc ?

À quoi sert un lien de navigation rapide ?

Quelle est la meilleure façon de modifier le style d'un élément avec JavaScript ?

Toutes les actions JavaScript sont-elles compatibles avec les utilisateurs de clavier ?

Comment rendre les images complexes accessibles ?

La couleur seule ne suffit pas à identifier un document. Quels autres éléments aident les lecteurs à identifier les éléments de l'UI ?

Que pouvons-nous créer qui reflète les paramètres du système d'exploitation pour le mouvement ?

Pour que le texte soit lisible, je dois toujours utiliser un contraste élevé entre le texte et l'arrière-plan.

Quelles sont les polices les plus adaptées à l'accessibilité ?

Parmi les propositions suivantes, quelle est l'entrée de formulaire la plus accessible ?

Les composants accessibles le restent-ils toujours pour les utilisateurs ?

Quels types de tests devez-vous effectuer pour vous assurer que votre site est accessible ?

Quelles erreurs sont détectées lors des tests automatisés ?

Quels éléments doivent respecter les normes WCAG de contraste des couleurs ?

Quel est le meilleur lecteur d'écran à utiliser pour tester l'accessibilité ?

Quel est l'objectif des tests avec des technologies d'assistance ?

Quel exemple de style CSS `:focus` est le plus accessible sur un arrière-plan blanc ?