Augmenter l'accessibilité des applications

Faites en sorte que votre application Android soit utilisable par tous, y compris par les personnes ayant des besoins en termes d'accessibilité.

Les appareils Android peuvent être utilisés par des personnes malvoyantes, daltoniennes, malentendantes ou présentant des troubles de la dextérité, cognitifs ou toute autre forme de handicap. Lorsque vous développez des applications en gardant l'accessibilité à l'esprit, vous améliorez l'expérience pour les utilisateurs ayant des besoins spécifiques en la matière.

Cette page vous explique comment implémenter les principaux éléments d'accessibilité afin de faciliter l'utilisation de votre application pour tous. Pour obtenir encore plus de conseils afin de rendre votre application plus accessible, consultez les principes pour améliorer l'accessibilité des applications.

Améliorer la visibilité du texte

Pour chaque ensemble de texte dans votre application, nous recommandons de choisir un contraste des couleurs minimal (ou la différence de luminosité perçue entre la couleur du texte et la couleur de l'arrière-plan). Le seuil exact dépend de la taille de police du texte et de son affichage en gras ou non :

• Si le texte est plus petit que 18 sp, ou s'il est en gras et inférieur à 14 sp, utilisez des couleurs de premier plan et d'arrière-plan qui génèrent un rapport de contraste des couleurs d'au moins 4,5:1.
• Pour tout autre texte, le rapport de contraste des couleurs doit être d'au moins 3:1.

L'image suivante illustre deux exemples de contraste des couleurs du texte par rapport à l'arrière-plan :

Pour vérifier le contraste des couleurs du texte par rapport à l'arrière-plan dans votre application, utilisez un vérificateur de contraste en ligne ou l'application Accessibility Scanner.

Utiliser des commandes simples et de grande taille

L'UI de votre application est plus facile à utiliser lorsque ses commandes sont bien visibles et facilement accessibles. Pour les interfaces tactiles, nous recommandons que chaque élément d'UI interactif dispose d'une zone sélectionnable, ou cible tactile, d'au moins 48 dp × 48 dp. Plus cette zone est grande, mieux c'est.

Dans Jetpack Compose, de nombreux composants Material intégrés tels que Button, IconButton, et ListItem appliquent déjà cette taille minimale. Toutefois, lorsque vous créez des éléments interactifs personnalisés, vous devez définir vous-même la taille.

Dans l'extrait suivant, un petit élément d'UI est rendu accessible en lui attribuant une cible tactile plus grande :

@Composable
private fun LargeBox() {
    var clicked by remember { mutableStateOf(false) }
    Box(
        Modifier
            .size(100.dp)
            .background(if (clicked) Color.DarkGray else Color.LightGray)
    ) {
        Box(
            Modifier
                .align(Alignment.Center)
                .clickable { clicked = !clicked }
                .background(Color.Black)
                .sizeIn(minWidth = 48.dp, minHeight = 48.dp)
        )
    }
}
AccessibilitySnippets.kt

Pour en savoir plus sur les tailles des cibles tactiles, consultez Tailles minimales des cibles tactiles.

Décrire chaque élément d'UI

Pour chaque élément d'UI de votre application, incluez une description de l'objectif de l'élément. Dans la plupart des cas, vous incluez cette description dans l'attribut contentDescription de l'élément, comme indiqué dans l'extrait de code suivant :

@Composable
private fun ShareButton(onClick: () -> Unit) {
    IconButton(onClick = onClick) {
        Icon(
            imageVector = Icons.Filled.Share,
            contentDescription = stringResource(R.string.label_share)
        )
    }
}
AccessibilitySnippets.kt

Notez que vous n'avez pas besoin de fournir de contentDescription pour les composables Text. Les services d'accessibilité Android (comme TalkBack) énoncent automatiquement le texte lui-même.

Lorsque vous ajoutez des descriptions aux éléments de l'interface utilisateur de votre application, gardez à l'esprit les bonnes pratiques suivantes :

• Utilisez des descriptions pour indiquer l'objectif et le résultat de l'interaction, et non les détails visuels. Utilisez la propriété sémantique Role (comme Role.Button ou Role.Switch) pour exposer le type d'un élément d'UI. Ainsi, les lecteurs d'écran peuvent annoncer l'élément correctement.

• Évitez les redondances dans les descriptions. Par exemple, si la sélection d'un bouton entraîne l'exécution de l'action "Envoyer" dans votre application, la description du bouton doit être "Submit", et non "Submit button".

• Chaque description doit être unique. Ainsi, lorsque les utilisateurs de lecteurs d'écran rencontrent une description répétée d'un élément, ils comprennent que l'élément actif a déjà été sélectionné auparavant. En particulier, chaque élément d'une liste telle que LazyColumn doit avoir une description différente, chacune reflétant le contenu propre à un élément donné, tel que le nom d'une ville dans une liste de lieux.

• Utilisez l'API hideFromAccessibility pour marquer les éléments purement décoratifs afin que les services d'accessibilité puissent les ignorer. Si un élément d'UI comporte un paramètre contentDescription, mais qu'il est purement décoratif (comme une Icon qui fait partie d'un autre élément d'UI), transmettez null pour éviter les libellés redondants. Pour des cas d'utilisation plus élaborés, consultez Fusion et suppression.

• Testez votre code pour vous assurer que la description du contenu est fournie comme prévu. Android Lint, les tests Compose et les outils de test manuels et automatisés peuvent signaler les problèmes courants et exposer les problèmes de votre implémentation.

Ressources supplémentaires

Pour en savoir plus sur la manière de rendre votre application plus accessible, consultez les ressources supplémentaires suivantes :

Ateliers de programmation

• Accessibilité dans Jetpack Compose

Vidéos

• Créer des interfaces utilisateur plus accessibles avec Jetpack Compose

Contenu des vues

• Rendre les applications plus accessibles (Vues)