Het parallax effect

Je hebt het vast wel eens gezien; websites waarbij de achtergrond langzamer beweegt dan de tekst ervoor wanneer je naar beneden scrollt. Dit wordt parallax scrolling genoemd. Je krijgt erdoor een soort 3D effect op je website.

Wel of niet gebruiken? De één vindt het te druk, de ander geweldig. Ik denk dat een parallax toepassing zelfs voor sites met een serieus onderwerp goed kan uitpakken, zolang je beeld, overlay (sluier) en tekst maar goed afstemt op elkaar.

'

Wanneer pas je het parallax effect toe?

Bijvoorbeeld als je een tekst wilt ondersteunen met beeld. Het beeld valt op, omdat het blijft staan op de achtergrond of langzamer beweegt dan de tekst ervoor. Door het beeld begrijpt de lezer sneller waar het stukje over gaat.

Ik zag ook deze grappige en tegelijkertijd functionele toepassing: een dame krijgt steeds andere kleren aan terwijl je verder scrollt. http://krystalrae.com/

En je kunt met het parallax effect een verhaal vertellen. In dit voorbeeld volg je een raket door de tijd heen: http://www.intacto10years.com/index_start.php

'

Wil je nu een echt topstuk zien op gebied van parallax scrollen, kijk en scroll dan eens rond op deze site:

http://shibui.me/web/scroll/index.html#top

Wil je zelf een parallax effect op je website creëren zonder ingewikkelde html5 of css te schrijven, zoek dan naar WordPress themes die parallax effect ondersteunen, bijvoorbeeld Divi van Elegant Themes. Hieronder heb ik een voorbeeld gemaakt met 4 lagen, waardoor diepte ontstaat, ook met het Divi theme.

En het wordt nog veel mooier met foto’s: http://www.madwell.com/