Espacement du texte

Silktide repère les éléments dont les styles en ligne verrouillent l’espacement du texte — letter-spacing, word-spacing ou line-height — avec !important à une valeur inférieure au minimum des WCAG, empêchant ainsi les utilisateurs de l’ajuster.

Pourquoi c’est important

Les personnes dyslexiques ou ayant une faible vision ont souvent besoin d’un texte plus aéré pour le lire : des lignes plus hautes, des écarts plus grands entre les lettres et les mots. Elles y parviennent à l’aide d’extensions de navigateur et de feuilles de style personnalisées qui remplacent l’espacement d’une page.

Ces outils injectent du CSS de niveau auteur ordinaire. Une déclaration !important dans l’attribut style d’un élément l’emporte sur toute règle de niveau auteur, quelle que soit sa spécificité — c’est le seul mécanisme de la page que ces outils ne peuvent pas remplacer. Quand elle verrouille un espacement en dessous des valeurs minimales, l’utilisateur est tout simplement empêché d’agir.

critère de réussite 1.4.12 (niveau AA) exige que le contenu résiste lorsque les utilisateurs augmentent l’espacement du texte au moins jusqu’à :

Hauteur de ligne (interligne) — 1.5 fois la taille de la police
Espacement des lettres — 0.12 fois la taille de la police
Espacement des mots — 0.16 fois la taille de la police

Comment corriger

Pour chaque élément signalé, faites l’une des actions suivantes :

Supprimez le mot-clé !important de la déclaration en ligne. Les outils des utilisateurs pourront alors la remplacer, et votre conception restera inchangée pour tous les autres.
Déplacez la déclaration dans une feuille de style. Même avec !important, les règles dans une feuille de style peuvent être remplacées par les outils des utilisateurs.
Augmentez la valeur jusqu’au minimum WCAG si l’espacement doit vraiment être verrouillé.

<!-- Échec : verrouillé sous le minimum; les outils des utilisateurs ne peuvent pas le remplacer -->
<p style="line-height: 1.2 !important">\u2026</p>

<!-- Corrigé : remplaçable -->
<p style="line-height: 1.2">\u2026</p>

<!-- Aussi acceptable : verrouillé, mais à une valeur qui atteint déjà le minimum -->
<p style="line-height: 1.5 !important">\u2026</p>

Comment Silktide teste cela

Repérer les éléments dont l’attribut style déclare letter-spacing, word-spacing ou line-height avec !important, et qui contiennent directement du texte visible.
Calculer la valeur déclarée par rapport à la taille de police de l’élément.
Signaler l’élément lorsque la valeur verrouillée est inférieure au minimum WCAG pour cette propriété.

Cela reflète les règles ACT du W3C pour 1.4.12 (espacement des lettres, espacement des mots, interligne).

Silktide ne signale pas les espacements marqués !important dans les feuilles de style — les outils des utilisateurs peuvent toujours les remplacer — et ne simule pas l’application des surcharges d’espacement pour détecter des mises en page brisées, ce qu’aucun outil automatisé ne fait actuellement. Réussir cette vérification signifie que rien sur la page n’entrave l’ajustement de l’espacement par les utilisateurs; vérifier que votre mise en page demeure lisible avec un espacement ajusté est un test manuel rapide à l’aide d’un signet d’espacement du texte.

Dépannage

Le style en ligne provient d’un cadriciel ou d’un composant tiers

Les bibliothèques de composants et les scripts d’intégration écrivent parfois des styles en ligne avec !important. Ils comptent tout de même contre votre page; vérifiez les paramètres du fournisseur ou soulevez la question avec lui.

L’espacement est verrouillé à une valeur conforme

Des valeurs égales ou supérieures aux minima des WCAG sont acceptées même lorsqu’elles sont verrouillées — verrouiller line-height: 1.6 !important ne nuit à personne, car cela dépasse déjà ce à quoi les utilisateurs l’augmenteraient.