Сайты для мобильных устройств
Существует четыре способа создания страниц, оптимизированных для просмотра с переносных устройств (смартфонов и планшетов)
- Адаптивный дизайн. Приоритетен в разработке для SEO. Используется единый HTML-код и URL для всех устройств. Сама страница — подстраивается под разрешение и размер экрана устройства
- Динамический показ. Используется единый URL для всех устройств, но вёрстка (код) зависит от разрешения и размера экрана
- Мобильная версия. Используется отдельный поддомен или домен для пользователей на мобильных устройствах
- AMP и Турбо-страницы. Отдельные страницы, которые хранятся на сервере поисковой системы (AMP или Accelerated Mobile Pages — Google. Турбо — Яндекс)
Аудит мобильной версии сайта: чек-лист
Независимо от способа, который используется для адаптации, необходимо проверять следующие пункты, важные для SEO (чек-лист)
- Проверка версии на «дружелюбность» по алгоритмам Google и Яндекса: search.google.com/test/mobile-friendly и webmaster.yandex.ru/site/tools/mobile-friendly/. Проверка основных страниц (главная, раздел, карточка товара, контакты). Получение базовых сведений о скорости загрузки, удобстве отображения текста (12px и более) и элементов
- Ручной просмотр страниц в браузере в мобильном окне (инструменты для разработчика). Проверка, что контент основной и адаптированной версии — совпадает. Поиск ошибок вёрстки
- Проверка основных конверсионных элементов. Возможность осуществить звонок в одно нажатие по номеру телефона. Меню-гамбургер. Доступность цен и фото на основных типах страниц. Страница «Контакты»: телефон, адрес, схема проезда
- Проверка скорости загрузки с помощью developers.google.com/speed/pagespeed/insights/, JimmyNeuron Marketing и gtmetrix.com для основных страниц. Скорость загрузки существенно сказывается на мобильном сёрфинге (медленное соединение)
- Проверка вёрстки и доступности контента в мобильном браузере. Оценка идёт по двум-трём наиболее популярным устройствам / ОС / браузерам из Яндекс.Метрики
- Оценка поведенческих факторов в Яндекс.Метрике на мобильных устройствах и сравнение с десктопом. Показатели могут несколько различаться, это нормально. Автоматизировать аудит можно с помощью специализированного инструмента JimmyNeuron Marketing, который позволит выявить URL с плохими значениями поведенческих метрик и сравнить показатели для пользователей с устройств разного типа. Нужные отчеты: каналы трафика, время на сайт, вовлеченность пользователей, страницы выхода
- Удобство использования (субъективная оценка). Факторы: наличие уведомлении при взаимодействии с сайтом (добавление товара в корзину, заполнение онлайн-заявки), доступность меню, читабельность. Удобство чтения текста — кегль не менее 12px
- Не используются технологии Flash, Silverlight, отсутствуют Java-апплеты, а интерактивная часть встроена с помощью HTML5
- Отсутствует горизонтальная прокрутка экрана (допустимо, в очень редких случаях — таблицы, элементы, которые нельзя адаптировать)
- Используется meta-тег viewport для указания области просмотра контента
В случае использования оптимальной для SEO адаптивной версии, добавляется ещё один значимый, особенно в эпоху mobile-first-индексации пункт
- Совпадение контента по исходному коду в формате HTML для мобильного и десктопного пользователя. Основное: HTTP-заголовки объем текста и его наличие в коде количество внутренних исходящих ссылок / внешних исходящих ссылок SEO-теги: Title, Description, H1-H6 meta-теги: robots, refresh тег с атрибутом rel="canonical" Пункт довольно быстро выполняется в случае использования сканера Screaming Frog SEO Spider с соответствующими настройками. Проект сканируется два раза — с десктопа и с мобильным User-agent, после чего данные экспортируются в Google Таблицы / Excel и производится сравнение
Чек-лист для отдельной мобильной версии
В том случае, если ваш проект использует отдельную мобильную версию на поддомене m.site.ru, требуется проверить реализацию по трём дополнительным пунктам чек-листа
- На основной версии сайта используется указание на альтернативную (mobile) версию с помощью атрибута rel="alternate" тега link
- На мобильную версию настроено перенаправление по User-agent устройства. Переадресация направляет пользователя на ту же страницу, но на мобильной версии (не на главную). Используется 302 код ответа
- На странице для мобильных устройств в роли канонической страницы указан URL с основной версии с помощью атрибута rel="canonical" тега link. На странице для смартфонов (http://m.site.ru/dir/) указаны атрибуты
Продвижение сайта в мобильной выдаче
Поисковые системы учитываю адаптированность сайта при ранжировании в мобильной выдаче. В Яндексе с 2016 года действует алгоритм Владивосток, Google начал учёт ещё ранее — с 2015 года
Фактор наличия mobile-версии — существенно сказывается на позициях проекта в поиске с переносных устройств. Снижение позиции в мобильном поиске будет приводить и к плавному снижению позиций сайта и в основном поиске. Как минимум, за счёт поведенческих метрик
Для улучшения позиций в мобильной выдаче требуется
- Проверить проект на соответствие требованиям по чек-листу выше
- Провести аналитику позиций в десктопной и mobile-выдаче и сравнить показатели
- На основании полученной аналитики — сделать выводы о необходимости проведения дополнительных работ по росту сайта в мобильной выдаче
Хорошей практикой является регулярный контроль показатели сайта в выдаче для устройств двух типов и оценка основных метрик — CTR × WS, % ТОП-10, количество запросов в ТОП
Сравнительная динамика KPI ресурса в пост-аналитике модуля ведения проектов «JimmyNeuron Marketing»
Что делать, если позиции проекта в мобильной выдаче существенно ниже, чем в обычной
Если SEO KPI ресурса в мобильной выдаче ниже, чем в обычной, то требуется
- Выявить группы запросов, по которым наблюдается проблема
- Если проблема низкого ранжирования фиксируется по всем группам запросов, то это свидетельствует о том, что сайт в целом признан мобилонепригодным. Требуется выявить причины, опираясь на пункты чек-листа выше и устранить их
- Если же низкое ранжирование фиксируется только по некоторым группам фраз, то важно: Проверить данные URL на «дружелюбность» с помощью Mobile Friendly тестов. Оценить визуально привлекательность сниппета в выдаче по проблемным фразам, вероятно, проблема в низких показателях кликовых поведенческих факторах.С помощью панелей для вебмастеров провести дополнительный анализ CTR для данных групп фраз (сегменты по устройствам). При анализе ТОП и внутренних факторов — опираться именно на первые 10 результатов мобильной, а не основной выдачи. Провести аудит внутренних поведенческих факторов для данных URL в сравнении со средними значениями по всему сайту и показателями в десктопной версии. Если используется отдельная версия на поддомене или динамический показ, то необходимо провести дополнительный анализ содержимого HTML-кода документов и проанализировать сохраненную копию
Представленный выше чек-лист позволяет самостоятельно выявить причины низкого ранжирования и исправить их, что ведёт к росту трафика пользователей с переносных устройств. Если у вас возникли проблемы, вы всегда можете заказать профессиональный SEO-аудит у специалистов компании
AMP и Турбо-страницы как решение проблемы
Разработка AMP и Турбо-страниц часто позволяет устранить проблемы низких позиций для mobile. Поисковые системы дополнительно помечают данные результаты и, при прочих равных, показывают в выдаче именно их, а не канонические URL
Для информационных и новостных тематик разработка и внедрение AMP и Турбо-страниц становится нормой. В то же время, данные технологии следует рассматривать лишь как дополнение к адаптации сайта, ибо на них попадают только пользователи из поисковых систем, а у любого проекта имеются и другие источники трафика, пользователи из которых тоже должны комфортно ощущать себя при сёрфинге
Частые ошибки и их решение
При разработке сайтов вообще допускается множество технических ошибок. Не исключение и адаптивные версии. Ниже представлен список наиболее частых из них, которые могут сказываться существенное негативно на позициях по раскручиваемым запросам. Безусловно, ошибки пересекаются и с пунктами чек-листа
Данное полное руководство и чек-лист по мобильной адаптации позволят увеличить значения трафика с переносных устройств и поднять его конверсию. Удачи в самостоятельном продвижении сайта и избегайте ошибок