L’accessibilité d’un site de petite entreprise n’est pas un sujet réservé aux grands comptes. Elle consiste à rendre vos pages utilisables par plus de personnes, dans plus de situations : client qui navigue au clavier, prospect malvoyant, utilisateur sur mobile en plein soleil, personne qui lit vite entre deux rendez-vous, internaute qui utilise un lecteur d’écran ou formulaire rempli dans l’urgence.
Pour une TPE, un artisan, un commerçant ou un indépendant, les bases sont très concrètes. Un site plus accessible est souvent aussi plus clair, plus robuste et plus agréable à utiliser. Il ne s’agit pas de promettre une conformité complète sans audit. Il s’agit d’intégrer les bons réflexes dès la création ou lors des prochaines améliorations.
La priorité est simple : structurez correctement les pages, rendez toutes les actions utilisables au clavier, vérifiez les contrastes, clarifiez les formulaires, décrivez les images utiles et écrivez des contenus compréhensibles.
Structurer la page avec du HTML clair
La première base d’accessibilité est invisible dans la maquette, mais essentielle dans le code : utiliser les bons éléments HTML pour leur vrai rôle. Un titre doit être un titre, un bouton doit être un bouton, une liste doit être une liste, un lien doit mener quelque part. Cela aide les navigateurs, les lecteurs d’écran et les outils d’assistance à comprendre la page.
MDN rappelle que le HTML sémantique donne déjà beaucoup de repères d’accessibilité intégrés au navigateur. En pratique, cela évite de reconstruire artificiellement des comportements avec des blocs génériques difficiles à utiliser.
Pour une page de petite entreprise, vérifiez au minimum :
- un seul titre principal visible et clair ;
- des sous-titres dans un ordre logique ;
- des paragraphes courts ;
- des listes pour les étapes, les garanties ou les informations pratiques ;
- des liens dont le texte indique la destination ;
- des boutons réservés aux actions, comme envoyer un formulaire ou ouvrir un menu.
Cette structure sert aussi le référencement et la compréhension par les systèmes automatisés. Notre article sur la manière de structurer une page service détaille cette logique pour les pages commerciales.
Rendre les actions possibles au clavier
Un site accessible doit pouvoir être utilisé sans souris. MDN explique qu’une page doit rester opérable uniquement au clavier, notamment pour les personnes qui utilisent un lecteur d’écran, ont des difficultés motrices ou préfèrent ce mode de navigation.
Testez une page simplement avec la touche Tab, Entrée, Espace et les flèches lorsque c’est pertinent. Vous devez pouvoir :
- atteindre le menu ;
- ouvrir et fermer les éléments interactifs ;
- voir clairement où se trouve le focus ;
- remplir un formulaire ;
- activer les boutons ;
- revenir en arrière sans rester bloqué dans une fenêtre ou un menu ;
- parcourir la page dans un ordre logique.
Les erreurs fréquentes sont faciles à repérer : bouton visible mais impossible à atteindre, contour de focus supprimé, menu mobile inutilisable au clavier, fenêtre modale qui piège l’utilisateur, lien représenté uniquement par une icône sans nom compréhensible.
Ce contrôle est particulièrement important sur mobile et tablette, car les parcours sont souvent simplifiés visuellement. Notre méthode pour concevoir le parcours mobile d’un site de TPE complète ce point côté priorisation des contenus et appels à l’action.
Vérifier les contrastes et la lisibilité
Un beau design peut devenir inutilisable si le texte manque de contraste. Fond gris clair, bouton doré pâle, texte fin sur image, petit texte en surimpression : ces choix paraissent parfois élégants sur grand écran, mais deviennent pénibles dans la vraie vie.
Les WCAG 2.2 indiquent, pour le niveau AA, un ratio de contraste d’au moins 4,5:1 pour le texte courant, avec des exceptions comme les grands textes. Cette règle ne remplace pas le jugement visuel, mais elle donne un seuil mesurable pour éviter les combinaisons trop faibles.
À vérifier sur un site de petite entreprise :
- textes de paragraphes ;
- boutons principaux et secondaires ;
- liens dans le corps du texte ;
- messages d’erreur ;
- placeholders et labels de formulaires ;
- texte placé sur une photo ;
- badges, prix, horaires et coordonnées.
Ne communiquez pas une information uniquement par la couleur. Si un champ est en erreur, ajoutez un message clair. Si une offre est recommandée, indiquez-le par du texte, pas seulement par une couleur différente. Le RGAA traite aussi ce point dans ses critères sur les couleurs et la présentation de l’information.
Construire des formulaires compréhensibles
Le formulaire de contact est souvent le point le plus important du site. C’est aussi l’un des endroits où l’accessibilité échoue vite : labels absents, champs obligatoires mal indiqués, erreurs difficiles à comprendre, bouton désactivé sans explication, message de succès invisible pour les technologies d’assistance.
MDN cite les labels de formulaires parmi les bonnes pratiques HTML d’accessibilité. Chaque champ doit avoir un libellé visible et explicite. Un placeholder seul ne suffit pas : il disparaît dès que l’utilisateur saisit quelque chose et peut être mal restitué selon les outils.
Une base solide :
- label visible pour chaque champ ;
- aide courte lorsque le format est attendu ;
- indication claire des champs obligatoires ;
- message d’erreur proche du champ concerné ;
- message de confirmation après envoi ;
- bouton au texte précis, comme “Envoyer ma demande” ;
- ordre de tabulation cohérent ;
- aucune question inutile dans le parcours.
L’accessibilité rejoint ici la conversion. Un formulaire accessible est souvent plus facile à remplir pour tout le monde. Pour choisir les champs à garder, vous pouvez vous appuyer sur notre article dédié aux informations à demander dans un formulaire de contact.
Décrire les images utiles sans surcharger
Toutes les images n’ont pas le même rôle. Une photo décorative n’a pas besoin d’être lue comme une information essentielle. À l’inverse, une photo de réalisation, un schéma, une carte, un exemple avant/après ou une image produit peut porter une information utile.
Le texte alternatif doit expliquer la fonction de l’image dans son contexte. Il ne sert pas à empiler des mots-clés. Pour une réalisation, il peut préciser le type de projet montré. Pour une icône de téléphone accompagnée du texte “Appeler”, l’icône peut rester décorative si le texte visible suffit. Pour une image contenant du texte important, le contenu doit aussi exister en HTML lisible.
Quelques règles pratiques :
- décrivez les images qui apportent une information ;
- laissez décoratives les images purement visuelles ;
- évitez les textes alternatifs comme “image” ou “photo” ;
- ne placez pas une information essentielle uniquement dans une image ;
- vérifiez les images de cartes, menus, prix et captures d’écran ;
- gardez les fichiers optimisés pour ne pas dégrader l’expérience.
Cette logique complète les bonnes pratiques d’images déjà abordées dans notre article sur le choix et l’optimisation des images d’un site professionnel.
Écrire des contenus simples et orientés action
L’accessibilité ne se limite pas au code. Un contenu peut être techniquement lisible mais incompréhensible. Les visiteurs doivent savoir où ils sont, ce que vous proposez, pour qui, à quelles conditions et quelle prochaine action faire.
Évitez les phrases longues, les acronymes non expliqués et les titres vagues. Préférez une réponse directe en début de page, puis des détails utiles. Les liens doivent avoir un intitulé explicite : “voir nos offres de site vitrine” est plus clair que “cliquez ici”.
Sur une page commerciale, vérifiez :
- la promesse principale apparaît vite ;
- les services sont nommés avec des mots utilisés par les clients ;
- les étapes sont lisibles ;
- les tarifs, limites ou conditions sont expliqués lorsqu’ils existent ;
- les appels à l’action correspondent au niveau d’engagement demandé ;
- les informations de contact sont faciles à retrouver.
Le RGAA inclut des critères liés aux titres de page, à la structure, aux liens, aux formulaires, aux tableaux, à la navigation et à la présentation. Même si toutes les petites entreprises ne mènent pas un audit complet immédiatement, ces critères donnent une grille utile pour prioriser les corrections.
Tester rapidement avant de publier
Le W3C WAI propose des vérifications rapides avec “Easy Checks”, tout en précisant qu’elles ne couvrent qu’une partie des problèmes possibles et ne remplacent pas une évaluation complète. C’est une bonne approche pour une petite entreprise : commencer par des contrôles simples, puis approfondir si le site a un enjeu fort ou un public large.
Avant de mettre une page en ligne, testez :
- le titre de la page est clair dans l’onglet ;
- les titres se suivent dans un ordre logique ;
- toutes les actions sont atteignables au clavier ;
- le focus est visible ;
- les contrastes principaux sont suffisants ;
- chaque champ de formulaire a un label ;
- les erreurs de formulaire sont compréhensibles ;
- les images utiles ont une alternative ;
- les liens ont un texte explicite ;
- la page reste compréhensible sur mobile.
Un outil automatique peut aider, mais il ne voit pas tout. Il peut signaler un contraste trop faible ou un label manquant, mais il ne saura pas toujours si un texte alternatif est pertinent, si un intitulé est compréhensible ou si le parcours commercial a du sens.
Intégrer l’accessibilité dans le projet
Le meilleur moment pour traiter l’accessibilité est le début du projet. Corriger après coup coûte souvent plus cher, car il faut reprendre les composants, les couleurs, les formulaires et parfois toute la structure.
Dans un brief de site, ajoutez quelques exigences simples :
- navigation clavier testée ;
- contrastes vérifiés sur les couleurs principales ;
- formulaires avec labels et erreurs explicites ;
- textes alternatifs prévus pour les images utiles ;
- contenus rédigés en langage clair ;
- composants réutilisables accessibles ;
- contrôle manuel avant mise en ligne.
Ces exigences peuvent être intégrées sans alourdir le projet. Elles rendent surtout les décisions plus propres dès le départ. Si vous préparez une création ou une refonte, notre article sur le brief de site internet exploitable peut servir de base pour cadrer ces attentes avec un prestataire.
Prochaine étape
Choisissez une page importante de votre site : accueil, service principal, contact ou page de réservation. Parcourez-la sans souris, puis vérifiez les titres, les contrastes, les formulaires et les images utiles. Notez les trois obstacles les plus gênants pour un visiteur.
Commencez par ces corrections-là. L’accessibilité progresse mieux avec des améliorations concrètes et vérifiées qu’avec une promesse générale. Pour une petite entreprise, chaque correction utile rend le site plus clair, plus fiable et plus facile à utiliser.