SkillCodexOuvrir les favoris et l’historique
Mesure d'audience
Avec ton accord, Google Analytics mesure l'usage du site pour nous aider à l'améliorer. Ton choix est mémorisé sur cet appareil et reste modifiable via « Cookies » en pied de page.
Comparaison comportementale
Choisir Feuille basse pour : Afficher les détails d'un lieu sur une carte mobile. Choisir Barre latérale pour : Naviguer entre les sections stables d'un espace de travail.
Décision
La surface doit-elle rester persistante, entrer depuis un bord latéral ou monter depuis le bas ?
Choisis Barre latérale pour une navigation persistante ; choisis Feuille basse pour une surface temporaire qui monte depuis le bas.
| Dimension | Feuille basseBottom sheet | Barre latéraleSidebar |
|---|---|---|
| Déclenchement | Un toucher ouvre la feuille ; sa poignée peut ensuite modifier son niveau par glissement. | Généralement présente avec la mise en page ; un bouton de navigation peut la révéler sur petit écran. |
| Modalité | Souvent modale une fois déployée, avec l’arrière-plan inerte derrière un voile. | Région persistante non modale de la mise en page ; le contenu principal reste actif. |
| Positionnement | Attachée au bord inférieur, avec des hauteurs d’arrêt éventuellement définies. | Une colonne latérale dans le flux du document, pas une superposition au-dessus de la page. |
| Interactivité | Combine contrôles et glissement vertical ; le défilement interne ne doit pas entrer en conflit avec le geste de la feuille. | Accueille navigation, filtres ou contrôles complémentaires persistants. |
| Focus | Le focus entre dans la feuille modale, y reste et revient au déclencheur Filtres après la fermeture. | Le focus circule normalement entre la barre et le contenu principal ; le repli conserve un contrôle logique focalisé. |
| Fermeture | Le contrôle fermer, Échap et un geste vers le bas dépassant le seuil prévu ferment ; les petits glissements accidentels reviennent en place. | Une barre persistante se replie, elle ne se ferme pas ; son équivalent mobile temporaire suit son propre contrat Drawer. |
| Rôle accessible | dialog[aria-modal=true] | aside > nav[aria-label] |
| Cas d’usage | Afficher les détails d'un lieu sur une carte mobile | Naviguer entre les sections stables d'un espace de travail |
| Comportement mobile | Pensée pour la portée tactile ; respecter la zone sûre, le clavier logiciel et le défilement imbriqué. | La replier derrière une navigation explicite ou l’adapter en surface temporaire ; ne pas la comprimer en colonne illisible. |
