Connaissez-vous le parallax scrolling ? Si vous n’avez pas eu la chance de posséder une console 8-bits alors il y a peu de chances pour que vous connaissiez cette technique graphique permettant de donner une illusion de profondeur de champ (mais il n’est pas trop tard, car il vous reste encore quelques jours pour aller à l’expo Game Story).
Principe de fonctionnement du parallax scrolling
Pourquoi parler du parallax scrolling ? Par ce que j’ai comme l’impression que cette technique est remise au gout du jour sur un certain nombre de mini-sites : Parallax Scrolling Inspiration. Comme précisé plus haut, tout l’intérêt est de donner une signature graphique particulière à un site pour que les visiteurs s’en souviennent. De plus, utilisée de façon intelligente, le parallax scrolling permet de scénariser l’apparition d’éléments sur la page, lui conférant ainsi une cinématique sans pour autant avoir recours à Flash. Le site Ben the Bodyguard a ainsi été le premier à l’exploiter en le combinant à un défilement vertical, le tout dans univers de BD.
Le site à défilement vertical Ben the Bodyguard
De nombreux designers s’en servent maintenant pour leur portfolio, de même que des grandes marques qui en ont vu l’intérêt :
- Nike sur le mini-site de son organisation Better World ;
Le site de Nike en parallax scrolling - Smart sur son site américain SmartUSA ;
Le site de Smart en parallax scrolling - VW sur le site de sa nouvelle Beetle ;
Le site de VW en parallax scrolling - Citroën sur le site de la DS5.
Le site de Citroën en parallax scrolling
Je ne saurais vous dire pourquoi trois constructeurs automobiles ont utilisé cette technique de défilement vertical en quelque mois, toujours est-il que la communauté apprécie. Il n’y a pas de raison particulière pour mettre en oeuvre le parallax scrolling si ce n’est vouloir différencier son site et proposer une expérience graphique originale.
Puisque l’on parle d’originalité, je vous propose de découvrir deux derniers sites qui poussent encore plus loin cette technique :
- Nintendo avec un mini site pour Mario Kart qui utilise du scrolling vertical et horizontal ;
Le site de Nintendo qui utilise le parallax scrolling - L’office du tourisme de Nouvelle-Zélande qui incorpore toute une série de modules interactifs.
Le site de l’office du tourisme de Nouvelle-Zélande qui utilise le parallax scrolling
Est-ce que le parallax scrolling va devenir la norme ? Non, aucune chance. D’une part car il c’est une technique complexe à coder qu n’est pas forcément compatible avec les systèmes de gestion de contenu (pas pratique pour les sites multilingues), d’autre part car cela rallonge les temps d’affichage de la page (il faut charger tous les éléments graphiques et contenus). Mais le plus important est qu’en adoptant un défilement horizontal, vous cassez le principe de navigation page à page. Dans l’absolu, ce n’est pas très grave (Vive les sites web à page unique !), mais un défilement horizontal combiné avec un bandeau de navigation horizontal qui vous suit tout au long de la page peut en dérouter plus d’un. Bref, à utiliser avec précaution.
Voir les 6 commentaires