Développement WordPress accessible
L’accessibilité est une exigence dans la majeure partie de notre travail, pas une ligne d’amélioration sur le devis. Nous construisons selon les WCAG 2.1 AA par défaut, selon les WCAG 2.2 AA quand un projet ou un appel d’offres le précise, et nous préparons le site pour que le contenu ajouté après le lancement reste accessible sans développeur dans la pièce.
- Les WCAG 2.1 AA comme norme de construction par défaut, 2.2 AA quand c’est précisé
- Conçue et intégrée, plutôt qu’auditée à la fin
- Des garde-fous dans l’éditeur, pour que l’accessibilité survive aux prochaines centaines de pages
- L’information technique qu’exige une réponse d’appel d’offres, tirée de ce que la construction fait réellement
L’accessibilité est un poste évalué, pas une case à cocher
L’approvisionnement public et institutionnel au Canada nomme couramment une norme d’accessibilité dans les exigences : les WCAG 2.1 ou 2.2 au niveau AA, la Loi canadienne sur l’accessibilité pour les organisations sous réglementation fédérale, la LAPHO en Ontario, les standards SGQRI 008 du gouvernement du Québec pour les organismes publics provinciaux, ou EN 301 549 quand une référence européenne est utilisée. Laquelle s’applique dépend de qui achète et de ce qui est acheté.
Ce qu’elles ont en commun, c’est que la question reçoit rarement une réponse par oui ou par non. Elle est notée. Un évaluateur compare ce que deux fournisseurs ont dit qu’ils construiraient, comment ils le prouveraient, et ce qu’il advient du site dix-huit mois plus tard quand un agent des communications a ajouté deux cents pages. Ce sont trois réponses différentes, et la plupart des soumissions ne donnent que la première.
Nommer la norme par écrit
La première chose que nous réglons est de savoir quelle norme et quel niveau s’appliquent, et nous l’inscrivons dans la portée. « Accessible » tout seul n’est pas une spécification, et un projet qui ne nomme jamais une version ne peut pas être testé contre une à la fin.
Des preuves plutôt que des affirmations
Une déclaration de conformité que personne ne peut vérifier ne vaut rien dans une évaluation. Nous consignons selon quoi le site a été construit, ce qui a été testé, comment, et ce qui est connu comme non conforme.
Documents et services intégrés
PDF, cartes, lecteurs vidéo, fenêtres de clavardage et bandeaux de consentement sont généralement l’endroit où la conformité casse réellement, et ils sont généralement hors du thème. Ils doivent être dans la portée ou explicitement hors de celle-ci.
Les parties d’une construction qui décident du résultat
L’accessibilité dans un projet WordPress n’est pas une tâche. C’est un ensemble de décisions réparties dans le design, le thème, la bibliothèque de blocs et l’expérience d’édition, dont la plupart sont bon marché quand elles sont prises tôt et coûteuses quand elles sont découvertes en tests.
Structure sémantique et points de repère
Ordre de titres correct, vrais points de repère, listes qui sont des listes, et tableaux utilisés pour des données plutôt que pour la mise en page. La navigation au lecteur d’écran en dépend presque entièrement, et c’est la chose la moins chère à bien faire et la plus perturbante à corriger après coup.
Opération au clavier
Chaque élément interactif atteignable et utilisable au clavier, dans un ordre sensé, sans rien où l’on puisse entrer sans pouvoir sortir. Menus, accordéons, fenêtres modales et carrousels sont l’endroit où cela se gagne ou se perd.
Couleur et contraste
Contraste vérifié dans la palette, avant qu’elle n’atteigne une maquette, y compris le texte sur images, les états désactivés, les indicateurs de focus et les couleurs de graphiques. Les palettes de marque échouent fréquemment au niveau AA, et c’est une conversation à avoir en première semaine, pas en assurance qualité.
Focus, mouvement et délais
Un indicateur de focus visible qui n’est pas celui du navigateur masqué par une réinitialisation. Des animations qui respectent prefers-reduced-motion. Aucun carrousel qui défile seul sans commande pour l’arrêter, et aucun délai qu’une personne ne peut prolonger.
Formulaires et gestion des erreurs
Étiquettes liées aux champs, erreurs annoncées et associées au champ qui les a causées, champs obligatoires signalés autrement que par la couleur, et un parcours d’envoi qui fonctionne sans que JavaScript réorganise la page sous l’utilisateur.
ARIA en dernier, pas en premier
Des éléments natifs partout où un élément natif existe. ARIA sert à décrire un comportement que le HTML ne peut pas, pas à masquer un balisage qui aurait dû être un bouton. La plupart des ARIA cassés que nous trouvons ont été ajoutés pour faire taire un outil d’audit.
Où l’accessibilité se perd réellement
En pratique, les sites échouent rarement sur le thème qu’un développeur a écrit. Ils échouent sur ce qui y est rattaché. Voici les six que nous rencontrons le plus souvent, et les six sont des décisions plutôt que des accidents.
Des extensions qui apportent leur propre balisage
Une extension choisie pour ses fonctions apporte sa propre interface, et vous héritez de ce qu’elle fait du focus, du contraste et des rôles. Nous vérifions ce qu’une extension affiche avant qu’elle n’entre dans la pile, et construisons le composant nous-mêmes quand la réponse est assez mauvaise.
Des composants interactifs faits maison
Accordéons, onglets, fenêtres modales et carrousels écrits à partir de rien sont la source la plus courante de pièges au clavier. Nous les construisons une fois, correctement, dans la bibliothèque de blocs, pour qu’ils soient justes partout où ils apparaissent.
Des PDF traités comme du contenu
Ordres du jour, rapports et formulaires publiés en PDF sont hors de la conformité du site et généralement dans l’obligation. Soit le document est corrigé, soit l’information existe aussi sous forme de page. Les deux sont valables ; faire comme si la question n’existait pas ne l’est pas.
Des intégrations tierces
Cartes, lecteurs vidéo, outils de réservation, clavardage et bandeaux de consentement sont affichés par le code de quelqu’un d’autre. Les bandeaux de consentement en particulier peuvent prendre le focus au chargement et refuser de le rendre. Chacun doit être testé, remplacé, ou déclaré comme exception connue.
Des palettes de marque qui ne peuvent pas passer
Une palette approuvée dans un guide de marque peut rendre le contraste AA impossible sur les boutons et les petits textes. C’est soluble, généralement avec une variante plus foncée réservée à l’interface, mais seulement tant que le design est encore ouvert.
L’expérience d’édition est le livrable qui garde le site conforme
Un site est accessible le jour de son lancement parce que des développeurs l’ont construit ainsi. Il est accessible deux ans plus tard parce que les personnes qui ajoutent du contenu ne pouvaient pas facilement le casser. Ce sont deux problèmes différents, et un seul se règle par une revue de code.
Nous construisons les interfaces éditoriales comme des systèmes de blocs contraints plutôt que comme des toiles ouvertes : des composants qui portent déjà la bonne structure, des titres qui suivent le plan du document au lieu d’être choisis pour leur taille, des champs d’image qui demandent un texte de remplacement là où il en faut un, et des mises en page qu’un rédacteur ne peut pas réorganiser accidentellement dans un ordre illisible. Quand un motif a des exigences d’accessibilité qu’un rédacteur ne peut pas voir (un contraste minimal, une étiquette obligatoire, une légende), le bloc les impose plutôt que de les documenter.
Le résultat est plus étroit qu’un constructeur de pages, délibérément. Un rédacteur renonce à placer n’importe quoi n’importe où, et obtient un système où l’option accessible est celle par défaut et où l’option inaccessible n’est le plus souvent pas offerte.
L’accessibilité fait partie de vos exigences?
Dites-nous quelle norme s’applique et ce que le site doit faire. Nous vous dirons ce qu’il faut pour l’atteindre, ce qui tombe hors du site web, et ce que cela coûte, avant que vous vous engagiez sur tout le projet.
Où l’accessibilité se situe dans la construction
Exigences
La norme, le niveau et la portée sont écrits, y compris quels services tiers et quels types de documents sont dedans ou dehors. Si le projet est une réponse d’appel d’offres, cela vient de l’appel d’offres plutôt que d’une supposition.
Design
Contraste, états de focus, tailles de cible et états d’erreur sont décidés dans la palette et le jeu de composants, pendant que les changer est encore gratuit.
Construction
Balisage sémantique et comportement au clavier au moment où les composants sont écrits, pas en repasse après coup. Composants interactifs construits une fois et réutilisés.
Contenu
Textes de remplacement, structure de titres et libellés de liens traités pendant la saisie ou la migration, avec les règles éditoriales intégrées aux blocs.
Tests
Vérifications automatisées pour ce qu’elles peuvent attraper, puis tests manuels au clavier et au lecteur d’écran pour la majorité qu’elles ne peuvent pas. Les constats sont corrigés, pas seulement listés.
Passation
Un guide pour les rédacteurs écrit pour les personnes qui l’utiliseront réellement, plus un relevé de ce qui a été testé et de ce qui est connu comme non conforme.
Ce que vous recevez
Une déclaration de ce selon quoi le site a été construit
Quelle norme, quel niveau, et quelles parties du site elle couvre, par écrit, à un niveau de détail qu’un examinateur d’approvisionnement peut utiliser.
Un relevé des tests
Ce qui a été testé, comment, et avec quoi. Les outils automatisés et les tests manuels au clavier et au lecteur d’écran sont rapportés séparément, parce qu’ils répondent à des questions différentes.
Une liste des exceptions connues
Intégrations tierces, documents hérités et tout ce qui n’est pas conforme, énoncés simplement avec ce qu’il faudrait pour les résoudre. Une courte liste honnête vaut plus qu’une déclaration impeccable que personne ne peut vérifier.
Un guide pour les rédacteurs
Les règles dont l’équipe de contenu a besoin, propres aux blocs qu’elle possède, plutôt qu’une introduction générale aux WCAG.
Ce que nous ne prétendons pas
Nous sommes un studio de développement, pas un organisme de certification. Nous construisons selon une norme nommée, nous testons ce que nous construisons, et nous documentons les deux. Mais nos propres tests ne sont pas un audit tiers, et nous ne les présentons pas comme tels. Quand un projet exige une certification indépendante ou un audit formel, c’est un mandat distinct avec un auditeur en accessibilité, et nous le dirons plutôt que de l’absorber dans un devis.
Nous pouvons préparer l’information technique qu’exige un rapport de conformité en accessibilité ou une réponse de type VPAT, à partir de ce qui a été construit et de ce qui a été testé. Nous n’en remplirons pas un avec des affirmations que la construction ne soutient pas.
Nous n’installons pas non plus de widgets de surcouche d’accessibilité. Ils ne rendent pas conforme un site qui ne l’est pas, ils sont fréquemment détectés et rejetés en évaluation, et ils ajoutent une couche de JavaScript entre les utilisateurs et le contenu que les personnes utilisant des technologies d’assistance rapportent largement comme aggravant les choses. Si l’accessibilité est une exigence, le correctif appartient au site.
Questions fréquentes
-
Selon quelle norme d'accessibilité construisez-vous?
Les WCAG 2.1 niveau AA par défaut, et les WCAG 2.2 niveau AA quand un projet ou un appel d’offres le précise. La norme applicable est réglée par écrit à l’étape des exigences, parce qu’« accessible » sans version ni niveau ne peut pas servir de référence de test à la fin.
-
Pouvez-vous rendre accessible un site WordPress existant?
Habituellement oui, et jusqu’où cela va dépend de la construction en dessous. Les problèmes structurels dans le thème et dans les composants interactifs faits maison sont les coûteux ; couleur, contraste, étiquettes et textes de remplacement sont généralement simples. Nous commençons par tester l’existant et par séparer ce qui peut être corrigé sur place de ce qui doit être reconstruit, pour que la décision se prenne sur de vrais chiffres.
-
Fournissez-vous un VPAT ou un rapport de conformité en accessibilité?
Nous préparons l’information technique qu’un tel rapport exige : selon quoi le site a été construit, ce qui a été testé, comment, et ce qui est connu comme non conforme. Nous ne sommes pas un organisme de certification, et nos propres tests ne sont pas un audit indépendant. Quand un projet exige une certification formelle par un tiers, nous le dirons et travaillerons aux côtés de l’auditeur.
-
Les surcouches ou widgets d'accessibilité suffisent-ils?
Non. Une surcouche ne rend pas conforme un site qui ne l’est pas, elle est régulièrement repérée et écartée dans les évaluations formelles, et les personnes utilisant des technologies d’assistance rapportent largement qu’elle rend les sites plus difficiles à utiliser plutôt que plus faciles. Si l’accessibilité est une exigence, elle appartient à la construction.
-
Testez-vous au lecteur d'écran ou seulement avec des outils automatisés?
Les deux, et ils sont rapportés séparément. Les outils automatisés attrapent de façon fiable une minorité de problèmes (textes de remplacement manquants, certains échecs de contraste, certains problèmes de structure) et sont utiles en première passe. L’opération au clavier, l’ordre du focus, la pertinence d’un texte de remplacement et le fait qu’un composant soit réellement utilisable sont des tests manuels.
-
Comment gardez-vous le site accessible après le lancement?
En contraignant l’éditeur plutôt qu’en comptant sur la formation. Les blocs portent leur propre structure, les titres suivent le plan du document, et les images demandent un texte de remplacement là où il en faut un. Les rédacteurs obtiennent un choix plus étroit en échange du fait que l’option accessible est celle par défaut.