web-dev-qa-db-fra.com

Le défilement horizontal est-il utilisable en vue mobile?

Lors de la création d'une vue réactive d'une page avec une grille de zones de contenu, est-ce une bonne solution pour utiliser un défilement horizontal? Imaginez une mise en page avec un en-tête, une colonne principale de contenu (680px) et une barre latérale (300px), dans la barre latérale se trouvent des widgets de membres, à propos, le nuage de tags, des sujets connexes, etc. En mode mobile, l'idée est de placer ces widgets en haut (en-dessous de l'en-tête et au-dessus du contenu) et utilisez le défilement horizontal des widgets.

1
Eran Ayalon

Example Scrolls Il ne devrait pas y avoir de problème avec l'utilisation du défilement horizontal pour un menu. Cela étant dit, j'ai remarqué que certaines applications mobiles rencontrent des problèmes lorsque la possibilité de faire défiler un élément n'est pas apparente. Le défilement horizontal n'est pas quelque chose que les utilisateurs supposent faire sur mobile, vous devrez donc savoir comment le menu informe l'utilisateur de sa capacité à faire défiler.

Quelques astuces que vous pourriez utiliser pour aider l'utilisateur à découvrir le défilement horizontal:

  1. Décalez certains des widgets, en les faisant dépasser le bord, il est donc évident qu'il y a plus d'éléments cachés à droite.
  2. Affichez une barre de défilement soit brièvement en tant qu'animation d'intégration lors du premier chargement de l'application, soit à tout moment.
  3. Utilisez une autre animation d'intégration qui fait légèrement défiler le menu et le ramène à sa position d'origine lors du premier chargement de la page.
1
Mike W

Pourquoi pas? Avec si peu de contexte, c'est difficile à savoir.

N'utilisez pas le défilement horizontal comme principal moyen de naviguer dans une page, car il demande plus d'efforts que le défilement vertical.

Mais pour une navigation latérale ou une partie de la page, pourquoi ne pas l'utiliser pour gagner de l'espace sur les plus petites fenêtres?

Vraiment, vous devriez retravailler votre question si vous voulez obtenir plus d'informations.

1
Leths

S'il est bien conçu, les utilisateurs n'auront aucun problème à l'utiliser, je pense.

Cependant, plus naturel serait;

1) place la largeur de la zone de contenu à 100% de l'écran mobile
2) implémentez le balayage vers la gauche et la droite, et lors du balayage, passez à la case suivante ou précédente
3) indiquent que le balayage vers la gauche et la droite est disponible quelque part en haut
4) placez une belle animation pour glisser

1
xul