Мобильный сайт, мобильное приложение или адаптивный дизайн? Что выбрать?

У вас есть сайт – и он невероятно красив на вашем персональном компьютере или ноутбуке. А заходили ли вы на него с мобильного устройства, например с планшета или телефона? Насколько он удобен при этом?

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

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

Реальность такова, что уже 30 % пользователей Рунета для выхода в Интернет используют телефоны и планшеты.

Не секрет, что если пользователю не комфортно на сайте, он уйдет. Так как же не потерять этих клиентов? Вариантов тут два.

Первый – сделать свой сайт адаптивным. Второй – реализовать мобильную версию сайта. Рассмотрим каждый из этих вариантов более подробно.

Адаптивный дизайн сайта

Подход состоит в том, что сайт (его дизайн и верстка) изначально разрабатывается так, что он подстраивается под различные размеры (расширения) экрана.

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

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

Наш сайт является адаптивным – попробуйте!

Плюсы адаптивного дизайна:

• Простота разработки при стандартной реализации. То есть функциональная часть (структура сайта, его наполнение) остается неизменной – изменяется только способ представления этой информации пользователю.
• Поддержка такого сайта не сложная, так как не нужно думать о синхронизации информации для мобильной и основной версий. Как говорилось ранее, информация едина – меняется только способ ее отображения.
• Единый адрес сайта (URL) — избавляет пользователя от необходимости запоминать адрес мобильной версии (даже если это просто приставка m.).
• Наличие единого адреса положительно сказывается на продвижении вашего сайта в поисковых системах.

Но наравне с плюсами есть существенные минусы такого подхода:

• Задачи мобильных пользователей отличаются от задач пользователей ПК. Мобильного пользователя интересует ограниченный объем информации — адреса, телефоны. А так как адаптивная версия повторяет функционал основного сайта, то он получит лишнюю для него информацию (каталог товаров, новости и так далее), которая может создать ему неудобства при использовании вашего сайта.
• Медленная скорость загрузки. Скорость мобильного Интернета часто очень низкая. Таким образом, для мобильных устройств желательно максимально «облегчать» страницы сайта. Значит, некоторые типичные для десктопных сайтов элементы – ролики, калькуляторы и меню с анимацией – должны быть заменены на более легкие альтернативы. Так, анимационное меню заменяется на статичное, флеш-баннеры – на их гиф-версии, калькуляторы можно упростить, ролики – вообще убрать. Адаптивный дизайн не всегда дает нам возможность это сделать, что пагубно отражается на скорости загрузки сайта.
• Отсутствие выбора. Одно из главных преимуществ мобильной версии: если она не нравится пользователю, ее можно отключить, перейдя на обычную версию. Сайты с адаптивным дизайном не дают этой возможности. Если адаптированная версия неудобна или она скрывает важный элемент навигации, ваш клиент уйдет - и, скорее всего, к вашим конкурентам. Чтобы этого избежать, нужно продумывать все варианты, тестировать и грамотно адаптировать сайт.

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

Отдельная мобильная версия сайта

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

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

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

Плюсы мобильной версии:

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

Минусы мобильной версии:

• Наличие нескольких адресов (URL). Для основной и мобильной версии используются разные адреса. Этот факт может создать проблемы для продвижения ваших сайтов, которые, впрочем, решаемы, если работу доверить профессионалам.
• Ограниченность подачи контента. Создание мобильного сайта означает избавление от части содержимого и функциональности.
• Синхронизация данных. Меняя информацию на основной версии сайта, нужно все время помнить, что ее нужно поменять и в мобильной версии, иначе ваш клиент будет введен в заблуждение. Во избежание таких ситуаций могут быть настроены различные проверки и синхронизации мобильного и основного сайтов.

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

Выводы

Подводя итоги, можно сказать следующее:

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


2. Есть два подхода к мобилизации вашего сайта: подстроить уже существующий, сделав его адаптивным, или разработать еще один упрощенный сайт (мобильную версию сайта).


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

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

Если у вас сайт-визитка, основное предназначение которого – дать пользователям в Интернете информацию о вас, не нагруженный какой-то анимацией, - то, скорее всего, для вас идеально подойдет адаптивный дизайн.

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

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

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

Оставайтесь с нами!

Источник фото: © depositphotos.com/ bagiuiani, digitalstorm, alexey_boldin, Syda_Productions, Rawpixel