Федулина Елена Геннадьевна
+7 (921) 755 62 74
Звоните прямо сейчас
Site registration
Register your website right now.
Register website
Social networks
Делаем сайт стильнее с помощью параллакс эффекта

Делаем сайт стильнее с помощью параллакс эффекта

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

August 17, 2016 at 12:01 pm

Что это?

Сама идея параллакс эффекта достаточно проста - при прокрутке страницы, фон двигается медленнее чем все остальные детали, это дает определенный 3D эффект - иллюзию трехмерного пространства. Выглядит креативно и привлекательно при этом не требует много ресурсов со стороны программной части. Забегая вперед, следует сказать что в конструкторе IQSites этот эффект можно поставить в один клик и настроить его как душе угодно : )

Как выглядит?

Вот несколько наглядных примеров использования параллакса:

- thisisuncoated.co.uk
- http://otivana.com
- risenchurch.com
- kuppacoffee.uk

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

Делаем сайт стильнее с помощью параллакс эффекта

Как уместно использовать параллакс?

Как и с любыми другими эффектами на сайте, чувство меры не помешает и в данном случае. Параллакс эффект в большинстве случаев отлично смотрится на первом экране в сочетании с какой либо профессиональной фотографией, причем фон может быть как насыщенным так и белым (отличный пример - kuppacoffee.uk, где чашка кофе эффектно перемещается вместе со скроллингом). Можно пробовать чередовать секции (1 с эффектом, другая без и так далее), стоит отталкиваться также от тематики сайта.

Делаем сайт стильнее с помощью параллакс эффекта

Как сделать такое на IQSites?

Как уже говорилось выше, очень легко :) Можно не просто закрепить фон, но и выбрать степень закрепления:

Делаем сайт стильнее с помощью параллакс эффекта

Это и позволит добиться нужного эффекта, экспериментируйте!

Делаем сайт стильнее с помощью параллакс эффекта

Кстати впереди еще много новых эффектов и прибамбасов в нашем конструкторе и пёс с картинки выше в курсе об этом, следите за обновлениями ;)



Подписка на обновления блога
Хотите оперативно получать новости и полезные материалы из блога? Просто заполните форму ниже.
Вы сможете отписаться в любой момент.
* To be filled in
I Agree To Terms of Service

More articles

Website for Royal Habit. The Highest Concentration of Unsurpassed Taste.
Website for Royal Habit. The Highest Concentration of Unsurpassed Taste.
Из чего состоит идеальная контактная страница?
Из чего состоит идеальная контактная страница?
Open Up Your Creativity to the World on Behance.
Open Up Your Creativity to the World on Behance.

Go up
array(5) { ["id"]=> int(0) ["ip"]=> string(12) "3.226.243.10" ["language"]=> string(2) "en" ["gmt"]=> int(0) ["guest_id"]=> string(32) "da18df47b1fda848109bc8ce975bdfb9" }