Est-il toujours possible d'avoir plusieurs rangées d'onglets?
Nous travaillons sur une interface utilisateur au travail et les gens veulent que le nombre d'onglets dans une certaine zone soit de largeur flexible de sorte que dans certaines situations, en fonction de la longueur du titre et du nombre d'onglets, la ligne d'onglet puisse finir par remplir 2 ou même 3 lignes.
Je me demande s'il est toujours possible d'avoir plusieurs rangées d'onglets; pour moi, il semble que cela casse la métaphore des onglets, puis vous devez vous soucier de la modification des emplacements des onglets.
En même temps, cependant, je ne suis pas sûr d'une bonne alternative autre qu'une liste ou un accordéon.
Il brise définitivement l'onglet métaphore .
Yahoo's Design Pattern Library indique explicitement ils doivent être simples:
Présentez une rangée d'onglets sur une seule ligne dans une barre horizontale sous la marque et l'en-tête du site
Et il y a quelques exemples assez désagréables dans un 1999 page de la société d'architecture d'information .
Un autre article sur l'utilisation du modèle de tabulation dans les applications Web décourage son utilisation pour diverses raisons:
Plusieurs lignes d'onglets sont déroutantes et intimidantes, en particulier pour les nouveaux utilisateurs qui ont du mal à localiser l'onglet souhaité. De plus, la taille de l'écran est compromise et le repositionnement des onglets au premier rang provoque une confusion et une complexité considérables.
Cela dit, nous l'avons vu dans MS Office ... il ne devrait donc pas être que mauvais, non. Droite?
MISE À JOUR: d'autres approches sont: les onglets verticaux, le regroupement des onglets par catégories ou un écran précédent avec des icônes.
J'ai eu le même problème il y a un an, et j'ai opté pour la solution suivante:
Lorsque la largeur des onglets est inférieure à la largeur du conteneur, tous les onglets sont visibles.
Si les onglets sont plus larges que le conteneur, une flèche apparaît dans le coin, donnant accès aux onglets cachés lors du clic. L'onglet sélectionné est toujours visible.
Vous pouvez envisager l'option d'avoir plusieurs lignes en ajoutant une ligne supplémentaire qui représente l'onglet actuel. Par exemple, si la ligne du haut a un onglet "foo" et que vous le sélectionnez, l'onglet devient désactivé et la ligne du bas est modifiée pour avoir l'onglet unique "foo". Cependant, l'onglet d'origine ne bouge pas.
Cela évite le problème d'avoir à réorganiser les onglets tout en préservant quelque peu la métaphore. Pensez-y comme supprimer le contenu d'un dossier de fichiers physiques tout en laissant le dossier où il se trouve.
Je n'ai jamais vu cela faire, mais je pense que ce pourrait être un bon compromis si vous avez suffisamment d'espace vertical pour une ligne de tabulation supplémentaire.
Vous pouvez également faire défiler les onglets comme MS Excel quand il y en a trop?
Cela ne veut pas dire que c'est la meilleure approche, juste une alternative à plusieurs lignes.
Oui. Il existe des cas Edge où une telle présentation est acceptable. Les dialogues de propriétés de MS Windows l'utilisent depuis au moins Windows 95. Le client de messagerie instantanée multiprotocole Digsby y va quand la largeur de la fenêtre de chat ne permet pas à toutes les conversations de tenir sur 1 ligne (il passe ensuite en défilement vertical de tab tab).
Cela étant dit, il n'est pas recommandé d'avoir plus d'une ligne d'onglets car l'interface devient encombrée. Essayez de réorganiser vos informations en premier. Si aucune autre option n'est disponible, suivez l'exemple de Microsoft de plusieurs lignes en organisant les onglets de manière logique et en gardant à l'esprit leur taille. Notez également que chaque titre d'onglet a approximativement le même rembourrage généreux sur les côtés: 