Обсудим ваш проект?
Комплексный интернет-маркетинг
15 лет опыта | 90+ специалистов
Отправить заявку

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

Обновлено: 07 июня 2016
Время на прочтение:
Просмотров: 8695
Константин
ведущий SEO-специалист, SEO-аналитик
Виктор
ведущий интернет-маркетолог
Редполитика
Мы прилагаем все усилия, чтобы наши обзоры были максимально честными, точными и объективными. Если вы посещаете ссылки в нашем контенте, мы можем получить комиссионное вознаграждение от ваших покупок, однако это не влияет на нашу редакционную политику и мы не станем рекомендовать продукты или сервисы, в которых не уверены.

Поисковые флагманы уже давно анонсировали, что приоритет поисковой выдачи на смартфонах будет отдан мобильным версиям сайтов. Это значит, что если ваш сайт не проходит проверку на оптимизацию для мобильных устройств mobile-friendly (так называемая «мобилопригодность» сайта), то велика вероятность, что на смартфоне его позиции в выдаче будут ниже. Но создание удачной мобильной версии — это только половина дела. Важно настроить сайт для его индексации поисковыми системами. О том, как сделать это правильно, мы и расскажем.

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

Правильная настройка мобильной версии зависит от способа ее реализации. Существует три вида:

  1. Адаптивный дизайн основного сайта. Предполагает, что у вас существует одна версия сайта, которая автоматически адаптируется под размеры разных экранов: десктопов или мобильных устройств. Считается, что адаптивный дизайн — наилучший способ оптимизации сайта для мобильных устройств (по данным Google).

    Адаптивный дизайн сайта на экранах с разным разрешением
    Адаптивный дизайн сайта на экранах с разным разрешением
  2. Динамический показ. Мобильная и десктопная версии выглядят по разному, имеют разные коды (HTML, либо CSS), но находятся по одному адресу (URL). При запросе этого адреса с разных устройств выдаются либо страницы, написанные для мобильных устройств, либо десктопные версии.

    Нет времени разбираться?
    SEO-продвижение под ключ
    Проанализируем конкурентов, подберем запросы с низкой конкуренцией, проведем поисковую оптимизацию сайта, организуем внешнюю ссылочную массу, проработаем карточки компании на онлайн картах, проведем базовую UX-аналитику сайта. Над каждым проектом работает от 6 до 10 специалистов. Собственные разработчики для доработки сайта при необходимости. От вас — сайт, от нас — позиции в Яндекс/Google и трафик.
    Ваш сайт:
  3. Собственный URL для мобильной версии (мобильная версия сайта на поддомене). Мобильная версия отличается от декстопной и имеет другой адрес. Например, версия для сайта site.ru , версия на поддомене будет иметь адрес m.site.ru.

    Подробнее об этом можно почитать у Google.

Как оптимизировать и продвигать мобильную версию сайта? С точки зрения SEO гораздо удобнее использовать динамический показ разных вариантов кода. Это исключает необходимость скрытия и дублирования части контента (в адаптивной версии, например, это может быть дублирование меню) и дополнительной настройки переадресации (как для мобильной версии на отдельном URL).

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

Настройка адаптивной версии сайта

Так для правильной интерпретации поисковыми системами созданного адаптивного дизайна необходимо добавить в заголовок документа метатег “viewport”.

<meta name="viewport" content="width=device-width">

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

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

Настройка динамического показа разных версий сайта

Для динамического показа важно, чтобы поисковый бот правильно определял устройство, с которого пользователь просматривает сайт и выдавал в ответ верный код. Для этого можно воспользоваться HTTP-заголовком “Vary” или добавить элемент “User-Agent”.

Привлекли 35.000.000 людей на 185 сайтов
Мы точно знаем, как увеличить онлайн–продажи
Применяем лучшие практики digital–продвижения как из вашей тематики, так и из смежных областей бизнеса. Именно это сделает вас на голову выше конкурентов и принесёт лиды и продажи.
Ваш сайт:

Размещение мобильной версии на собственном URL

В случае с созданием собственного URL существует 2 способа размещения:

  • В отдельный раздел сайта (в папку). При этом мобильная версия сайта будет иметь вид: site.ru/m/.
  • Создание мобильной версии сайта на поддомене вида m.site.ru

При этом если Google однозначно интерпретирует оба варианта, то Яндекс может неверно воспринять размещения в папке. В связи с этим рекомендуется размещать мобильную версию сайта на поддомене.

Настройка мобильной версии сайта на поддомене

Но когда мы размещаем версию на поддомене, мы фактически частично или полностью дублируем контент собственного сайта. Уникальность предоставленной информации — это важный фактор ранжирования, и, создавая собственную копию, мы рискуем потерять позиции. Чтобы этого не произошло, необходимо показать поисковому боту, что перед ним две версии одного сайта. Для этого нужно связать версии метатегами <link> и настроить переадресацию.

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

Как настроить метатеги

На мобильном сайте в коде прописываем метатег “canonical”, указывающий в качестве канонической страницу десктопного сайта. На десктопном сайте — метатег “alternate”, указывающий в качестве альтернативной страницу мобильного сайта.

Например, для главной страницы сайта http://site.ru прописываем следующее:

http://m.site.ru" > 

Для главной страницы мобильного сайта http://m.site.ru прописываем:

http://site.ru"> 

Как настроить редирект (переадресацию)

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

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

Техническая оптимизация мобильной версии — достаточно сложный процесс. Сами поисковые системы еще не до конца сформировали требования к мобильной выдаче и постоянно вносят дополнения в список критериев. При этом Яндекс и Google могут по-разному интерпретировать одни и те же действия и иногда даже противоречат друг другу. Чтобы сохранять позиции в поисковых системах, важно постоянно отслеживать изменения, происходящие в алгоритмах работы ботов и дорабатывать мобильные версии с учетом меняющихся требований.

Методология выбора
Кто мы
Директ Лайн
Крупнейшее региональное интернет-агентство России. ТОП-10 в рейтинге Рунета.
1200 +
проектов
90
экспертов
16лет
на рынке
Наша методология
Статьи в блоге Директ Лайн - это всегда оригинальный, проверенный и объективный контент. Все обзоры и рейтинги честно отражают наше мнение и опыт взаимодействия с каждым инструментом.
Содержание
Комментарии

Комплекс услуг для вашего бизнеса

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

Кейсы и статьи

Бесплатный аудит SEO
и рекламного трафика
Покажем точки роста вашего проекта,
если по нему уже ведутся работы