Мобильная версия сайта — это отдельный сайт, который адаптирован под просмотр и работу через мобильные устройства. Она соответствует контенту основного ресурса, однако уступает приложению по функционалу (нет пуш-уведомлений, синхронизации с гаджетом) и скорости (это из-за зависимости от инетрнета) (о различиях читайте в этой статье).
Если нет надобности в сложном бэкенде и возможности переработать сайт или создать приложение, то мы рекомендуем остановиться на мобильной версии . Поскольку главная цель разработки — охватить аудиторию с гаджетами, не забывайте, что поисковые алгоритмы предъявляют собственные требования. Разбираемся!
Какой должна быть мобильная версия сайта?
- Собственный URL — создавая мобильную версию сайта, позаботьтесь об особенностях размещения. Важно, чтобы поисковые алгоритмы понимали отличали ресурсы — для этого либо поместите мобильную версию в раздел сайта и укажите это в меню, либо разместите на отдельный поддомен (последний вариант предпочтительнее).
- Динамический показ — чтобы не прогадать с разрешением мобильного устройства или планшета, рекомендуем настроить динамический показ (один URL с несколькими кодами HTML и каскадной таблицы стилей). Для этого в http прописывается специальный заголовок “Vary” — не решит проблемы с масштабируемостью и позволить адекватно отобразить содержание.
- Настройка редиректа понадобится, чтобы после определения источника трафика вело за собой показ нужной версии контента — для этого в заголовке “Vary” указывается “User-Agent”. Благодаря этому действию сервер перенаправляет мобильного пользователя на мобильный формат.
- Адаптированная под мобильные устройства верстка сайта, принцип работы который легко объяснить следующим образом. HTML-код (одинаковый для устройств) передается сервером, однако отображение стилей CSS варьируется — так интерфейс самостоятельно оптимизируется и адекватно выглядит на каждом устройстве.
- “Легкие” изображения — поскольку показ содержимого на мобильной версии зависим от скорости интернета, то обязательно оптимизируйте визуальный контент. Не размещайте длинные видео или “тяжёлые” картинки — лучше дайте линки на контент или реализуйте возможность скачать материал. И никаких Flash-элементов, которые уже давно не отображаются на гаджетах. Если нужна анимация, то доработайте её на HTML5.
- Большие кликабельные кнопки важны, так как чаще всего невозможность попасть в графический элемент (или не заметить!) приводит к высокому проценту отказов и падению конверсий. выделите их ярким цветом или обводкой, дайте им название и размещайте так, чтобы они бросались в глаза.
- Удобство и продуманность навигации одинаково важно как в случае, когда ведется разработка приложений для Android или iOS, так и для мобильной версии. Помните, что в телефоне перемещаться по страницам сложнее, поэтому распишите понятный и экономный по времени сценарий, когда пользователь получит то, что нужно, совершая 2-3 перехода максимум. Больше информации вы получите после аудита тестировщика и юзабилити-специалиста, передав им на аудит готовое решение.
- Ввод текста и данных — поле для текста — проблема 80% мобильных версий сайтов. Зачастую его трудно найти, а потом сложнее указать то, что нужно — без адаптивной верстки такое поле постоянно пропадает и ввести данные невозможно. Чтобы этого не было, сделайте масштабируемые поля, внедрите подсвечивание обязательных полей и добавьте графические элементы для подсказки.
- Оригинальный контент — правильно настроив редиректы и указав атрибуты, можно убедить поисковые системы в том, что вы размещаете заимствованный с собственного сайта контент, однако и это не гарантия попасть под бан. Правильное решение — написать подводки для мобильных устройств и разместить ссылки, отправляющие на статьи сайта.
- Ссылка на полную версию сайта — обязательный элемент, о котором забывают многие программисты. Выход на полную страницу позволяет “подстраховаться”, если что-то не сработает в мобильной версии или источник трафика определяется неверно. Не стоит забывать об этом действии и тогда, когда ведется разработка приложений для iPhone или Android — оставляйте за пользователем право выбора.
Итог
В попытках увеличить трафик, конверсии и попасть в тренд клиенты за решениями в области Mobile. Помимо сложных приложений с несколькими функциями вы всегда можете выбрать мобильную версию сайта, которая станет доступным по деньгам и результативным решением без потери трафика и конверсий. Главное — реализовать с умом и с помощью грамотной и опытной команды.
