Best Of - Webdesign : 10 exemples de sites utilisant l’effet parallaxe - 26 octobre 2012

Webdesign : 10 exemples de sites utilisant l’effet parallaxe

Webdesign : 10 exemples de sites utilisant l’effet parallaxe
Sylvain Lembert Fondateur Webmarketing & co'm

Avez vous déjà vu un site utilisant l’effet parallaxe (aussi appelé urling) ? Cette technique permet de donner une illusion de mouvement lorsque l’internaute scrolle. On voit ainsi les éléments de la page s’animer et donner une illusion de profondeur. De ces sites se dégagent une réelle originalité et une expérience de navigation marquante pour l’internaute. Je vous propose de découvrir 10 exemples dans la suite de cet article…

L’effet de profondeur peut être activer soit en scrollant soit en bougeant la souris en fonction des sites, allez voir ces 10 exemples pour mieux vous rendre compte. Mes préférences allant aux sites de Mario Kart, Nike et Activate Drinks exploitant le réel potentiel de l’effet scroll.  Et pour comprendre la technique de réalisation, je vous conseille la lecture de l’excellent Tutoriel d’Alsacréation : Zoom sur l’effet parallaxe.

Site parallaxe Milwaukee Police News

milwaukee police

Le site : www.milwaukeepolicenews.com

Site parallaxe Mario Kart Wii

mario kart wii

Le site : www.nintendo.com.au/gamesites/mariokartwii/

Site parallaxe Nike JumpMan

nike

Le site : www.nike.com/jumpman23/aj2012/

Activate drinks

site effet parallaxe activate drink

Le site : activatedrinks.com

JanPloch Webdesigner

site effet parallaxe janplauch webdesigner

Le site : www.janploch.de

Resolutionnim : agence digitale

site effet parallaxe revolutionim

Le site : www.resolutionim.com/speed

Digital Hands : Online brand communication

site effet parallaxe digital hands

Le site : www.digitalhands.net

Iutopi

site effet parallaxe digital iutopi

Le site : www.iutopi.com

Egopop

site effet parallaxe egopop

Le site : www.egopop.net

Ok Studio

site effet parallaxe ok studio

Le site : www.ok-studios.de/home/

Si vous aussi, vous souhaitez créer un effet Parallaxe, sachez qu’il existe un plugin WordPress permettant d’avoir recours à cette technique sur le slider de votre blog (Plus d’info ici : Utiliser l’effet Parallaxe avec WordPress).

Généralement cet effet est réservé aux sites évènementiels avec peu de contenu. Il permet de mettre en avant un évènement ou un produit de façon originale. A noter que l’utilisation de cette technique compliquera un peu le référencement du site en question mais rien n’est impossible 🙂

Et vous, avez vous des exemples de sites utilisant cette technique ? Qu’en pensez vous ?

S'abonner à la newsletter
Laisser un commentaire
  • Guide des bonnes pratiques sur Twitter

    9.90

    Découvrez toutes les bonnes pratiques pour réussir sur Twitter !

    Découvrir
  • Guide des bonnes pratiques sur Google+

    9.90

    Ce guide sera l’occasion d’appréhender les bonnes pratiques à mettre en place pour tirer profit de Google+ et gagner en visibilité.

    Découvrir
  • Pack bonnes pratiques Twitter et Google+

    12.90

    Grâce à ce pack, bénéficiez d’un tarif réduit pour nos deux ebooks.

    Découvrir

14 commentaires pour l'article “Webdesign : 10 exemples de sites utilisant l’effet parallaxe

  1. Bonjour Sylvain,

    Merci pour ce petit article, j’ai découvert ou redécouvert avec plaisir ces différents sites utilisant l’effet parallaxe. Ils me font beaucoup penser au site http://prezi.com/ que j’utilise de temps en temps pour faire des présentations dynamiques. Je ne suis pas sûre qu’il s’agisse d’un effet parallaxe mais en tout cas cela y ressemble beaucoup ^^

  2. C’est très joli, mais réservé à des sites orientés communication marketing, design, mode etc…
    Le côté fun des animations, limite jeu vidéo, pourrait avoir un effet négatif pour les visiteurs de sites vitrines pros tels que des coffres-forts par exemple.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *