Critères de succès

WCAG 1.3.2 Ordre séquentiel logique

Le critère de succès 1.3.2 exige que, lorsque l'ordre de lecture d'un contenu est important pour sa compréhension, l'ordre correct puisse être déterminé par programme. C'est un critère de niveau A sous la règle 1.3 (Adaptable).

Où cela casse réellement

Le CSS laisse à la mise en page visuelle toute liberté de s'écarter de l'ordre du DOM : la propriété order en flexbox et en grille, le positionnement absolu, les flottants peuvent tous faire apparaître le contenu dans un ordre visuel différent de celui dans lequel il existe réellement dans le HTML. Une personne voyante voit la version arrangée par le CSS ; un lecteur d'écran restitue l'ordre réel du DOM. Lorsque les deux divergent sensiblement pour un contenu dont la séquence porte du sens - une suite d'instructions numérotées, un formulaire dont les champs s'enchaînent logiquement -, la personne qui utilise un lecteur d'écran reçoit une version désordonnée et déroutante du même contenu.

Un exemple concret courant

Une mise en page à deux colonnes construite avec des flottants ou une grille CSS, dans laquelle la colonne visuellement à gauche est en réalité le deuxième élément du DOM, repositionné visuellement par le CSS : une personne voyante lit de gauche à droite et de haut en bas, comme attendu, mais un lecteur d'écran annonce l'ordre réel du DOM, qui peut restituer la deuxième colonne avant la première.

Comment le vérifier

Le test classique consiste à désactiver entièrement le CSS - ou à utiliser le mode lecture du navigateur - et à lire la page dans son ordre brut, sans mise en forme. Si le contenu garde une cohérence logique - les instructions s'enchaînent encore étape par étape, les champs d'un formulaire progressent encore de façon sensée -, l'ordre du DOM est correct, quelle que soit la façon dont le CSS repositionne les éléments. S'il paraît désordonné ou déroutant, c'est l'ordre du DOM, et pas seulement le CSS, qu'il faut modifier pour correspondre à la séquence de lecture voulue.

La distinction avec le parcours du focus (2.4.3)

Ce critère porte sur l'ordre dans lequel le contenu est lu ; le critère Parcours du focus (2.4.3) porte spécifiquement sur l'ordre dans lequel les éléments interactifs reçoivent le focus clavier lors de la tabulation. Les deux sont souvent en défaut ensemble, le focus suivant lui aussi l'ordre du DOM en général, mais ils évaluent deux expériences liées et distinctes.

Questions fréquentes

Qu'est-ce que le critère WCAG 1.3.2 ?

Un critère de niveau A qui exige que l'ordre du DOM et l'ordre de lecture soient logiques lorsque la séquence importe, afin que les technologies d'assistance restituent le contenu dans l'ordre prévu.

Qu'est-ce qui provoque une non-conformité au critère 1.3.2 ?

Recourir au CSS - propriété order en flexbox, positionnement absolu - pour réorganiser visuellement le contenu, de sorte que l'ordre visuel ne corresponde plus à l'ordre du DOM que suivent les lecteurs d'écran.

En quoi le critère 1.3.2 diffère-t-il du critère 2.4.3 ?

Le critère 1.3.2 porte sur l'ordre de lecture du contenu ; le critère 2.4.3 Parcours du focus porte spécifiquement sur l'ordre dans lequel le focus clavier traverse les éléments interactifs.