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

Параллакс (греч. «смена, чередование») — изменение видимого положения объекта относительно удалённого фона в зависимости от положения наблюдателя. Ну и если проще, то параллакс – видимый сдвиг чего-то в отношении чего-то.
Параллакс прокрутка (параллакс эффект прокрутки) это графический метод, основанный на движении изображений с разными скоростями. Она создает иллюзию глубины путем перемещения графических элементов на веб-странице медленнее, чем скорость прокрутки. С помощью такой прокрутки можно создавать очень интересные небольшие сайтики.
С параллакс эффектом прокрутки Вы могли столкнуться в видео играх выпущеных в 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

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

* * * * *

Tag Reaction

 

* * * * *

Cyclemon

Хотите выбрать велосипед? Этот веб-сайт будет поделиться с вами всеми видами велосипедов, которые можно увидеть на улицах. Немного юмора прилагается.

* * * * *

Every Last Drop

 

* * * * *

Michelberger Booze

 

* * * * *

Boy-Coy

 

* * * * *

iStrategyLabs

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

* * * * *

Flash vs HTML

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

* * * * *

Steven and the Unique Horn

 

* * * * *

NASA: Prospect

 

* * * * *

Ophir – The Town That Came In From The Cold

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

* * * * *

Savages

* * * * *

The Rise and Rise of David Bowie

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