Параллакс (греч. «смена, чередование») — изменение видимого положения объекта относительно удалённого фона в зависимости от положения наблюдателя. Ну и если проще, то параллакс – видимый сдвиг чего-то в отношении чего-то.

Параллакс прокрутка (параллакс эффект прокрутки) это графический метод, основанный на движении изображений с разными скоростями. Она создает иллюзию глубины путем перемещения графических элементов на веб-странице медленнее, чем скорость прокрутки. С помощью такой прокрутки можно создавать очень интересные небольшие сайты. С параллакс эффектом прокрутки Вы могли столкнуться в видео играх выпущенных в 80-90-х годах (Mario Bros, Streets of Rage, Mortal Kombat, . . .). В таких играх параллакс эффект можно наблюдать в момент, когда несколько фоновых слоев с различными текстурами двигаются с разной скоростью, что создает эффект 3-d пространства. Параллакс эффект (параллакс прокрутка) в дизайне стала чрезвычайно популярной после того, как Nike запустил эту технику на своём сайте “Nike Better World” в 2011 году (с того времени сайт был обновлен и заменен на новый). И это не удивительно, ведь параллакс эффект сделал сайт объёмным.

Однако, как всегда, нужно помнить о принципе золотой середины и не злоупотреблять параллакс эффектом, иначе сайт начинает выглядеть глупо и не красиво. Впрочем, лучше самими взглянуть на примеры сайтов и увидеть параллакс эффект прокрутки в действии.

Примеры сайтов с параллакс эффектом

Dancing with Fruits

Параллакс эффект в веб-дизайне

Данный веб-сайт был неоднократно награжден за выдающийся дизайн. И не просто так, многие называют этот сайт шедевром. И параллакс техника прокрутка занимает важное место в этой композиции, направлен на пропаганду здорового образа жизни.

Andrew McCarthy

Параллакс эффект в веб-дизайне

Анимация бессмертна. B кот в этой конструкции доказывает этот тезис.

Pi’s Epic Journey

Параллакс эффект в веб-дизайне

Сайт представляет собой историю о создании фильма «Жизнь Пи». Вы узнаете все секреты создания и о тяжелой работе которую проделали создатели, чтобы предоставить нам этот кинематографической шедевр.

Every Last Drop

Параллакс эффект в веб-дизайне

Michelberger Booze

Параллакс эффект в веб-дизайне

Boy-Coy

Параллакс эффект в веб-дизайне

iStrategyLabs

Параллакс эффект в веб-дизайне

Открытый космос, 8-битные элементы, летающие тарелки, астронавт – все они включены в этом творческом параллакс сайте.

Flash vs HTML

Параллакс эффект в веб-дизайне

Flash или HTML? Конечно HTML!!!

NASA: Prospect

Параллакс эффект в веб-дизайне

Ophir – The Town That Came In From The Cold

Параллакс эффект в веб-дизайне

Параллакс-прокрутка на этом сайте поможет Вам осмотреть весь город от высоты птичьего полета. Концепция весьма оригинальна.

Savages

Параллакс эффект в веб-дизайне

The Rise and Rise of David Bowie

Параллакс эффект в веб-дизайне

Вам не нравится Дэвид Боуи? Ну и ладно. Однако его карьера, особенно эволюция его сценических образов, является исключительным. Этот веб-сайт представляет его в довольно привлекательном виде, используя прокрутку параллакса.