Verkkosivujen parallaksivieritys

Parallaksivieritys (eng. Parallax scrolling) on verkkosivuissa käytettävä uusi visuaalinen tehokeino, jonka avulla sivulle saadaan luotua kolmiulotteinen vaikutelma ja jopa liikkuvaa taustakuvaa. Parallaksivierityksen ideana on se, että taustakuvat liikkuvat ”kameran” suhteen hitaammin kuin etualan kuvat ja objektit, jolloin sivulle syntyy syvyysvaikutelma. Periaatteessa parallaksivierityksen kuvatekniikka perustuu samanlaiseen kuvien kerrostamiseen kuin mitä mm. perinteisissä animaatioelokuvissa on käytetty jo 1930-luvulta alkaen. Ensimmäistä kertaa digitaalista parallaksivieritystä käytettiin videopeleissä 1980-luvun alussa, esimerkiksi sellaisissa klassikkopeleissä kuin Moon Patrol ja Jump Bug.

Parallaksivierityksessä on olemassa neljä erilaista tekniikkaa: layer-tekniikka, sprite-tekniikka, pattern/animaatio-tekniikka ja rasteritekniikka. Näillä menetelmillä voidaan toteuttaa toisistaan hieman poikkeavia parallaksitaustoja, muta perusideana kaikissa on sama: saada sivulle luotua elävyyttä ja syvyysvaikutelmaa. Layer-tekniikka toteutetaan grafiikkaohjelmista tutulla tekniikalla, jossa kuva muodostuu kerroksista. Tässä tapauksessa kutakin kuvakerrosta voidaan itsenäisesti liikuttaa pysty- ja vaakasuunnassa. Sprite-tekniikka muistuttaa layer-tekniikkaa, mutta siinä käytetään ns. pseudo-layereita (joita kutsutaan spriteiksi). Ne ovat erilaisia itsenäisiä graafisia elementtejä, joita voi asetella taustakuvaan kerroksittain.

Animaatiotaustoja voi puolestaan luoda ns. animaatio-tekniikalla, jossa vieritettävät taustakuvat voidaan lomittaa päällekkäin rakentamalla ne valmiista pienistä elementeistä. Parallaksivieritettäviä taustakuvia voidaan rakentaa myös perinteisellä rasteritekniikalla, jolloin kuvan muodostamisessa käytetään viivettä, mikä luo illuusion liikkuvasta kuvasta.

Parallaksivierityksellä voidaan kieltämättä luoda graafisesti varsin näyttäviä sivustoja, mutta toki tässä – kuten kaikissa muissakin tehokeinoissa – kannattaa käyttää malttia: efektiä ei välttämättä kannata käyttää pelkän efektin vuoksi, vaan sen pitäisi tukea sivuston kokonaisideaa. Palkittuja parallaksivieritystä käyttäviä sivuja löytyy esim. awwwards.com -sivustolta.