Что такое адаптивные сайты и для чего они нужны?

В наш технический век мир меняется с огромной скоростью, и то, что еще вчера было новинкой, сегодня устаревает и перестаёт работать. Это происходит и с сайтами. Всего за несколько лет интернет на 70% перебрался в мобильный телефон, но многие сайты не успели последовать за ним.

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

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

Можно ли переверстать старый сайт и добавить к нему адаптивность? В некоторых случаях — да, но, в большинстве, эта работа займёт в разы больше времени, чем создание нового сайта. Часто задача решается написанием новой темы оформления для вашей CMS (WordPress, Opencart и т.д.). Но и в этом случае может потребоваться серьёзная переработка контента, так как, например, табличные данные (а таблицы бывают очень широкими) сами собой не смогут перестроиться под новую версию и нужно будет искать новый способ предоставления этих данных.

С точки зрения SEO-оптимизации, в том случае, если сайт имеет высокие позиции в поиске, лучше подойдет создание новой (адаптивной) темы оформления с некоторой корректировкой контента, где это потребуется. Это позволит сохранить прежние адреса страниц, которые уже знает Яндекс или Гугл. Если же сайт находится в поиске достаточно низко, на третьей или десятой странице, то правильнее будет создание полностью нового сайта взамен старого.

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

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

Адаптивный дизайн или мобильная версия?

Что такое мобильная версия, и в чем её отличие? Мобильная версия представляет из себя отдельный сайт, который находится на поддомене. Например, если основной сайт находится по адресу site.ru, то мобильная версия будет иметь вид m.site.ru. Вам придется заказать два сайта. Адаптивный же сайт находится по одному неизменному адресу, и просто подстраивается под размеры экрана.

Как работает мобильная версия? Пользователь набирает адрес сайта, после чего система должна определить устройство, и если это телефон, переадресовать на мобильную версию. Всё это время посетителю приходится ждать.
Также перенаправление не всегда может работать корректно, так как некоторых (новых или редких) моделей телефонов или браузеров может не быть в базе. Поэтому, нужно постоянно поддерживать и обновлять базу новых мобильных устройств, которые появляются с большой скоростью. Поддержание такой базы в актуальном состоянии требует большой работы.

Как администрировать сайт с мобильной версией? Это зависит от устройства сайта, наличия интеграции версий. У них может быть единая база и публикации сразу появляются в обеих версиях, но в таком случае теряется суть версии для телефонов, ведь загружаемые фотографии и тексты будут весить одинаково. Поэтому более уместна раздельная публикация для разных вариантов сайта. Но и в этом могут появиться другие сложности, например, несовпадение содержания, наличие страницы в одной версии и отсутствие в другой и т.д. Это сильно пошатнет позиции сайта в поисковой выдаче. Сложность (и, как следствие, стоимость) поддержки таких сайтов получается выше.

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