Une page peut être jolie et pourtant difficile à utiliser: texte peu lisible, focus invisible au clavier, formulaire incompréhensible sur mobile. L’accessibilité n’est pas une option « pour plus tard »: c’est une amélioration directe de l’UX et, souvent, du taux de conversion. Sur un site WordPress, quelques réglages simples apportent des gains rapides, que l’audience soit à Lausanne et Nyon (Vaud), Genève et Carouge (Genève), Fribourg et Bulle (Fribourg), Sion et Martigny (Valais), Neuchâtel et La Chaux-de-Fonds (Neuchâtel) ou Delémont et Porrentruy (Jura).
Sources officielles: W3C – WCAG 2.2, W3C WAI – WCAG (vue d’ensemble), W3C – ARIA Authoring Practices Guide, MDN – Accessibilité web, Chrome Developers – Lighthouse, WordPress.org – Accessibilité.
1) Accessibilité: ce que cela veut dire, concrètement
WCAG 2.2 sert de référence: rendre le contenu perceptible, utilisable (y compris au clavier), compréhensible et robuste. Sur WordPress, le plus rentable consiste à sécuriser la lisibilité, la navigation et les formulaires, car ce sont les points qui bloquent le plus de personnes, y compris celles qui n’ont pas de handicap déclaré.
2) Les 7 contrôles simples à faire sur chaque page WordPress
1. Contraste et lisibilité
Vérifier que le texte est lisible sur fond clair ou sombre, surtout sur mobile. Éviter le gris trop clair. Garder une taille de police confortable et des interlignes réguliers.
2. Navigation au clavier (Tab) et focus visible
Tester: Tab pour avancer, Shift+Tab pour revenir, Entrée/Espace pour activer. Le focus doit être visible partout (menu, boutons, champs, pop-up). Si un élément est cliquable, il doit être atteignable au clavier.
3. Structure des titres (H1, H2, H3)
Un seul H1 par page, puis des H2/H3 cohérents. Dans Gutenberg, éviter d’utiliser un « Titre » uniquement pour la taille: le niveau de titre doit correspondre à la hiérarchie.
4. Images: texte alternatif utile
Pour une image informative: décrire ce qu’elle apporte. Pour une image décorative: laisser vide si le thème le permet, afin de ne pas polluer la lecture d’écran. Pour un logo: utiliser le nom de la marque.
5. Liens et boutons: libellés explicites
Éviter « Cliquez ici ». Préférer des libellés qui ont du sens hors contexte (ex. « Voir les tarifs », « Demander un devis »). Un bouton doit rester un bouton, un lien doit rester un lien.
6. Formulaires: labels, erreurs claires, consentement lisible
Chaque champ doit avoir un label clair (pas seulement un placeholder). Les erreurs doivent indiquer quoi corriger et où. Ajouter une case de consentement si nécessaire, avec un texte compréhensible et un lien vers la page de confidentialité.
7. Mobile: cibles tactiles et zoom
Sur téléphone, les boutons et liens doivent être faciles à toucher, sans zoomer. Les pop-up ne doivent pas bloquer la fermeture. Tester le site à petite largeur (320 px) et vérifier les menus, CTA et formulaires.
3) Méthode de test rapide: Lighthouse + vérification manuelle
- Étape A (5 min): lancer Lighthouse (Chrome) sur 2 pages clés: Accueil et Contact (ou Checkout si WooCommerce).
- Étape B (10 min): refaire le parcours au clavier (menu, CTA, formulaire) et vérifier le focus.
- Étape C (10 min): contrôler le contraste sur les sections importantes (hero, prix, boutons, texte sur images).
Bon réflexe: corriger d’abord les pages qui génèrent des demandes (services, contact, devis, rendez-vous). Une accessibilité pragmatique améliore la conversion plus vite qu’une refonte complète.
4) Petites corrections WordPress qui changent beaucoup
- Remplacer les boutons « fantaisie » (div cliquables) par de vrais boutons ou liens.
- Ajouter des titres aux sections (Gutenberg) plutôt que des séparateurs uniquement visuels.
- Réserver une seule couleur d’accent pour les CTA, avec un contraste suffisant.
- Réduire les pop-up agressifs: ils bloquent souvent le clavier et le mobile.
- Optimiser les images: une page plus légère est aussi plus accessible sur mobile.
FAQ Accessibilité WordPress (Suisse romande)
L’accessibilité aide-t-elle le SEO local (Vaud, Valais, Neuchâtel) ?
Indirectement, oui. Une page plus claire, plus rapide et plus simple à utiliser réduit les retours arrière et augmente les actions utiles (clic, formulaire, appel). Cela améliore la qualité de l’expérience, ce qui soutient vos performances globales.
Faut-il tout refaire pour être « conforme WCAG » ?
Non. Commencer par les blocages évidents: focus invisible, contraste faible, formulaires sans labels, navigation mobile confuse. Ensuite, améliorer par itérations, page par page.
Quels sont les 3 tests minimum avant publication ?
Mobile (320 px), clavier (Tab + Entrée), et formulaire (erreurs + confirmation). Si ces trois points passent, une grande partie des problèmes courants est déjà évitée.
Besoin d’un audit accessibilité pragmatique sur WordPress ?
Pour améliorer la lisibilité, la navigation clavier, les formulaires et l’expérience mobile, puis prioriser les corrections qui augmentent les demandes, contactez clickclick.ch.
