Адаптивный лендинг пейдж - какой он?

Адаптивный лендинг пейдж - какой он?

Дата:
Тема:Разработка

Об адаптивных лендингах наверняка слышали все. Но четкое понимание, что на самом деле они собой представляют, есть далеко не у каждого. Некоторые ошибочно путают адаптивность с «резиновой» версткой, при которой блоки меняют свою ширину в зависимости от размера окна браузера.

Различие между ними состоит в следующем:

  1. В мобильном браузере сайт масштабируется под размеры дисплея, чтобы им было удобнее пользоваться именно с вашего устройства. 
  2. Отдельные детали на адаптивном сайте созданы с учетом удобства использования на мобильных, т.е. значительно увеличены в размерах.
  3. Разработка адаптивного сайта более дорогостоящая и трудозатратная, чем обычная верстка.

Удобство и выгоды адаптации страниц

Чаще всего при разработке дизайна лендинга ориентируются на следующие разрешения экрана монитора, измеряемые в пикселях (px):

1920х1080 px

1440х900 px

1360х768 px

1280х800 px

1024х768 px

768х1024 px

480х320 px

320х240 px

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

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

Благодаря адаптивности отпадает и необходимость прокрутки страницы сверху вниз, слева направо и обратно. А это значит - минус раздражающий посетителей фактор плюс возможность нормального восприятия информации. В конечном счете, адаптация способствует выработке доверия и лояльности к осуществлению контакта и заказу товаров или услуг.

Спрос на адаптивность

С появлением технологий адаптивности больше не нужно отдельно заказывать разработку мобильной версии сайта: лендинг может одинаково удобно просматриваться как на мобильных устройствах так и на обычных компьютерах.

Сайты, которые адекватно отображаются на экранах любых устройств, получили специальное название mobile-friendly.

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

Еще одним условием, стимулирующем спрос на адаптивные лендинги, являются новые требования поисковых систем.

В поисковой выдаче степень показа таких адаптивных страниц примерно на 23% выше, чем неадаптированных.

В то время как доля нахождения в мировой сети неадаптивных сайтов уменьшается.

21 апреля 2015 года в Google официально сообщили о запуске нового алгоритма ранжирования, который оценивает сайт на предмет адаптированности под мобильные устройства, и понижает в выдаче сайты, которые не mobile friendly.

С официальным текстом сообщения, при отсутствии языковых барьеров, можно познакомиться по ссылке

С февраля 2016 года крупнейший российский поисковик Яндекс (с новым поисковым алгоритмом Владивосток) объявил о фильтрации в мобильной поисковой выдаче не оптимизированных для планшетов и смартфонов веб-страниц. Еще осенью Яндекс начал выявлять удобные для мобильных пользователей страницы и помечать их тегом “мобильная версия”.

Яндекс сообщает, что не корректно отображаемые сайты будут продолжать появляться в поисковой выдаче. А вот ее результаты на компьютере и телефоне будут очень заметно отличаться. В пользу именно тех сайтов, которые позаботились об оптимизации своих страниц под различные устройства.

Как проверить, оптимизирован ли ваш лендинг под мобильные?

По ссылке рекомендации Google, тут же в меню есть пункт проверка, можете проверить и посмотреть рекомендации

Самое время сделать свой одностраничный сайт адаптивным

Итог, почему нужно делать лендинг адаптивным или покупать готовый одностраничник с адаптивным дизайном, ответы просты и очевидны, а именно:

  • Сайт лучше ранжируются в Google и Яндекс (не снижаются позиции в выдаче для мобильных).
  • Меньше процент отказов.
  • Лучше конверсия по сайту в целом