Prend en charge le Type Dynamique

axe.configuration.optInToSupportsDynamicType = true

Ce que nous vérifions

Les éléments textuels doivent avoir les propriétés requises pour prendre en charge le Type Dynamique et redimensionner en fonction de la préférence de taille de police de l'utilisateur sur l'appareil.

Cette règle impose une Meilleure Pratique Deque. Vous pouvez désactiver cette règle depuis le Tableau de Bord Mobile ou en ignorer la règle dans les tests écrits pour iOS.

Découvrez comment désactiver les règles depuis le Tableau de Bord Mobile.

Exemple Échoué ❌

Les éléments textuels utilisent des polices fixes qui ne répondent pas au réglage de Type Dynamique de l'utilisateur

Après avoir augmenté le réglage de Type Dynamique à la plus grande taille, le texte remains unchanged — il ne grandit pas pour refléter la préférence de l'utilisateur

Exemple Réussi ✅

Les éléments textuels utilisent des polices évolutives qui répondent au réglage de Type Dynamique de l'utilisateur

Après avoir augmenté le réglage de Type Dynamique à la plus grande taille, le texte scales up accordingly pour s'adapter à la préférence de l'utilisateur sur l'appareil

En Bref

• Cette règle a un impact critique pour les utilisateurs ayant une basse vision qui dépendent de textes plus grands
• Les éléments textuels doivent prendre en charge le Type Dynamique pour qu'ils se redimensionnent lorsque l'utilisateur modifie la taille de police de son appareil

Impact sur les Utilisateurs

Les personnes ayant une basse vision sont les plus touchées par le texte qui ne peut pas être redimensionné. Le Type Dynamique est une fonctionnalité iOS qui permet aux utilisateurs de définir une taille de police préférée sur tout l'appareil, et les applications sont censées respecter cette préférence. Lorsque les éléments textuels ne prennent pas en charge le Type Dynamique, les utilisateurs qui ont besoin de textes plus grands doivent lutter pour lire du contenu qui ne s'adapte pas, quelle que soit leur configuration.

Confirmer le Problème du Support du Type Dynamique

1. Accédez à l'écran contenant le texte et observez la taille actuelle de la police et sa disposition
2. Agrandissez la taille de la police en modifiant le réglage de Type Dynamique :
   • Si vous utilisez un simulateur :
     1. Ouvrez Inspecteur d'Accessibilité
     2. Dans le coin supérieur gauche de l'inspecteur, changez l'appareil de votre Mac pour le simulateur iOS
     3. Sélectionnez le bouton Réglages dans le coin supérieur droit de l'inspecteur
     4. Sous Taille de Police, déplacez le curseur vers un réglage plus grand
   • Si vous utilisez un appareil iOS 13.0+ :
     1. Ouvrez Réglages
     2. Sélectionnez Accessibilité
     3. Sélectionnez Affichage & Taille du Texte
     4. Sélectionnez Texte Plus Grand
     5. Déplacez le curseur en bas de la page vers un réglage plus grand
3. Retournez à votre application et observez les éléments suivants sur le même écran :
   • Inaccessible : Le texte n'a pas changé de taille après la mise à jour du réglage de Type Dynamique
   • Accessible : Le texte a changé de taille

Résoudre les problèmes

Pour résoudre un problème de prise en charge de Dynamic Type, configurez les éléments textuels pour utiliser des polices évolutives qui répondent au paramètre de Dynamic Type de l'utilisateur.

UIKit

Définissez adjustsFontForContentSizeCategory = true sur tout élément textuel pour qu'il se mette à jour lorsque l'utilisateur modifie son paramètre de Dynamic Type. Utilisez UIFont.preferredFont(forTextStyle:) pour les polices système, ou UIFontMetrics pour adapter une police personnalisée par rapport à un style de texte :

// System font — scales automatically to the user's Dynamic Type setting
label.font = UIFont.preferredFont(forTextStyle: .body)
label.adjustsFontForContentSizeCategory = true

// Custom font — scaled relative to a text style using UIFontMetrics
let customFont = UIFont(name: "Georgia", size: 17)!
label.font = UIFontMetrics(forTextStyle: .body).scaledFont(for: customFont)
label.adjustsFontForContentSizeCategory = true

SwiftUI

Sous iOS 14 ou plus, vous pouvez prendre en charge Dynamic Type de deux manières :

• Lors de l'utilisation d'une police personnalisée, définissez la propriété .font à .custom(_:size:relativeTo:) pour vous assurer que les polices s'adaptent relativement au style de police de l'élément textuel.
• Lorsque vous utilisez une police par défaut par taille, le texte s'adapte automatiquement. Cependant, si aucun style de police n'est défini, les éléments textuels ne s'adapteront pas selon leur style. Par exemple, le texte fonctionnant en tant que titre sera redimensionné différemment que le texte fonctionnant en tant que corps de texte. Pour une meilleure expérience, spécifiez le style de police pour qu'il corresponde au comportement attendu de l'élément. En utilisant un modificateur tel que .font(.system(.largeTitle, design: .rounded)), vous pouvez vous attendre à ce que le texte soit le plus grand texte de la page et serve de titre approprié.

React Native

Définissez allowFontScaling={true} sur chaque élément Text pour qu'il s'adapte aux paramètres préférés de l'appareil de l'utilisateur :

<Text style={{ color: 'black', fontSize: 18 }} allowFontScaling={true}> This text allows font scaling. </Text>

Puis-je ignorer cette règle ?

Supports Dynamic Type a un impact critique pour les utilisateurs malvoyants. Comme il s'agit d'une règle de meilleures pratiques, elle peut être désactivée depuis le tableau de bord mobile ou supprimée dans des tests individuels. Cependant, nous recommandons fortement de prendre en charge Dynamic Type dans toute votre application plutôt que d'ignorer la règle de manière générale. En savoir plus sur ignorer les règles.

Ressources

Pages de cours Deque University

• Critère de réussite 1.4.4 - Redimensionner le texte (AA)
• 1.4.4 Redimensionner le texte (AA)

Remarque : L'accès complet aux ressources de Deque University nécessite un abonnement.

Autres ressources

• Directives pour l'accessibilité du contenu Web (WCAG) 2.1, Recommandation W3C
  • Critère de réussite 1.4.4 - Redimensionner le texte
• Documentation pour les développeurs Apple
  • Redimensionner automatiquement les polices
  • Dynamic Type dans SwiftUI