Wat je tegenwoordig steeds vaker ziet, is het zogenaamde parallax scroll effect. Je komt het bijvoorbeeld vaak tegen op zogenaamde "one page" designs.
Parallax is het verschijnsel dat de schijnbare positie van een voorwerp ten opzichte van een ander voorwerp en/of de achtergrond varieert als het vanuit verschillende posities bekeken wordt (bron: Wikipedia).
Hoe ziet parallax er uit op een website?
De beschrijving van Wikipedia is lastig om je iets bij voor te stellen.Hoe zou zoiets er nu uit zien op een website.
Een voorbeeld van een parallax effect op een website is dat een achtergrond afbeelding sneller scrollt dan jijzelf, wanneer je een pagina naar beneden scrollt.
Of dat de achtergrond van een blok op je website bestaat uit twee afbeeldingen boven elkaar (twee lagen), waarbij de ene laag sneller scrollt dan de andere, en dus de positie van de twee afbeeldingslagen steeds wijzigt ten opzichte van elkaar, wanneer je op de website scrollt.
Een plaatje zegt meer...
Daarom heb ik een video gemaakt van het parallax scroll effect op een Joomla website:
Het parallax effect wat je in de video ziet, heb ik gemaakt met behulp van de Custom Parallax CK module.
Deze kun je hier downloaden.
Het parallax effect kan heel mooi toegepast worden binnen een website en kan een website aantrekkelijker maken. Het kan ook een nadeel hebben. Voor een mooi effect, kun je het best wat grotere afbeeldingen gebruiken. Alleen, grotere afbeelding zijn ook zwaarder en zorgen voor een langere laadtijd van je website.
Probeer dus altijd een goede balans te vinden tussen goede, mooie afbeeldingen en niet te zware afbeeldingen.