Les sites consacrés à la cuisine accumulent des centaines, parfois des milliers de recettes classées par type de plat, par ingrédient ou par saison. Retrouver une recette précise dans cette masse suppose de comprendre comment le plan de site organise ces contenus.
Le critère WCAG 2.2 « Multiple Ways » (2.4.5) prévoit d’ailleurs que chaque page d’un site puisse être atteinte par plusieurs chemins distincts : catégories, recherche interne, liens contextuels. Sur un site culinaire, cette exigence prend un relief particulier quand le visiteur consulte une recette les mains prises par la préparation ou navigue sur téléphone d’une seule main.
Naviguer dans un plan de site cuisine avec les mains occupées
Un plan de site (sitemap HTML) liste l’ensemble des pages accessibles. Sur un blog culinaire, cette page devient vite un mur de liens si elle n’est pas segmentée. Le réflexe classique consiste à faire défiler la page jusqu’à repérer visuellement la catégorie cherchée, puis à cliquer sur le lien de la recette.
Ce parcours pose un problème concret en cuisine. Quand on a les mains mouillées ou couvertes de farine, faire défiler un écran tactile avec précision relève du défi. Utiliser un clavier n’est pas plus simple : la touche Tab saute de lien en lien, et si le plan de site contient plusieurs centaines d’entrées, atteindre la bonne ligne demande des dizaines de pressions successives.
Le W3C signale un point souvent négligé : un bandeau fixe ou une fenêtre superposée ne doit pas masquer l’élément sélectionné au clavier (critère WCAG 2.2, 2.4.11 « Focus Not Obscured »). Sur un site de recettes, un header collant qui recouvre la ligne en cours de focus rend la navigation au clavier pratiquement inutile. Vérifier que le focus reste visible est un test rapide qui change l’expérience pour toute personne naviguant sans souris.
En parcourant le plan du site de Mon Blog Cuisine, on observe un découpage par catégories principales (entrées, plats, desserts, boissons) qui limite le défilement nécessaire avant de trouver la bonne section.
Structure d’un plan de site culinaire : catégories, filtres et recherche interne
Un plan de site ne devrait jamais être le seul moyen de localiser une recette. Trois voies complémentaires permettent de couvrir les différents comportements de recherche des visiteurs.
- Les catégories thématiques regroupent les recettes par famille (soupes, gratins, pâtisseries) ou par ingrédient dominant (poulet, chocolat, légumes de saison). Elles fonctionnent bien pour le visiteur qui explore sans idée précise.
- La recherche interne avec champ de saisie libre convient au visiteur qui sait déjà ce qu’il veut. Un champ de recherche placé en haut de page, accessible dès le plan de site, raccourcit le parcours à quelques secondes.
- Les liens contextuels à l’intérieur des recettes (« voir aussi », suggestions en bas de page) créent des passerelles entre contenus proches. Un visiteur qui consulte une recette de tarte aux pommes peut découvrir une compote ou un crumble sans repasser par le plan de site.
Proposer plusieurs chemins vers chaque recette réduit la dépendance au plan de site et satisfait le critère WCAG 2.4.5. Ce principe profite à tous les visiteurs, pas seulement à ceux qui ont un handicap déclaré.
Le piège des menus déroulants sur mobile
Les menus déroulants à plusieurs niveaux posent un problème spécifique sur écran tactile. Quand les liens de sous-catégories sont trop rapprochés, le doigt active le mauvais lien. Le critère WCAG 2.2 « Target Size (Minimum) » (2.5.8) encadre précisément ce point : les zones cliquables doivent rester suffisamment espacées pour éviter les erreurs d’activation.
Sur un site de cuisine consulté en pleine préparation, ce n’est pas un détail technique. Un visiteur qui active par erreur la catégorie « Confitures » alors qu’il cherchait « Confiseries » perd du temps, revient en arrière, et finit parfois par abandonner la navigation pour taper directement sa requête dans un moteur de recherche externe.
Tester la navigation d’un site de recettes sans images ni souris
Les recommandations du W3C suggèrent de vérifier la navigation au clavier, la visibilité du focus et la possibilité de rejoindre chaque page par plusieurs moyens (critères 2.4.3, 2.4.5 et 2.4.7). Appliqué à un site culinaire, ce test révèle des failles que l’apparence du menu ne laisse pas deviner.
Premier test : débrancher la souris et naviguer uniquement au clavier. Sur un plan de site bien conçu, la touche Tab parcourt les catégories dans un ordre logique, et la ligne sélectionnée reste visible même si un bandeau reste collé en haut de l’écran. Si le focus disparaît derrière un élément fixe, le site échoue au critère 2.4.11.
Deuxième test : désactiver les images du navigateur. Un plan de site culinaire qui repose sur des vignettes photographiques pour distinguer les catégories devient inexploitable sans ces images. Les intitulés textuels des catégories doivent suffire à identifier chaque section.
Navigation vocale et commande d’une seule main
La navigation vocale sur mobile (commandes système ou assistants intégrés) fonctionne mieux quand les liens portent des intitulés explicites. Un lien intitulé « Voir la recette » répété vingt fois sur une page ne permet pas à un assistant vocal de distinguer les entrées. Un intitulé du type « Recette du gratin dauphinois » donne au visiteur et à l’assistant un repère précis.
Pour le visiteur qui tient son téléphone d’une seule main, la zone de navigation principale doit rester accessible au pouce. Les boutons de catégorie placés en bas d’écran ou dans une barre flottante inférieure réduisent l’effort physique par rapport à un menu hamburger positionné en haut à gauche.
Limites connues des plans de site sur les blogs culinaires
Un plan de site HTML reste une page statique, générée périodiquement ou mise à jour à chaque publication. Sur un blog actif qui publie plusieurs recettes par semaine, un décalage peut exister entre le contenu réel et ce que le plan de site affiche. La recette publiée le matin n’apparaît pas toujours dans le plan de site consulté l’après-midi.
Les données manquent pour quantifier la fréquence réelle de mise à jour des sitemaps HTML sur les blogs culinaires francophones. Les sitemaps XML destinés aux moteurs de recherche sont souvent générés automatiquement par des extensions, mais leur équivalent HTML visible par le visiteur dépend d’un choix éditorial que chaque blogueur gère différemment.
Le plan de site reste un outil complémentaire, pas un substitut à une navigation bien pensée. Un site culinaire qui combine catégories claires, recherche interne fonctionnelle, liens contextuels entre recettes et zones tactiles correctement dimensionnées offre un parcours fluide, y compris pour le cuisinier amateur qui consulte son téléphone entre deux étapes de préparation.
