Mi az a parallax design és mire jó?

Az animáció őrület nem egy új keletű dolog, hiszen nem is volt olyan régen a flash korszak, amikor mindenki megőrült a pörgő-forgó, áttűnő, előmászó weboldalakért. A “hűha” érzés igénye azóta sem kopott meg, kápráztatni akarunk, menők akarunk lenni.

Parallax WeDesign

Mi az a parallax?

A parallax módszer működési elve tulajdonképpen egy elemi geometrián alapuló matematikai formula, amit már évszázadok óta használnak csillagászok és tengeri navigátorok távolságok és irányok kiszámításához. De mi köze ennek a webdesignhoz?

Parallax görgetés egy olyan technika, amivel animációt lehet szimulálni, az egymáson lévő háttérképek (vagy egyéb elemek) különböző ütemben való mozgatásával.

A matematikai formulát felhasználva, HTML5, CSS3 és jQuery segítségével lehet látványos animációkat létrehozni.

Nézd csak meg ezt ! Nem semmi igaz?

Parallax minta

Egy jól sikerült parallax weboldalnak nagyon látványos és interaktív grafikai megjelenése van, garantáltan mindenki el lesz bűvölve.

Előnyei

  • Lenyűgözhetjük vele felhasználóinkat, vonzóbbá, látványosabbá tehetjük weboldalunkat, látogatóinkat a monitor előtt tarthatjuk.
  • Az oldalunkon eltöltött idő tovább tart, ezen felül még több animáció reményében többet kattintanak.
  • Azt sugallja, hogy igazán innovatív és naprakész jelenség vagy.

De vajon mikor érdemes alkalmazni?

Jó ötlet-e az interaktív felhasználói élményt előtérbe helyezni egy konverzió orientált honlapnál, amelytől elsősorban hatékonyságot és több bevételt várunk el? Nem igazán. Mielőtt teljesen beleszerelmesednénk az élménybe, le kell szögezni, hogy a parallax megoldásnak sajnos számos árnyoldala van.

Hátrányai

  • A legtöbb parallax honlap csak egyetlen hosszú oldal, ahol a képek és az animált elemek elég nehézkesen töltődik be.
  • Egyedi parallax oldalakat nem sokan tudnak csinálni, így aztán jön a vásárolt sablon átszabása, amelynek következtében szinte minden ilyen oldal nagyon hasonlóan néz ki.
  • SEO szempontból sem a legideálisabb, mivel a látványos megjelenés gyakran a tartalom, a szöveg kárára válik.
  • Akadnak még olyan régebbi böngészők, melyek nem támogatják a HTML5-öt, és így nem működik rajtuk megfelelően a parallax design.
  • Nem egy mobil-barát technológia, egyrészt a betöltési sebesség miatt, másrészt nem garantált hogy a mozgatásért felelős scriptek megfelelően működnek mobilokon.

Használjuk mértékkel!

Kétségtelen, hogy az első benyomás egy weboldalon nagyon fontos, így arra, hogy egy kis különlegességet vigyünk bele mindenképpen jó dolog, tehát érdemes használni. Azonban ne feledkezzünk meg arról, hogy az oldalunk célja elsősorban nem “mozi élményt” nyújtani, hanem jobb esetben valamilyen üzletszerzés, értékesítés, eladás. Nem ajánlatos túlhalmozni az animációkat, csak annyit használjunk, ami még nem megy a konverzió, a hatékonyság és betöltési sebesség rovására.

Első körben elegendő, ha csak a kezdő oldaladon van egy-két klassz effekt, de aloldalakon inkább mellőzük. Nagyszerű lehet például olyan honlapokhoz, ahol nincs sok tartalom, márkaoldalak, filmek, játékok, étterem, kávézó, zenekarok, lakberendezés, modell ügynökségek weboldalaihoz.

Nagyszerű, elolvastad! Oszd meg a világgal!

Írta: Pócsik Emese webdesigner

2007 óta dolgozom a design szakmában. Munkáim nagy részét céges weboldalak, portálok tervezése teszi ki. Rólam bővebben »

Iratkozz fel értesítési csatornámra!

Tetszett a bejegyzés? Iratkozz fel csatornámra és küldök Neked E-mail értesítőt, ha ehhez hasonló új cikk kerül fel a blogra.