Очень явно выраженный рост mobile трафика и все более частое открытие браузеров для серфинга в интернете через гаджеты стимулирует спрос на качественные онлайн-ресурсы для карманных устройств. Обычные версии сайтов для ПК зачастую на мобильных устройствах с малым экраном работают некорректно, если не предусмотрен специальный алгоритм для отображения элементов верстки. Полное представление, чем отличается мобильная версия сайта от адаптивной, дает возможность понять и выбрать лучший способ презентации онлайн-ресурса для аудитории с современными девайсами Apple, Android, Windows Phone.
Считается, что при показателе посещения через гаджет 15% аудитории ресурса, ему жизненно необходима адаптация под смартфоны. Качество подачи контента мобильному пользователю также важно для ранжирования сайта в поисковиках. Машины оценивают показатель mobile-friendly (грубо говоря, удобства ресурса) по таким основным критериям:
страницы не нужно масштабировать, вручную увеличивая отдельные части экрана для чтения;
нет необходимости использовать горизонтальный скроллинг – информация по ширине помещается в рамки экрана;
не допустимы элементы флеш-анимации или плагины, которые не загружаются в мобайл и «ломают» архитектурную задумку страницы;
кнопки, ссылки, ползунки не должны слишком тесно располагаться друг другу, так как нажимать на сенсорный экран с маленькими деталями очень неудобно.
Перечисленные проблемы устраняют оба формата для гаджетов. Адаптивный веб-сайт способен автоматически подстраивать размеры своих элементов под ширину и высоту дисплея планшета, смартфона, ноутбука. Код страницы имеет прописанные размерные варианты отображения иллюстраций и блоков. Они меняются для разной ширины экрана либо контент сжимается в пропорции сужения дисплея.
Мобильная версия – это более сложный подход. Смысловая и целевая концепция сайта сохраняется, но для нее пишется отдельный программный код. Порядок элементов, их пропорции, навигация, структура страниц и дизайн может в корне отличаться от полной лаптопной версии, но чаще всего 99% функций и контента сохраняется.
Взвешиваем за и против самодостаточной мобильной версии
Зная, чем отличается мобильная версия сайта от адаптивного дизайна, можно принять самое верное решение для правильной подачи информации пользователям. Версия mobile – это индивидуальный, специально разработанный шаблон на отдельном поддомене. Он наполнен тем функционалом, который больше всего нужен потенциальному клиенту или гостю.
Очевидные преимущества, из-за которых выбирают мобильную версию:
- простота внесения коррективов – шаблон для mobile можно изменять, дополнять, урезать без внесения правок в основной (полный) веб-сайт для компьютера;
- удобная навигация и кнопки – явные плюсы для тех, кто хочет быстро управлять навигацией на крупных кнопках, специальных выпадающих меню без надобности прокручивать целые страницы или увеличивать в масштабе отдельные части блоков;
- лучшая скорость – упрощенный адаптированный код шаблона загружается гораздо быстрее, чем емкий, насыщенный функционалом и лишней (для мобайл) рекламой и анимацией десктопный вариант;
- возможность, по желанию, вернуться к привычной десктопной версии.
Недостатки данного способа загрузки контента на гаджетах – это отдельный URL и ошибки, которые могут возникать при переходе на конкретные глубинные, внутренние страницы обыкновенной версии через mobile browser. Ссылки на десктопный формат в поисковике при автоматическом переходе на версию m.адрес могут не содержать привязанной в мобильном шаблоне аналогичной информации и выдавать ошибку.
Подчет минусов и плюсов – ожидания от адаптивной верстки
Сравнивая адаптивную верстку vs мобильную версию по затратам сил и бюджета, первый вариант, однозначно, экономнее. Плюсы адаптивного дизайна
- достаточно внести коррективы в основной код, чтобы структура сама подстраивалась под размеры девайса, так же, как и под параметры окна в браузере;
- один URL исключает проблемы с индексацией контента для поисковиков и с запоминанием новых адресов для пользователя;
- любая статистика и анализ ведется по одному источнику.
Разработку отдельных мобильных версий многие предпочитают из-за долгой загрузки верстки, адаптированной под гаджеты. При слабом интернете емкий ресурс медленно загружается, процесс может обрываться, и страницу нужно заново обновлять. Впустую тратится платный трафик мобильного интернета на считывание ненужных скриптов и простыней HTML-кода. Посетителям, привыкших широкоформатному интерфейсу, не дается право выбора – они вынуждены просматривать только компактную версию, с другим, непривычным расположением блоков.
Динамический показ (RESS) – популярный вид адаптивного дизайна
Альтернатива, что лучше, простой адаптивный дизайн или мобильная версия сайта, может разрешиться одним популярным способом адаптации сайта – RESS. Это улучшенная разновидность многовариантной верстки с адаптацией. Формат отображения элементов задается на более глубоком уровне – это не просто заданное процентное соотношение блоков с размером экрана. Сначала определяется тип устройства, с которого заходит юзер. Мгновенно для браузера запускается тот вариант кода, который соответствует характеристикам устройства
Плюсы такого метода адаптации под ОС и формат гаджета:
- один и тот же контент при входе через любой девайс;
- разграничение продуктов для iOS и Android (к примеру, после распознавания устройства сервером, на сайте будет располагаться соответствующая ссылка для загрузки приложения под конкретный смартфон);
- HTTP-заголовок Vary положительно влияет на оценку параметра mobile-friendly у поисковых машин;
- автоматическое отключение блоков с определенным кодом для разных десктопов и лаптопов к примеру, в полной верстке для ПК может быть анимация JavaScript, а в мобильном ее не будет, для дополнительно разгрузки трафика).
Поскольку для эффективного адаптивного дизайна RESS нужно пользоваться сервисом определения устройств и увеличивать нагрузку на сервер, данный способ подстройки под мобайл не из дешевых. Для корректировки отдельно контента под владельцев Айфона и гаджетов на Андроид придется хорошо потратиться.
Окончательное решение в пользу адаптивной разметки или версии mobile
Однозначно разграничить критерии решения в пользу адаптивного дизайна или мобильной версии сайта нельзя. Нужно проанализировать целевые особенности отдельно взятого ресурса, изучить целевую аудиторию и то, насколько хорошо будет удовлетворен пользовательский опыт. Для принятия решения рекомендуется учитывать такие факторы:
с каких типов устройств приходит основная масса посетителей (к примеру, современные узкоспециализированные блоги, к примеру, про спортивное питание, имеют больше лидов со смартфонов);
коммерческая или иная специализация сайта (если это ресурс для покупки специализированного медицинского оборудования, либо B2B проект, его гораздо чаще посещают со стационарного ПК или ноутбука);
продвижение продукции для смартфонов или устройств определенного типа (если это интернет-магазин аксессуаров для Айфон, логично, что основной приток посетителей будет через Айфон);
масштабы главного сайта (если речь идет о крупном проекте с множеством мелких кнопок, которые отлично управляются мышкой на ноутбуке, уменьшение навигации в размере сделает неудобным весь интерфейс).
Адаптивная верстка благотворно влияет на поведенческие факторы главного сайта, лучше подходит для его продвижения. Небольшим проектам, однозначно, лучше использовать этот не слишком затратный вариант. Версию мобайл рекомендуют для крупных проектов, и в то же время такой выбор обеспечивает лучший опыт для пользователя и даже иногда меняет отношение к продукту, вызывая больше доверия.
