Le défilement parallaxe : qu’est-ce que c’est ?

Écrit par

dans

,

The parallax scrolling effect is a design technique that’s relatively new in development and web design. Over the past few years since it’s hit the scene though, it’s grown pretty popular in its own right, and with good reason, too.

Définition du défilement parallaxe

Parallax scrolling is a technique wherein your web page’s background image scrolls at a slower rate compared to the foreground image. It gives the user a unique sense of depth and action while scrolling through a page when used on a website.

Without Parallax Scrolling

The elements of the web page – the text, images, buttons, etc – all scroll at the same rate as the background.

With Parallax Scrolling

The background image scrolls at a different rate as the rest of the elements in the page.

L’impact du défilement parallaxe sur l’utilisateur

Cette technique n’est pourtant pas vraiment nouvelle et a en réalité été utilisée dans l’animation traditionnelle dès les années 1920. Elle a également été utilisée dans de nombreux jeux vidéo classiques, comme Super Mario Bros.

Dans le domaine de la conception web, Nike est souvent considéré comme l’un des premiers à avoir utilisé le défilement parallaxe en 2011. Depuis lors, l’expression « défilement parallaxe » (parfois appelée « arrière-plan(s) parallaxe ») est devenue un terme courant tant chez les designers que chez les développeurs, gagnant régulièrement en popularité.

Parallax scrolling as used in a version of Super Mario Brothers. Notice how the hills in the background move
in slightly varying speeds, as compared to Mario and the other characters in the foreground.

Ce que l’utilisateur y gagne

Ce qui est formidable avec cet effet, c’est qu’il incite les utilisateurs à interagir avec votre site web, renforçant à la fois l’interaction avec l’utilisateur et l’attrait visuel. Et, lorsqu’il est bien réalisé, le défilement parallaxe peut donner vie aux sites web les plus simples. Il peut même être utilisé pour créer des récits captivants qui immergent immédiatement tous les visiteurs du site.

Partagez votre travail avec nous !

Alors, qu’en pensez-vous ? Avez-vous déjà utilisé la nouvelle fonctionnalité d’arrière-plan parallaxe de PBS v4 ? Est-elle efficace pour vous ? N’hésitez pas à partager un lien vers vos réalisations ou à laisser des suggestions dans la section des commentaires ci-dessous.

Bonne création de site !