Dans chaque ensemble de pages, le moteur de recherche est-il atteignable de manière identique ?
Un utilisateur avec des troubles cognitifs a mémorisé l’emplacement du champ de recherche sur votre site. Il est toujours en haut à droite. Sauf sur la page Boutique, où il a disparu. Il doit maintenant explorer toute la page pour retrouver ce qu’il savait déjà utiliser. Une frustration évitable.
Le critère 12.5 exige que le moteur de recherche soit atteignable de façon identique sur toutes les pages d’un même ensemble. Trois dimensions sont vérifiées : le mécanisme (un formulaire, pas un lien sur certaines pages), la position visuelle, et l’ordre relatif dans le code source. Ne pas surprendre l’utilisateur.
Concrètement, prenez deux pages du même gabarit et comparez-les. Le formulaire est-il présent sur les deux ? À la même position à l’écran ? Au même endroit dans le DOM par rapport aux autres éléments ? Si une réponse est non, le critère échoue.
Un « ensemble de pages » désigne les pages partageant un même gabarit ou une même logique de navigation. Un site avec un espace client et un site vitrine peut constituer deux ensembles distincts — chacun soumis à ses propres exigences de cohérence interne.
3 tests pour s'assurer qu'un moteur de recherche est disponible
Mécanisme identique d'accès au moteur de recherche
- Ouvrez les outils de développement (onglet Éléments) sur la page en cours d’audit.
- Identifiez le mécanisme d’accès au moteur de recherche :
<form>avec<input type="search">, ou lien<a>vers une page de recherche, ou autre. - Ouvrez de la même façon le code source généré d’une autre page du même ensemble.
- Vérifiez que le type de mécanisme est identique sur les deux pages (formulaire sur les deux, ou lien sur les deux — pas formulaire sur l’une et lien sur l’autre).
- Mécanisme identique sur les deux pages : test validé. Type d’accès différent d’une page à l’autre : test non validé.
Position visuelle identique du moteur de recherche
- Affichez la page en cours d’audit dans le navigateur.
- Notez la position visuelle du moteur de recherche dans la mise en page (ex. : en-tête à droite, colonne latérale, bas de page).
- Affichez une autre page du même ensemble.
- Vérifiez que le moteur de recherche occupe la même position visuelle.
- Position identique sur les deux pages : test validé. Déplacement visuel constaté : test non validé.
Position dans le DOM identique du moteur de recherche
- Ouvrez le code source généré (outils de développement) de la page en cours d’audit.
- Repérez la position relative du moteur de recherche dans le DOM : apparaît-il avant ou après la navigation principale ? Avant ou après le
<main>? - Ouvrez le code source généré d’une autre page du même ensemble.
- Vérifiez que l’ordre relatif est identique (ex. : toujours après
<nav>et avant<main>). - Ordre relatif inchangé : test validé. Position dans le DOM différente d’une page à l’autre : test non validé.
Exemples
❌ Non conforme : Mécanisme d’accès différent selon la page
<!-- Page d'accueil : formulaire de recherche dans l'en-tête -->
<header>
<nav aria-label="Navigation principale"><!-- ... --></nav>
<form role="search" action="/resultats">
<label for="q-home">Rechercher</label>
<input type="search" id="q-home" name="q">
<button type="submit">Lancer</button>
</form>
</header>
<!-- Page article : le formulaire est remplacé par un simple lien -->
<header>
<nav aria-label="Navigation principale"><!-- ... --></nav>
<a href="/recherche">Rechercher sur le site</a>
</header>Sur la page d’accueil, l’utilisateur interagit directement avec un champ de saisie. Sur la page article, il trouve un lien qui l’emmène vers une autre page avant de pouvoir chercher. Le mécanisme a changé : test 12.5.1 en échec. Un utilisateur de lecteur d’écran qui navigue par landmark search ne trouvera rien sur la page article, alors qu’il l’avait trouvé sans effort sur la page d’accueil.
✅ Conforme : Formulaire de recherche cohérent sur toutes les pages
<!-- Page d'accueil ET page article : structure identique -->
<header>
<nav aria-label="Navigation principale"><!-- ... --></nav>
<form role="search" action="/resultats">
<label for="q">Rechercher sur le site</label>
<input type="search" id="q" name="q">
<button type="submit">Lancer la recherche</button>
</form>
</header>Le même formulaire avec le même role="search", au même endroit dans le DOM (après <nav>, dans <header>), sur toutes les pages du site. Les trois tests sont satisfaits : mécanisme identique (12.5.1), position visuelle constante (12.5.2), ordre DOM inchangé (12.5.3). Un utilisateur qui a appris à trouver la recherche n’a plus jamais à la chercher.
Astuces et pièges
⚠️ Le formulaire masqué sur mobile casse le test 12.5.1
Sur certains sites, le <form> de recherche est présent dans le DOM sur desktop mais retiré du flux ou remplacé par une simple icône (sans champ) sur mobile via JavaScript. Le test 12.5.1 compare le code source généré côté client : si le mécanisme change selon la taille d’écran, le test échoue. Auditez systématiquement en mode responsive avec les outils de développement.
⚠️ Position visuelle correcte, ordre DOM inversé
Un formulaire peut sembler au même endroit visuellement grâce à du CSS (flexbox avec order, position absolue) tout en changeant de place dans le DOM d’une page à l’autre. Le test 12.5.2 serait validé, mais 12.5.3 échouerait. Les utilisateurs de lecteurs d’écran naviguent selon l’ordre du DOM, pas l’ordre visuel — c’est l’erreur la plus fréquente sur ce critère en audit.
💡 Deux formulaires de recherche sur chaque page : autorisé
Un formulaire dans l’en-tête et un autre dans le pied de page sont tout à fait valides, à condition que les deux soient présents sur toutes les pages de l’ensemble. Si l’un disparaît sur certaines pages, le test 12.5.1 échoue. Deux formulaires effectuant la même recherche globale peuvent partager le même aria-label.
⚠️ Pas de moteur de recherche : critère non applicable
Le critère 12.5 suppose qu’un moteur de recherche est présent sur le site. Si ce n’est pas le cas, il est coté NA (non applicable) et n’affecte pas le taux de conformité. Ne pas confondre avec le critère 12.6, qui porte sur l’accès rapide aux zones de navigation, dont le moteur fait partie s’il existe.
⚠️ Pages hors ensemble : le gabarit fait foi
Les pages d’erreur 404, de confirmation de commande ou d’impression peuvent constituer un ensemble distinct si leur gabarit diffère du reste du site. En audit, clarifiez avec le commanditaire quels ensembles sont dans le périmètre. Les exigences de cohérence s’appliquent à l’intérieur de chaque ensemble, pas entre ensembles différents.
Questions fréquentes
Comment évaluer le critère 12.5 lorsque le site ne dispose pas de moteur de recherche ?
Non. Sans moteur de recherche, le critère 12.5 est non applicable (NA). Un critère NA ne compte ni pour ni contre dans le calcul du taux de conformité RGAA. Notez-le NA dans votre grille d’audit et passez au suivant.
Que signifie exactement « même mécanisme » pour le test 12.5.1 ?
Le mécanisme désigne le type de composant utilisé pour accéder à la recherche. Un <form> avec <input type="search"> est un mécanisme. Un <a href="/recherche"> en est un autre. Si toutes les pages du même ensemble utilisent le même type, 12.5.1 est validé. Si le type varie d’une page à l’autre (formulaire ici, lien là), il échoue. Le contenu ou le style n’importent pas : seul le type d’accès compte.
Comment auditer efficacement les trois tests du critère 12.5 en pratique ?
Ouvrez deux pages du même ensemble dans deux onglets côte à côte. Pour 12.5.1 et 12.5.3, inspectez le DOM dans les outils de développement et comparez la structure autour du moteur de recherche. Pour 12.5.2, une comparaison visuelle suffit. Documentez avec des captures d’écran annotées pour chaque écart constaté.
Dans quel cas la suppression du moteur de recherche constitue-t-elle une non-conformité RGAA ?
Cela dépend de la définition des ensembles. Si les pages du tunnel partagent le même gabarit que le reste du site, elles font partie du même ensemble et le critère s’applique : supprimer la recherche crée une incohérence. Si le tunnel a un gabarit distinct (interface isolée), il constitue son propre ensemble et la règle de cohérence s’applique uniquement à l’intérieur de ce tunnel.
Quelle est la différence entre le critère 12.5 et le critère 12.6 ?
Le critère 12.5 porte sur la cohérence : le moteur de recherche doit être accessible de la même façon sur toutes les pages d’un même ensemble. Le critère 12.6 porte sur la rapidité d’accès : le moteur (et d’autres zones) doit pouvoir être atteint directement, sans traverser tout le contenu, via un lien d’évitement ou un landmark search. Les deux peuvent être en échec indépendamment.