Почему каждому бизнесу нужен мобильный сайт

Всеобщая «мобилизация» навсегда изменила модель поиска и потребления информации. Специалисты компании Google отметили, что человек проживает свой день «микромоментами», возникающими в реальном времени: что сделать, где купить, как найти, сколько стоит и так далее. Это приводит к импульсивному поиску информации и принятию решений при помощи мобильного устройства, которое всегда под рукой. Поэтому для компаний критически важно отвечать на такие запросы максимально быстро и в доступной форме. Адаптация сайта и его контента под модель «микромоментных» взаимодействий — главная задача в интернет-стратегии современного бизнеса.

Отличия десктопного и мобильного сайта

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

Для мобильного сайта, который просматривают на бегу, в условиях быстрой смены обстановки, важны:

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

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

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

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

Например, описанные отличия хорошо заметны на разных версиях сайта change.org (Рис. 1): полная десктопная версия с широким функционалом и лаконичная мобильная с акцентом на самом главном.

Рис. 1. Один и тот же сайт имеет отличия в отображении контента на разных устройствах

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

Единственная версия сайта сегодня — моветон, об этом напоминают и представители поисковых систем. Игнорировать мобильных пользователей больше невозможно — их доля значительна и по разным оценкам составляет от трети до половины посетителей сайтов разных тематик. Google отреагировал на глобальную «мобилизацию»: в 2014 году введена маркировка в результатах поиска сайтов, имеющих мобильную версию, в апреле 2015 года запущен новый алгоритм ранжирования в мобильном поиске. Яндекс поддержал тренд в феврале 2016-го.

Теперь предпочтение в мобильном поиске отдается сайтам, адаптированным для просмотра на смартфонах (Рис. 2), и вот какие требования к оптимизации предъявляют оба ведущих поисковика:

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

Проверить уровень мобильной оптимизации сайта можно в Яндекс.Вебмастере (необходимо иметь доступ к аккаунту) и с помощью открытого инструмента Google.

Рис. 2. Яндекс показывает, какие сайты могут занять достойное место в ТОПе мобильной выдачи

Исследование взаимосвязи мобильной адаптации и позиций в мобильном поиске

Доля мобильного трафика в Рунете каждый год растет на 5%, при этом доля неоптимизированных под телефоны сайтов в мобильном ТОП10 уменьшается на 4%. Наблюдаем практически прямую зависимость. Отставание в 1% связано, в первую очередь, с нехваткой сайтов, оптимизированных под мобильные устройства. Можем сделать вывод, что с ростом мобильного трафика растет и доля адаптивных сайтов в мобильной выдаче.

Аналитики SeoPult задались целью провести собственное исследование: в какой степени мобильность сайта влияет на его видимость в мобильном поиске. Были получены две выборки сайтов в Системе: оптимизированные и не оптимизированные под мобильные устройства. Распределение оказалось следующим: оптимизированных сайтов — 17%, не оптимизированных — 83%. Картина плачевная.

Далее мы проанализировали, какую видимость в Системе имеют сайты из выборки. Получили результаты, отраженные в таблице ниже (Рис. 3) (видимость смотрелась по основной поисковой системе, указанной в профиле проектов).

Рис. 3. Адаптированные сайты имеют лучшую видимость в мобильном поиске

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

Новый функционал для мобильных сайтов в SeoPult

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

Очень многие сайты оказались вне ТОП10 мобильной выдачи, а значит, вне поля зрения мобильных пользователей. Хотя могли получать мобильный трафик и работать на рост конверсий (Рис. 4).

Рис. 4. Монитор изменения позиций сайта в десктопной и мобильной выдаче Яндекса и Google

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

Методы оптимизации сайта под мобильные устройства

В целом можно выделить два подхода к адаптации существующего сайта:

создание отдельного ресурса на новом домене (например, m.site.ru);

подгонка под экран смартфонов существующей версии.

Об этих способах реализации мы писали в выпуске рассылки «Техники мобильной адаптации сайта».

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

У адаптивного дизайна есть разновидность — «responsive design» («отзывчивый дизайн»). Он сочетает в себе возможности адаптивной и так называемой «резиновой» верстки, используемой для десктопных сайтов. Благодаря этому удается еще более удачно вписать контент в рамки мобильного экрана. С примерами реализации можно ознакомиться здесь.

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

Какой метод оптимизации выбрать? Здесь нет однозначного ответа. У каждого способа есть сторонники и противники. Одни утверждают, что отдельная версия — это лучшее решение. Можно сделать идеальный мобильный сайт, отбросив все ненужное и тотально переделав интерфейс взаимодействия. Другие им отвечают, что это дополнительные трудозатраты, необходимость поддерживать сразу два сайта и разумнее использовать адаптивный дизайн.

Метод	Плюсы	Минусы	Кому подходит
Отдельная версия	Отказ от ненужных компонентов сайта; оптимизация под задачи мобильной аудитории (дает более высокую конвертацию); автономность разработки; невысокие финансовые затраты; старый сайт остается нетронутым.	Два разных URL; работа с двумя наборами контента и кода; не адаптирован к другим устройствам (планшет, телевизор); риск появления дублированного контента; необходимость продвигать отдельный сайт.	Малому бизнесу с небольшим бюджетом; когда нет технической возможности переделать текущий сайт; статичным сайтам с редко обновляемым контентом.
Адаптивный дизайн (в том числе с серверным компонентом — RESS)	Для всех устройств один URL; поисковые боты точнее индексируют контент; работа с одним набором контента и кода; адаптация под самые разные типы устройств; продвижение только одного сайта.	Невозможность оптимизировать интерфейс под задачи мобильной аудитории (убрать или полностью изменить компоненты); сложность и дороговизна исполнения (требуется высокая экспертиза разработчика); не каждый существующий сайт подлежит адаптации в силу особенностей разработки.	Всем сайтам с высокой динамикой контента (СМИ, порталы, веб-сервисы, интернет-магазины и т. д.); бизнесу с неограниченным бюджетом; начинающим проектам (разработка сайта с нуля).

С точки зрения SEO адаптивный дизайн предпочтителен:

• ускоряется индексация страниц;
• отсутствует риск появления дублей страниц;
• не нужно настраивать переадресацию с применением агентов пользователя;
• пользователи работают с одним URL (им удобнее делиться контентом);
• чтобы сообщить поисковому роботу об адаптивной версии сайта достаточно лишь прописать в заголовок документа мета-тег viewport: <meta name="viewport" content="width=device-width, initial-scale=1">

Однако, если у вас уже есть две отдельные версии, не забудьте проработать следующие нюансы:

• помогите поисковому роботу правильно определить мобильную версию — используйте на ее страницах параметр alternate: <link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/page.html"/>
  
• добавьте мобильную версию в Яндекс.Вебмастер, чтобы следить за индексацией страниц;
• размещайте мобильную версию только на отдельном домене, например m.site.ru, а не в единой директории основного сайта, например, site.ru/mobile (чтобы робот смог корректно индексировать данные).

Без мобильного сайта бизнес обречен

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