Selon le CDC, 26% des adultes aux États-Unis ont un certain type de handicap. Ne pas rendre votre site Web accessible aux personnes ayant des déficiences visuelles ou cognitives peut entraîner une perte de trafic, un mauvais classement SEO et même des litiges juridiques.
De nos jours, presque tous les sites Web incluent une forme de formulaire, qu’il s’agisse d’un formulaire de commande de produits ou de quelque chose de plus simple comme un formulaire de contact. Les formulaires sont souvent l’une des parties les plus inaccessibles d’un site Web et méritent donc une attention particulière.
Quelle que soit la manière dont vous implémentez votre formulaire, en utilisant un code personnalisé ou un plugin, vous devez suivre certaines directives et bonnes pratiques pour vous assurer que vos formulaires sont entièrement accessibles.
Dans cet article, vous apprendrez à créer des formulaires Web accessibles pour WordPress. Cela peut vous aider à toucher un public plus large, à améliorer l’expérience utilisateur de votre site Web et à augmenter vos revenus.
Qu’est-ce que l’accessibilité du site Web ?
La Web Accessibility Initiative dirigée par le World Wide Web Consortium écrit que :
« L’accessibilité du Web signifie que les sites Web, les outils et les technologies sont conçus et développés de manière à ce que les personnes handicapées puissent les utiliser. Plus précisément, les gens peuvent – percevoir, comprendre, naviguer et interagir avec le Web – contribuer au Web ».
La navigation sur un site Web, la saisie d’informations et la sélection du lien ou du bouton approprié peuvent être difficiles pour les utilisateurs souffrant de handicaps visuels, physiques ou cognitifs. L’accessibilité implique la mise en œuvre d’un ensemble de bonnes pratiques pour rendre votre site utilisable en :
- Les personnes malvoyantes qui utilisent des lecteurs d’écran.
- Personnes à mobilité réduite qui naviguent sur les sites avec le clavier
- Les personnes atteintes de troubles cognitifs
- Les daltoniens
- Les personnes qui dépendent de la recherche vocale
- Les personnes dont la langue maternelle n’est pas l’anglais et qui utilisent des services de traduction.
- Les personnes souffrant d’affections temporaires, telles qu’un bras cassé, qui doivent saisir des informations à l’aide de touches.
Les formulaires représentent l’un des plus grands défis d’accessibilité, car ils peuvent être difficiles à parcourir et déroutants à remplir.
L’importance des formulaires Web accessibles
Les formulaires agissent comme un pont entre vous et vos clients. Par conséquent, il est essentiel de vous assurer que vos formulaires sont accessibles aux personnes handicapées. Ce sont quelques-unes des raisons les plus importantes pour optimiser vos formulaires Web pour l’accessibilité générale de WordPress.
Éviter les litiges juridiques
Saviez-vous que l’accessibilité sera bientôt une exigence légale pour votre site Web alors que de plus en plus d’États commencent à mettre en œuvre des mandats d’accessibilité Web ? Cela a été provoqué par des poursuites contre des marques bien connues déposées en vertu de l’Americans with Disabilities Act (ADA).
Augmentez vos revenus
En plus des exigences légales, l’accessibilité peut vous aider à augmenter vos revenus. Par exemple, les résultats de l’enquête britannique Click-Away Pound 2019 ont révélé qu’un grand pourcentage d’utilisateurs handicapés quittent les sites Web en raison de problèmes d’accessibilité, entraînant avec eux plus de 17 milliards de dollars de dépenses potentielles.
Améliorer l’expérience utilisateur
Le respect des meilleures pratiques en matière d’accessibilité peut vous aider à faciliter la navigation et la lecture de votre site Web. Les changements d’accessibilité aident à améliorer l’expérience utilisateur pour tous les visiteurs de votre site Web, pas seulement pour les personnes handicapées.
Boostez votre référencement
Accorder une attention particulière à la structure de votre site Web et rendre les pages plus faciles à naviguer peut donner à votre site un coup de pouce SEO en facilitant l’exploration des moteurs de recherche. De plus, l’ajout de “texte alternatif” descriptif à vos images, appelé balises alt, est crucial à la fois pour les malvoyants et les moteurs de recherche lorsqu’il s’agit de comprendre votre contenu.
Les moteurs de recherche privilégient les contenus faciles à consommer pour tous. C’est pourquoi l’accessibilité sera toujours un facteur important dans le référencement.
Attirer un public plus large
Selon les statistiques de la Commission européenne, des Nations Unies et d’autres organisations, on peut supposer qu’environ 20 % de la population mondiale souffre d’une forme de handicap. Dans cet esprit, la mise en œuvre des meilleures pratiques d’accessibilité peut vous aider à attirer plus de clients.
Directives pour la création de formulaires Web accessibles
Alors, comment créer des formulaires accessibles pour votre site WordPress ? Voici quelques directives à suivre.
Utiliser un plugin de formulaire conçu pour l’accessibilité
Si vous souhaitez économiser du temps et des efforts, vous devez utiliser un plugin de formulaire WordPress qui inclut déjà des fonctionnalités d’accessibilité. En ce qui concerne les formulaires accessibles, l’un des meilleurs plugins est Gravity Forms.
Gravity Forms s’engage pleinement en faveur de l’accessibilité. Cela se reflète dans sa dernière version, qui comprend un certain nombre de fonctionnalités importantes pour vous aider à créer des formulaires accessibles conformes à WCAG 2.1 AA, la norme mondiale.
Gravity Forms 2.5 incluait une variété d’améliorations d’accessibilité qui l’ont poussé au-dessus des autres plugins de formulaire. Cela inclut des commentaires détaillés sur le lecteur d’écran pour les utilisateurs aveugles ou malvoyants, ainsi que des avertissements dans la zone d’administration concernant les champs présentant des problèmes d’accessibilité.
Mais l’accessibilité n’est pas la seule raison d’utiliser Gravity Forms. Il existe également une multitude de plugins puissants qui étendent Gravity Forms, vous permettant de créer de puissantes applications Web.
Informer les utilisateurs de ce à quoi s’attendre
La clarté globale est importante pour l’expérience utilisateur globale, pas seulement pour l’accessibilité. Lors de la création de vos formulaires, assurez-vous qu’ils sont faciles à numériser et qu’ils contiennent des instructions claires pour chaque champ. Si les utilisateurs trouvent vos formulaires confus, ils peuvent laisser votre site frustré.
Si vous avez un formulaire avec plusieurs étapes, il est important que les utilisateurs sachent à quelle étape ils se trouvent et combien d’étapes il leur reste. Assurez-vous qu’il existe un moyen pour les utilisateurs de revenir aux étapes précédentes afin qu’ils puissent modifier ou mettre à jour les informations comme bon leur semble.
Enfin, fournissez un texte descriptif à tous vos boutons et liens afin que vous sachiez clairement à quoi vous attendre lorsque vous cliquez dessus. Au lieu d’utiliser « Cliquez ici » comme texte du lien, utilisez quelque chose qui décrit le lien comme « Notre blog ». Idem pour les boutons. “Envoyer” est sec et générique, utilisez plutôt quelque chose qui décrit l’action que l’utilisateur entreprend, comme “S’abonner” ou “Envoyer un message”.
Libellés et descriptions des champs
Lorsque vous rédigez des étiquettes, assurez-vous qu’elles sont significatives et dites à l’utilisateur, de manière claire et concise, ce qu’il doit remplir. Pour les meilleurs paramètres d’accessibilité, placez vos balises sur les entrées de champ où elles sont clairement visibles et n’incluent pas de code HTML ou de liens, car cela peut dérouter les lecteurs d’écran.
Si vous utilisez un plugin de formulaire, vous aurez également la possibilité de saisir des descriptions de champs. Ceux-ci sont facultatifs, mais vous pouvez les utiliser si vous avez besoin de fournir des informations supplémentaires sur le champ.
Contraste de couleur
Les couleurs utilisées sur votre site Web sont un facteur d’accessibilité important. Le contraste de couleur fait référence à la différence de lumière entre la source de premier plan et la couleur d’arrière-plan. Des couleurs mal choisies pour vos formulaires peuvent rendre la lecture difficile pour les personnes, en particulier celles qui ont une déficience visuelle.
En ce qui concerne WordPress, la couleur de vos formulaires est généralement déterminée par votre thème, mais vous pouvez la remplacer en ajoutant vos propres styles CSS personnalisés. N’oubliez pas non plus de ne pas faire référence à la couleur dans les instructions de votre formulaire. Par exemple, ne dites pas « cliquez sur le bouton vert pour continuer » car cela peut causer des problèmes aux utilisateurs daltoniens.
La taille et le poids de la police sont également des options d’accessibilité importantes. Assurez-vous que la police que vous choisissez pour vos formulaires est claire et lisible. Il existe plusieurs plugins, tels que One Click Accessibility, qui permettent aux utilisateurs de visualiser votre site Web en utilisant différentes combinaisons de couleurs.
Logique conditionnelle
Si vos formulaires contiennent une logique conditionnelle, assurez-vous que cela n’a pas d’impact sur l’accessibilité. Par exemple, n’utilisez jamais de logique conditionnelle pour masquer le bouton « Envoyer ».
reCAPTCHA
Bien que les CAPTCHA et les reCAPTCHA puissent être une partie importante de votre stratégie anti-spam, ils sont un cauchemar en matière d’accessibilité. Les CAPTCHA demandent souvent aux utilisateurs de renseigner des informations ou de sélectionner certaines images à l’écran. Cela entraîne non seulement une mauvaise expérience utilisateur, mais constitue également un défi pour les personnes souffrant de handicaps cognitifs et/ou visuels.
Au lieu de CAPTCHA, utilisez des alternatives telles que des champs de miel ou des plugins de spam axés sur la confidentialité qui n’affectent pas l’expérience utilisateur. Le favori connu dans ce domaine est Akismet, bien qu’il ait un prix.
Erreur de message
Assurez-vous que les messages d’erreur sont exploitables et clairement écrits. Vos messages d’erreur doivent fournir des commentaires sur les erreurs ou les omissions et expliquer comment les corriger. Par exemple, au lieu de dire « il y a eu une erreur », vous pourriez dire « votre mot de passe était trop court. Veuillez saisir un mot de passe de 12 caractères ou plus ».
N’oubliez pas que votre travail consiste à aider l’utilisateur à remplir ses formulaires pour en faire un processus rapide et agréable. Les messages d’erreur qui ne fournissent pas suffisamment d’informations peuvent provoquer de l’anxiété et de la frustration.
Navigation au clavier
De nombreux utilisateurs handicapés ne peuvent pas utiliser de souris, alors assurez-vous que vos formulaires sont navigables en utilisant uniquement la touche de tabulation. Cela inclut la fermeture des messages d’erreur et le retour aux étapes précédentes.
Balisage HTML solide
Si vous préférez créer des formulaires à partir de zéro, il est important d’utiliser un code HTML correct, car c’est ce que les lecteurs d’écran utilisent lors de la transmission d’informations. Par exemple, les balises doivent utiliser la balise et non un
étiqueter.
De plus, les champs avec plusieurs options de saisie doivent utiliser le
étiquette car elle indique aux lecteurs d’écran quelles options appartiennent à quel champ.
Formulaires accessibles pour WordPress : réflexions finales
L’accessibilité du Web est la pratique consistant à rendre votre site Web utilisable par des personnes ayant des handicaps physiques et cognitifs.
Les formulaires sont l’un des aspects les plus importants d’un site Web, car ils constituent un pont entre vous et vos clients. Cependant, les formulaires sont également connus pour avoir des problèmes d’accessibilité et nécessitent donc une attention particulière.
Prendre le temps de créer des formulaires accessibles peut vous aider à toucher un public plus large, à booster votre référencement et à améliorer l’expérience utilisateur globale des visiteurs de votre site Web. Les formulaires accessibles doivent inclure un langage clair, des balises descriptives et un balisage HTML approprié.
Bien qu’ils soient à la mode pour empêcher le spam, les CAPTCHA présentent un certain nombre de problèmes d’accessibilité et devraient être remplacés par des alternatives moins intrusives telles que des plugins anti-spam qui s’exécutent en arrière-plan ou des champs de miel invisibles.
Prêt à commencer à créer des formulaires accessibles pour votre site WordPress ? La mise en œuvre des stratégies ci-dessus vous donnera une longueur d’avance sur la plupart des autres sites Web, alors lancez-vous dès aujourd’hui !
