Prend en charge le type dynamique

This page is not available in the language you requested. You have been redirected to the English version of the page.

Link to this page copied to clipboard

Not for use with personal data

note

Il s’agit d’une règle expérimentale et ses résultats sont donc considérés comme étant en phase de test bêta. Apprenez-en davantage sur les règles expérimentales et comment vous pouvez contribuer à les améliorer.

L'exécution de cette règle entraînera une augmentation des temps d'analyse.

important

Cette règle est lancée pour le framework XCUI avec la version 2.6.0. Elle sera activée uniquement pour une durée limitée afin de recueillir des commentaires. Essayez-le et dites-nous ce que vous en pensez.

Après avoir initialisé l'objet AxeDevTools pour commencer les tests, activez la règle en utilisant la configuration :

axe.configuration.optInToSupportsDynamicType = true

où axe fait référence à l' AxeDevTools objet initialisé lors de la connexion.

Les éléments de texte doivent avoir les propriétés requises pour prendre en charge le Dynamic Type et redimensionner le texte selon les préférences de l'appareil de l'utilisateur.

Cette règle applique une meilleure pratique Deque. Vous pouvez désactiver cette règle à partir du tableau de bord mobile ou en ignorant la règle dans les tests écrits pour iOS.

Apprenez comment désactiver les règles à partir du tableau de bord mobile.

Impact

Les personnes malvoyantes sont les plus affectées par les textes qui ne peuvent pas être redimensionnés. Dynamic Type est une technologie d'assistance qui permet à l'utilisateur final de modifier la taille de la police sur l'ensemble de l'appareil pour une lecture plus facile.

Confirmation

Naviguez à l'écran contenant le texte et observez la taille de police actuelle et sa disposition
Agrandissez la taille de la police en modifiant le paramètre Dynamic Type :
- Si vous utilisez un simulateur :
  1. Ouvrez l'inspecteur d'accessibilité
  2. Dans le coin supérieur gauche de l'inspecteur, changez le simulateur iOS de votre Mac à l'appareil
  3. Sélectionnez le bouton « Paramètres » dans le coin supérieur droit de l'inspecteur
  4. Sous « Taille de la police », déplacez le curseur vers un réglage plus grand
- Si vous utilisez un appareil iOS 13.0+ :
  1. Ouvrez les paramètres
  2. Sélectionnez « Accessibilité »
  3. Sélectionnez « Affichage et 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
Revenez à votre application et observez le même écran
- Inaccessible : le texte n'a pas changé de taille après la mise à jour du paramètre Dynamic Type.
- Accessible : Le texte a changé de taille.

Comment corriger

Un problème détecté par cette règle se produit lorsque les vues ne prennent pas en charge les paramètres de Dynamic Type.

UIKit

En savoir plus sur la prise en charge du Dynamic Type dans UIKit ici.

SwiftUI

Dans iOS 14 ou supérieur, vous pouvez prendre en charge le Dynamic Type :

Lorsque vous utilisez une police personnalisée, définissez la propriété .font à .custom(_:size:relativeTo:) pour garantir que les polices s'adapteront relativement au style de police de l'élément de texte.
Lorsque vous utilisez une police par défaut par taille, le texte sera mis à l'échelle automatiquement. Cependant, si aucun style de police n'est défini, les éléments de texte ne seront pas mis à l'échelle en fonction de leur style. Par exemple, le texte qui fonctionne comme un titre sera mis à l'échelle différemment du texte qui fonctionne comme un corps de texte : à mesure que le texte devient plus grand, le texte du titre sera toujours plus grand que le corps du texte. Pour une expérience optimale, assurez-vous de spécifier le style de police correspondant 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

Assurez-vous que la propriété allowFontScaling de chaque élément de texte est définie sur true pour permettre au texte de s'adapter aux paramètres d'appareil préférés de l'utilisateur.

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