web-dev-qa-db-fra.com

Comment concevoir une page Web à utiliser, sans abuser du défilement de parallaxe?

Il semble y avoir beaucoup de battage médiatique autour du défilement de parallaxe de nos jours. Je voudrais savoir s'il existe une meilleure façon, ou à tout le moins, une bonne façon de concevoir une page Web qui utilise le défilement de parallaxe ou le mouvement de parallaxe.

En tant que designer, j'ai beaucoup d'autres choses dans mon assiette ... Y a-t-il des outils pour se moquer de cela afin que je n'aie pas à apprendre à coder?

Existe-t-il des ressources qui pourraient m'aider à démarrer le défilement de parallaxe?

2
eeklipzz

Mettre les préoccupations d'utilisabilité et d'accessibilité avant de rendre le site paralax est le principe simple que je vous conseillerais de suivre afin d'atteindre votre objectif.

N'oubliez pas que le contenu vient en premier, que les utilisateurs doivent atteindre facilement leurs objectifs. Travaillez sur une bonne navigation accessible et gardez le contenu clair et facile à trouver. N'oubliez pas que les utilisateurs naviguent sur différents appareils et utilisent différents outils d'interface (souris, claviers, doigts, lecteurs d'écran, etc.). Pensez à la fatigue du défilement, aux effets du mouvement et au contraste des couleurs à toutes les étapes de toute partie du site qui bouge.

Si vous devez choisir entre faire quelque chose de manière utilisable et accessible ou le faire en parallèle, choisissez la solution utilisable et accessible.

Paralax est une sorte de mode et de nombreux mauvais sites sont produits en utilisant cette méthode. C'est généralement lorsque la paralax est mise en premier et l'utilisabilité en second, les mauvais choix étant faits par les concepteurs face à la question ci-dessus. Vous serez un meilleur concepteur et le Web sera un meilleur endroit si vous accordez la priorité à la convivialité et à l'accessibilité, même si le site résultant ne comporte aucune fonctionnalité de paralaxe.

En fait, vous pouvez utiliser des fonctionnalités de paralaxe subtiles pour améliorer l'effet visuel, par exemple, des images qui se déplacent progressivement au fur et à mesure que la page défile.

J'aime beaucoup Nintendo, mais malheureusement je dois partager cette page et dire 'commencez par ne rien faire': http://www.nintendo.com.au/gamesites/mariokartwii/#gba

Ou, sous un jour plus positif, consultez les nouvelles pages paralax des sites Web de la BBC: http://www.bbc.co.uk/news/special/2014/newsspec_7617/index.html - pas tout à fait paralax dans le sens classique du mot mais en prenant l'idée et en affinant quelque chose de vraiment sympa (je n'ai pas étudié ce lien en profondeur pour l'accessibilité, mais référencez-le comme une page paralax très claire).

Il vaut également la peine de prendre avec une pincée de sel tous les exemples de défilement paralax de prix de design, car les personnes qui décident des prix peuvent tomber dans le même piège fou.

2
Toni Leigh