J'essaie de mettre en évidence la corrélation entre la sélection d'une table principale et son panneau d'exploration.
Lorsque vous ouvrez la page, vous ne voyez que le premier panneau. Une fois que vous avez cliqué sur l'une des lignes du tableau, un panneau d'exploration apparaît. Avec ce flux, la corrélation est claire.
Mais que se passe-t-il si l'utilisateur ouvre un lien où le panneau d'exploration est déjà ouvert? Ou s'il voit une capture d'écran?
Comment pourrais-je améliorer la corrélation entre les deux?
Si vous n'êtes pas limité par l'espace horizontal, vous pouvez déplacer les détails vers la droite.
Mais si vous êtes limité par l'espace et la technologie, vous pouvez ajouter une ligne reliant la ligne active avec des détails et utiliser la même couleur de surbrillance (vous pouvez également envisager une animation significative qui montre d'abord la ligne, puis la boîte avec des détails).
Vous n'avez pas précisé quelle technologie vous utilisez, mais en écrivant "... ouvrir un lien ...", je suppose qu'il s'agit de html/css/js.
Je peux penser à trois types de mise en évidence.
Ajout d'un .actif: vous pouvez ajouter une classe, qui met en évidence le détail, en utilisant une couleur corrélative, en changeant le poids de la police, en ajoutant des ombres ou/et des transformations. Tout cela peut être fait par css.
Ajout d'un .inactive: réduisez la visibilité, l'alpha et la couleur des sections inactives.
Mettre en œuvre des icônes: en utilisant des icônes, vous pouvez montrer à l'utilisateur qu'une certaine entité est ouverte. Les exemples peuvent être des dossiers ouverts et fermés, des flèches triangulaires ou plus/moins, etc. Font Awesome est un bel exemple pour accomplir cela.
Dans le cas de "... ouvrir un lien ...": si par exemple un anachor est déjà défini, au lieu d'afficher déjà l'exploration en charge, vous pouvez définir un délai d'attente, faire défiler jusqu'à la section, l'ouvrir et le laisser clignoter une fois que. Cela peut être facilement fait par jQuery.
La position de l'exploration doit être à l'intérieur des lignes du tableau. N'en faites pas trop. Parfois, moins c'est plus.
Bootstrap a quelques fonctions intégrées pour accomplir vos pensées. Vous devriez peut-être jeter un œil.