The parallax scrolling effect is a design technique that’s relatively new in development and web design. Over the past few years since it’s hit the scene though, it’s grown pretty popular in its own right, and with good reason, too.
패럴랙스 스크롤링의 정의
Parallax scrolling is a technique wherein your web page’s background image scrolls at a slower rate compared to the foreground image. It gives the user a unique sense of depth and action while scrolling through a page when used on a website.
Without Parallax Scrolling
The elements of the web page – the text, images, buttons, etc – all scroll at the same rate as the background.
With Parallax Scrolling
The background image scrolls at a different rate as the rest of the elements in the page.
패럴랙스 스크롤링이 사용자에게 미치는 영향
하지만 이 기법은 완전히 새로운 것은 아니며, 실제로 1920년대 초부터 전통적인 애니메이션에 사용되어 왔습니다. 또한 슈퍼 마리오 브라더스와 같은 수많은 클래식 비디오 게임에서도 사용되었습니다.
하지만 웹 디자인 영역에서는 나이키가 2011년에 패럴랙스 스크롤링을 최초로 도입한 대표적인 주자로 꼽히곤 합니다. 그 이후로 “패럴랙스 스크롤링”(때로는 “패럴랙스 배경”이라고도 불림)이라는 용어는 디자이너와 개발자 모두에게 익숙한 용어가 되었으며, 그 인기가 꾸준히 상승하고 있습니다.
Parallax scrolling as used in a version of Super Mario Brothers. Notice how the hills in the background move
in slightly varying speeds, as compared to Mario and the other characters in the foreground.
사용자가 얻을 수 있는 이점
이 효과의 큰 장점은 사용자가 웹사이트와 상호 작용하도록 유도하여 상호 작용성과 매력을 모두 높여준다는 것입니다. 그리고 제대로 활용하면 패럴랙스 스크롤링은 가장 단순한 웹사이트에도 생명력을 불어넣을 수 있습니다. 심지어 사이트 방문자의 시선을 즉각 사로잡는 놀라운 내러티브를 만들어내는 데도 사용될 수 있습니다.
여러분의 작업을 공유해 주세요!
여러분은 어떻게 생각하시나요? PBS v4의 최신 패럴랙스 배경 기능을 이미 사용해 보셨나요? 만족스러운 효과를 보고 계신가요? 여러분의 작업물 링크를 공유하거나 아래 댓글 섹션에 의견을 자유롭게 남겨주세요.
즐거운 사이트 제작 되세요!