• Главная
  • Блог
  • Оптимизация и продвижение мобильной версии сайта

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

Дмитрий Лютиков
14 августа 2017
комментариев нет 1703

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

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

Зачем оптимизировать мобильную версию сайта?

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

  • В мае 2015 года Google объявил, что в 10 странах мира, включая США и Японию, чаще пользуются его поиском на мобильных, чем на компьютерах.
  • Согласно исследованию Яндекса, опубликованному весной 2016 года, больше 50% его аудитории использует мобильные устройства наряду с компьютерами, а почти 20% выходит в интернет только с мобильных устройств.

В соответствии с этой тенденцией меняются алгоритмы ранжирования:

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

Мобильная версия сайта должна быть оптимизирована под целевые запросы. Иначе вы можете потерять трафик с поиска.

Настройте сбор статистики и мониторинг позиций сайта

Рекомендуем установить на мобильную версию сайта те же системы статистки (тот же код счетчиков), что и на десктопную версию. Если вы поставите на две версии сайта разные коды счетчиков Google Analytics и Яндекс.Метрики – получите некорректные данные, т.к. часть посетителей у вас будет посчитана дважды.

Зарегистрируйте обе версии сайта в Яндекс.Вебмастере и Google Search Console. Убедитесь, что сервисы не выдают ошибок при сканировании и индексации мобильного сайта.

Отслеживать позиции сайта в мобильной выдаче Яндекса умеет сервис Топвизор.

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

В теге <head> каждой страницы основной версии сайта должна содержаться ссылка на соответствующую ей страницу мобильной версии. Пример:

<link rel="alternate" media="only screen and (max-width: 640px)"
href="http://m.site.ru/page/&quot; />

Для Яндекса этого достаточно. Google еще рекомендует добавить в тег <head> мобильных страниц тег <link rel="canonical">, указывающий на десктопную версию (Яндекс не учитывает межхостовый canonical):

<link rel="canonical" href="http://www.site.ru/page/&quot; />

Важно: вы связываете этими тегами конкретные страницы, а не один сайт с другим сайтом целиком. Не нужно указывать на всем сайте ссылку на главную страницу мобильной версии, а в атрибуте canonical на всех страницах мобильной версии прописывать главную страницу основного сайта. Это ошибка! Каждой странице основного сайта должна соответствовать только одна мобильная, и наоборот.

oipmvs2.jpg
Динамика видимости мобильного сайта после «связывания» его с основной версией

Настройте индексацию мобильного сайта

Мобильная версия на поддомене – это отдельный сайт со своим robots.txt и своей XML-картой сайта.

Важно:

  • Не закрывайте мобильную версию от индексации в robots.txt.
  • В директиве “Host” файла robots.txt мобильной версии укажите адрес именно мобильной версии, а не основного сайта.
  • Не закрывайте от индексации файлы CSS, JavaScript, шрифты и изображения. Они используются поисковыми системами для рендеринга страниц сайта и оценки их пригодности для мобильных устройств.
  • Создайте файл с XML-картой мобильного сайта, укажите ссылку на него в robots.txt мобильного сайта и добавьте в сервисы для вебмастеров Яндекса и Google. Обновляйте файл при создании новых страниц.

Проверьте мобильную версию сервисами поисковых систем

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

  • Должен быть указан тег <viewport>.
  • Не должно быть горизонтальной прокрутки.
  • На мобильной версии не должно быть Flash, Java (не путайте с JavaScript) и Silverlight.
  • Текст должен удобно читаться с мобильных. Яндекс требует, чтобы размер шрифта был не менее 12px.

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

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

Инструменты проверки:

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

oipmvs3.png
Проверка мобильных страниц в Яндекс.Вебмастере

oipmvs4.png
Проверка оптимизации для мобильных от Google

Но даже если Яндекс и Google не показали ошибок, это не значит, что на реальных мобильных устройствах тоже будет все в порядке. Необходимо проверить основные шаблоны страниц как минимум на iPhone и смартфоне под управлением Android. Убедитесь, что работают все формы (обратная связь, заявка на услугу, подписка на рассылку и т.д.) и не возникает проблем в процессе оформления заказа.

Убедитесь, что мобильная версия «легкая» и быстрая

К сожалению, не всегда и не везде доступен быстрый мобильный интернет или Wi-Fi. Поэтому для мобильного сайта особенно важно, чтобы он быстро загружался и работал.

Проверьте свой сайт следующими сервисами:

  • Google PageSpeed Insights – дает советы по оптимизации скорости загрузки (сжатию изображений, настройке кеширования и т.д.);
  • Pingdom Website Speed Test – позволяет оценить скорость ответа сервера, сколько «весят» страницы в мегабайтах (с учетом всех скриптов и изображений) и какие ресурсы грузятся дольше всего.

Сделайте сайт релевантным целевым запросам

В целом основные методы оптимизации те же, что и для обычного сайта:

  • Используйте ЧПУ – URL, состоящие из слов, понятных как пользователям сайта, так и поисковым машинам.
  • Теги <title> должны соответствовать содержанию страниц и вашим ключевым словам.
  • На всех страницах должны быть заполнены теги <meta name=”description”>. Поместите в тег привлекательное для потенциального клиента описание конкретной страницы, а не сайта в целом.
  • Выделите основной заголовок на странице тегом <h1>. Рекомендуем не использовать этот тег ни для чего другого.
  • Внедрите подходящую для вашего контента микроразметку.
  • Обязательно укажите контактную информацию – адрес, телефон, часы работы. Добавьте карту проезда.
  • Тексты страниц должны соответствовать целевым запросам. Но учитывайте, что на экране смартфона мало места. Не лейте воду, избавьтесь от всего лишнего, оставьте только самое главное.

Учитывайте, что в мобильном поиске расстановка сил отличается от компьютеров – со смартфонов поиск Google приводит значительно больше трафика (59,6%, по данным Яндекс.Метрики в июле 2017 года), чем Яндекс (39,2%). На мобильном сайте не стоит пренебрегать элементами оптимизации, которые работают в Google, но не работают в Яндексе. В частности, микроразметкой.

oipmvs5.png
Доля Яндекса и Google в мобильном поиске – по данным Яндекс.Метрики

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

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

Комментариев нет
5/5 (100%) 3 голос(ов)
5 3
Просмотров: 1703
Все публикации
 

Оставить комментарий
Имя*
E-Mail (не публикуется)
Комментарий*