1178 sujets

Accessibilité du Web

Scroll sur deux colonnes

Bonjour,
ma question. Est-ce que la mise en place d'un double scroll pour deux colonnes sur un site est un problème pour l'UX ?
Je ne l'ai pas mis en ligne pour le moment. L'effet est exactement celui que je veux, mais parfois, je ressens une certaine gêne pour naviguer. Quelle est le hauteur max à mettre pour chaque colonne ?
Est-ce le manque d'expérience de ma part ou la gêne est-elle réelle pour les visiteurs ?
J'ai réalisé un Pen minimaliste, juste pour décrire cet effet et définir de quoi je parle.

https://codepen.io/Codeurta/pen/XWGRYKR
salut

pas de gêne, c'est comprehensible.
peut-être un leger fond gris dans le fond et blanc dans les 2 divs pour les différencier (ou inversément)
et je dirais au pif 40 ou 50vh pour la hauteur des 2 divs scrollables sur grand écran
et 80 pour les gsm
@drphilgood
différencier les deux colonnes par des couleurs légères, oui, bonne idée. Je voulais les laisser en blanc, mais si je dose bien, je devrais trouver quelque chose de discret.
OK pour les valeurs en vh. Comme c'est un effet que je mets en service pour la première fois, je n'y avais pas pensé. Pour les mobiles, l'effet est supprimé, il n'y a plus qu'une seule colonne.
@gcyrillus
c'est ça, mais je constate que c'est le même effet que le mien ? Je vais regarder un peu mieux les effets produits sur le site en réel mais j'ai l'impression que c'est la même chose, les deux propositions ?
Et pour l'UX, pas de problèmes ?
Modérateur
Bongota a écrit :

c'est ça, mais je constate que c'est le même effet que le mien ? Je vais regarder un peu mieux les effets produits sur le site en réel mais j'ai l'impression que c'est la même chose, les deux propositions ?

Sur ces deux test, Il y a une difference en fonction de la quantité de contenu lorsque les barre de défilement se déclenchent.

Bongota a écrit :
Et pour l'UX, pas de problèmes ?

Je dirais la seconde (avec le sticky) n'est franchement pas terrible.
La première , sans débordement de l'écran, ne perturbe pas plus que ça, c'est le look d'un autre siècle qui ... surprend, je dirais.

Mais en cloisonnant plusieurs zones défilantes, il est plus difficile d'identifier les différentes zones de contenus de la page, si il y en a d'autres Smiley cligne contenus d'un footer, des categories, formulaires (contact/recherche/news/..)

Cdt
Modifié par gcyrillus (19 Jan 2024 - 16:45)
Oui, en effet, il y a une petite différence, j'ai testé.
Je suis partagé sur cet effet. D'un côté, je suis pas satisfait de ces sites où tout descend en même temps (je parle des sites à plusieurs colonnes), d'un autre, si on en voit peu avec double scroll, c'est bien qu'il doit y avoir une raison, tant le code est facile et léger à mettre en place. Du mouvement sur une page, c'est parfois agréable.
Je crois que j'ai trouvé la solution. Plus qu'un effet, ce que je voulais surtout, c'est que mon aside, qui contient de nombreux liens, suive la colonne de droite. Colonne qui peut être beaucoup plus longue que le aside, qui de ce fait, disparaît. Il faut remonter pour chercher un de ses liens. J'ai mis, sur le aside :
overflow:scoll;
max-height:600px; /*Pour le moment*/
position:sticky;
top:0;

Lors de la descente, le aside suit la colonne de droite. Quand celle-ci est longue, le aside vient se colle contre le footer et ne bouge plus. Reste à diminuer ces vilains ascenseurs, mettre quelques marges pour caler le tout. Je crois que j'ai trouvé ce que je cherchais, qui n'était pas un effet "années 90" Smiley lol
Je vais mettre en ligne et vous me direz ce qu'il faut en penser.
Voilà, je m'étais trompé d'endroit !!! Smiley fache
Un modérateur peut-il enlever mon post dans le message du dessus ?
Je mets donc le message au bon endroit.
J'ai mis en ligne les changements :
https://ecrisdroit.fr
Prévenir un modérateur
Répondre au sujet
Aller à