Le moteur de recherche est-il accessible de façon identique sur toutes les pages — y compris les pages profondes et les formulaires ?
Critère officiel 12.5 — Dans chaque ensemble de pages, le moteur de recherche est-il atteignable de manière identique ?
Pourquoi c'est important
Un moteur de recherche qui disparaît sur certaines pages n'est pas un vrai système de navigation de secours. L'utilisateur qui en a besoin précisément en lisant un article ou en remplissant un formulaire ne peut pas y accéder sans revenir à l'accueil.
Exemples concrets
Ce qui est conforme
L'icône de recherche est présente dans l'en-tête de toutes les pages du site, à la même position. Sur mobile, elle reste accessible via le menu. Un usager peut lancer une recherche depuis n'importe quelle page, même profonde.
Ce qui pose problème
La barre de recherche est dans la colonne latérale de la page d'accueil et des rubriques principales. Elle disparaît sur les pages d'articles individuels. Un usager qui cherche un autre document après avoir lu un compte-rendu doit revenir à l'accueil pour relancer une recherche.
Comment agir
Vérifiez que l'accès au moteur de recherche est présent sur toutes les pages sans exception. De préférence dans l'en-tête, qui est la zone la plus stable. Testez en naviguant jusqu'à une page de troisième niveau — le moteur de recherche doit toujours être atteignable.
Règles clés
- Barre de recherche ou lien vers la page de recherche dans le header — visible sur toutes les pages.
- Le formulaire doit être accessible (label, bouton submit).
- Les résultats doivent être annoncés via une live region (critère 7.5).
Erreurs fréquentes
- Barre de recherche uniquement sur la page d'accueil
- Lien vers la page de recherche absent de la navigation
Exemples de code
recherche absente des pages intérieures
✗ Non conforme<!-- Page d'accueil : barre présente -->
<!-- Pages intérieures : aucune barre ni lien -->Le moteur de recherche est inaccessible depuis les pages intérieures.
recherche dans le header partagé
✓ Conforme<header>
<nav>...</nav>
<form role="search" aria-label="Recherche">
<label for="q" class="sr-only">Rechercher</label>
<input type="search" id="q" name="q"
placeholder="Rechercher...">
<button type="submit">
<svg aria-hidden="true"><!-- loupe --></svg>
<span class="sr-only">Lancer la recherche</span>
</button>
</form>
</header>Formulaire dans le header partagé — accessible depuis toutes les pages. form avec role='search' l'identifie comme landmark.
Référence WCAG : 3.2.3