PROIECTARE DE SITE-URI
Ce este Parallax Scrolling?
Parallax scrolling este o tehnică de grafică de web design în care imaginile de fundal se mișcă într-un ritm mai lent decât primul plan, creând iluzia unui efect 3D de profunzime pe măsură ce vizitatorii derulează în jos pe pagina web. Tehnica a luat naștere din tehnica camerei multiplane folosită în animația tradițională încă din anii 1930.
Paralaxa se bazează pe iluzie optică. Deoarece ochiul uman percepe obiectele care sunt aproape de noi ca fiind mai mari decât cele mai îndepărtate, noi percepem obiectele îndepărtate ca și cum s-ar fi mișcat mai încet.
Iluzia a fost mult timp adoptată în paralaxă în diferite medii, favorizând un efect realist. Prima sa utilizare a fost în animația tradițională, datând încă din Albă ca Zăpada de la Disney și cei șapte pitici și în jocuri video precum Super Mario.
Odată cu progresele în CSS și HTML, efectele de paralaxă au evoluat mai târziu în lumea designului web așa cum o cunoaștem astăzi.
Paralax scrolling este o tehnică specială de defilare utilizată în design web, în care imaginile de fundal pe o pagină web se mișcă mai lent decât imaginile din prim-plan, creând o iluzie de profunzime pe un site bidimensional.
Este una dintre cele mai utilizate tehnici de design în web design în acest moment, dar și ceva de care probabil nici nu realizezi că ai experimentat deja.
Este o mișcare simplă cu care sunteți deja obișnuiți și care a ajutat să facă multe site-uri web să se simtă dinamice și interactive.
Dacă alegeți să îl utilizați, este important să vă gândiți la modul în care paralaxa ar putea afecta și experiența mobilă. Pentru a crește viteza site-ului și pentru a nu încălca prea mult gradul de utilizare pe mobil, se recomandă fie să reduceți derularea paralaxă, fie să o eliminați complet.
Nu uitați să vă gândiți la toate situațiile în care ați dori să îl utilizați mai întâi și la modul în care trebuie ajustat pentru utilizatorii de pe mai multe dispozitive.
Află mai multe aici.
Link suplimentar:
[optin-monster slug=”em8z7q6hga9elmy1dbgb”]