Mobile-first индексация и HTTPS

Два базовых требования современного поиска: адаптивность под мобильные и обязательный HTTPS.

Mobile-first индексация — Google индексирует и оценивает прежде всего мобильную версию сайта. Десктоп вторичен. HTTPS — шифрованное соединение, которое давно стало фактором ранжирования.

Mobile-first: телефон — это основной экран

Большинство поиска происходит с телефонов, поэтому Google перешёл на mobile-first: бот ходит как мобильный пользователь и ранжирует по мобильной версии. Практические следствия для разработчика:

  • Контент должен совпадать. Если мобильная версия урезана (скрыли текст, убрали блоки «для экономии места»), Google увидит именно урезанную — и проиндексирует меньше.
  • Адаптивная вёрстка предпочтительнее отдельного m.site.ru: один URL, один контент, никаких рассинхронов.
  • Обязателен viewport-тег — без него мобильные браузеры рендерят страницу как десктопную и мнут.
<meta name="viewport" content="width=device-width, initial-scale=1">

Что проверять в мобильной версии

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

HTTPS: шифрование как гигиена

HTTPS шифрует трафик между пользователем и сайтом. Google подтверждённо использует его как (лёгкий) сигнал ранжирования, а браузеры помечают HTTP-сайты как «Небезопасные». Кроме того, ряд возможностей (Service Workers для PWA, часть API) работают только по HTTPS.

Что настраивает разработчик: валидный TLS-сертификат (Let's Encrypt бесплатен), 301-редирект всего HTTP-трафика на HTTPS, отсутствие смешанного контента (когда HTTPS-страница тянет картинку/скрипт по HTTP — браузер ругается и может заблокировать).

# Nginx: редирект всего HTTP на HTTPS
server {
    listen 80;
    server_name codechick.io;
    return 301 https://$host$request_uri;
}

Как работает под капотом: проверка готовности

def mobile_https_check(page):
    issues = []
    if not page.get("https"):
        issues.append("сайт не на HTTPS")
    if page.get("mixed_content"):
        issues.append("смешанный контент (HTTP-ресурсы на HTTPS-странице)")
    if not page.get("viewport"):
        issues.append("нет meta viewport")
    if page.get("mobile_content_len", 0) < page.get("desktop_content_len", 0):
        issues.append("мобильный контент урезан относительно десктопа")
    return issues or ["готово к mobile-first и HTTPS"]

ok  = {"https": True,  "mixed_content": False, "viewport": True,
       "mobile_content_len": 1000, "desktop_content_len": 1000}
bad = {"https": False, "mixed_content": True,  "viewport": False,
       "mobile_content_len": 400,  "desktop_content_len": 1000}

print("Хороший:", mobile_https_check(ok))
print("Плохой: ", mobile_https_check(bad))

Вывод:

Хороший: ['готово к mobile-first и HTTPS']
Плохой:  ['сайт не на HTTPS', 'смешанный контент (HTTP-ресурсы на HTTPS-странице)', 'нет meta viewport', 'мобильный контент урезан относительно десктопа']

Частые ошибки

  • Урезанная мобильная версия — Google индексирует именно её, теряете контент.
  • Нет viewport-тега — страница не адаптивна, проваливает mobile-friendly.
  • Смешанный контент — браузер блокирует HTTP-ресурсы, ломая страницу.
  • HTTP без редиректа на HTTPS — дубли http/https и пометка «Небезопасно».

Итог

  • Google индексирует mobile-first: контент мобильной версии должен быть полным, а не урезанным.
  • Обязателен meta viewport и адаптивная вёрстка (лучше, чем отдельный m-домен).
  • HTTPS — фактор ранжирования и требование браузеров; редиректьте HTTP на HTTPS и убирайте смешанный контент.
Проверьте себя
1. Что означает mobile-first индексация?
AGoogle индексирует только сайты, у которых есть мобильное приложение
BGoogle индексирует и ранжирует прежде всего мобильную версию сайта
CСначала индексируется десктоп, потом мобайл
DМобильные страницы получают отдельный индекс
2. Что такое «смешанный контент» (mixed content)?
AКонтент на нескольких языках
BHTTPS-страница, которая подгружает ресурсы (картинки, скрипты) по незащищённому HTTP
CСмесь текста и картинок
DКонтент из разных доменов
3. Зачем нужен 301-редирект с HTTP на HTTPS?
AЧтобы ускорить загрузку картинок
BЧтобы избежать дублей http/https и пометки «Небезопасно», направив весь трафик на защищённую версию
CЭто требование robots.txt
DЧтобы отключить мобильную версию