Le défilement parallaxe

Pour ajouter un effet de profondeur aux sites Web, les designers Web ont recours à une méthode utilisée depuis longtemps dans le domaine du jeu vidéo : le défilement parallaxe.

Celui-ci consiste à faire bouger différents plans à différentes vitesses pour créer un effet de profondeur et de mouvement. Par exemple, au premier plan un personnage bougerait rapidement, au second plan une forêt lointaine bougerait à vitesse moyenne et finalement au troisième plan des nuages bougeraient à vitesse lente. Tout ceci dans le bus de créer un effet de profondeur.

Le mouvement peut être associé au défilement du site (scroll) ou au mouvement de la souris et est exploité de différentes façons. Vous en trouvez aussi des exemples sur le site de ProWeb au moyen des icônes de médias sociaux qui se chevauchent dans l'arrière-plan et dans la bannière présentant les services dans le haut de la page.

Cet effet, bien utilisé, offre de multiples possibilités au designer Web. À noter qu'il faut garder la lisibilité, la facilité de navigation et le temps de chargement en tête lors de l'utilisation d'un tel effet dans un site Web.

Source :
Définition du défilement parallaxe
http://fr.wikipedia.org/wiki/D%C3%A9filement_parallaxe

Six tendances prévues pour 2013 (anglais)
http://smashinghub.com/web-design-trends-in-2013.htm

Explication des effets de parallaxe
http://design.ikomeo.fr/les-effets-de-parallaxe-webtrends

Liens intéressants :
21 exemples de défilement parallaxe (anglais)
http://webdesignledger.com/inspiration/21-examples-of-parallax-scrolling-in-web-design

30 sites contenants un effet parallaxe (anglais)
http://www.awwwards.com/20-great-websites-with-parallax-scrolling.html