10 нояб. 2015 г.2 мин.
Пост обновлен 30 янв. 2019 г.
Параллакс-прокрутка — очень простой и выразительный способ придать сайту дополнительную глубину. Даже если вы никогда о нем не слышали, то наверняка видели, и не раз. Благодаря этому эффекту сайт воспринимается не плоским, а объемным, как 3D-кино. Хорошие новости: в новом редакторе Wix такой эффект делается за считанные минуты. Для тех, кто не уверен, что к чему, мы решили провести «ликбез по параллаксу» и рассказать все, что знаем сами.
Честно говоря, это громкое название довольно простой идеи. Суть ее в том, что при прокручивании страницы фон двигается медленнее, чем все остальные элементы. И несмотря на такое простое объяснение, смотрится это очень впечатляюще. Интересно? Хотите попробовать? Тогда следующие советы — для вас:
Эффект параллакса оживляет именно процесс прокрутки, поэтому мы рекомендуем его владельцам сайтов с длииииинной прокруткой. Сайт Kuppa Coffee — отличный тому пример.
Принцип «лучше меньше да лучше» уместен и в жизни, и в веб-дизайне. Параллакс-прокрутка штука классная, главное — знать меру и не добавлять ее на все страницы подряд. Сперва решите, на чем хотите сделать акцент, а уже потом приступайте к работе над сайтом. Руководствуясь этим же принципом, на передний план можете добавить элементы с прозрачным фоном. При прокрутке они будут двигаться, а пользователи — удивляться.
Для того, чтобы не переборщить с эффектами, вам пригодятся «Полоски» — новая функция редактора Wix. Эффект параллакса можно добавить не на всю страницу, а на некоторые блоки, чтобы они воспринимались как наиболее важные. Удобно, когда нужно привлечь внимание посетителей к определенной части контента.
Появление различных эффектов при прокрутке — лучший способ удержать внимание человека и сделать так, чтобы он досмотрел страницу до конца. Используйте эту фишку и удивляйте посетителей медленно раскрывающейся историей.
Для большей выразительности можно добавить слой с параллакс-прокруткой поверх видео. Не так давно мы рассказывали, как это делается.
Текст в сочетании с эффектом параллакса вызывает ощущение, что буквы волшебным образом парят над фоном. Это выглядит интересно, пользователи увлекаются и дочитывают написанное до конца. Если текста много, попробуйте разбить его на блоки и разнести по сайту с помощью «Полосок». Организованный и оформленный контент читается гораздо легче.
Разумеется, вы не обязаны следовать нашим советам так, словно они высечены на скрижалях. Пробуйте, смотрите, что получается, и делайте так, как нравится прежде всего вам.
Зайдите в редактор и выберите «Фон» в левой панели.
Нажмите на кнопку «Настройки».
В «Эффектах прокрутки» выберите «Параллакс».
А вот несколько новых шаблонов со встроенной параллакс-прокруткой:
Готовы испробовать эффект параллакса на деле? Зайдите в свой аккаунт и начинайте творить! Если у вас еще нет сайта на Wix, никогда не поздно начать. Откройте один из наших бесплатных шаблонов в редакторе, и создайте свой сайт — своими руками!