JavaScript SEO простыми словами
Раньше сервер отдавал готовую страницу: открыл исходный код — и там весь текст. Сегодня многие сайты, от интернет-магазинов в Ташкенте до сайтов клиник и учебных центров в регионах, устроены иначе. Сервер присылает почти пустой HTML и набор скриптов, а заголовки, описания товаров и цены появляются уже в браузере.
Человек этого не замечает. Робот замечает: ему нужно скачать страницу, выполнить скрипты и только потом понять, о чём она. Любая заминка на этом пути означает, что в индекс попадёт неполная версия или не попадёт ничего.
Как поисковик обрабатывает JavaScript
Google работает в два шага: сначала загружает HTML, затем, когда доходят ресурсы, выполняет скрипты и смотрит итоговую страницу. Между шагами может пройти время, поэтому новая страница или изменённая цена попадает в поиск позже, чем хотелось бы.
Остальные потребители вашего сайта справляются хуже. Яндекс умеет обрабатывать скрипты, но готовый HTML для него надёжнее. Многие роботы ИИ-ассистентов и сервисы, которые строят превью ссылок в Telegram и других мессенджерах, скрипты не выполняют и читают только исходный HTML. Если там пусто, для них вашей страницы нет.
Где сайты на фреймворках теряют трафик
Чаще всего причина не в самом фреймворке, а в том, как он настроен. Вот типичные места потерь:
- Пустой HTML без текста, пока не отработают скрипты.
- Title, description и canonical подставляются скриптом поздно или одинаковы на всех страницах.
- Меню и карточки товаров ведут по ссылкам, которые работают только через обработчик нажатия, а не через обычный тег a с адресом.
- Контент подгружается только после клика, прокрутки или выбора города.
- Ошибка в одном скрипте ломает всю страницу.
- Разделы переключаются без смены URL, и у них нет собственных адресов.
SSR, SSG или CSR: что выбрать
Клиентский рендеринг (CSR): страница собирается в браузере. Для личных кабинетов и внутренних панелей это нормально, а для публичных страниц, которые должны приводить клиентов из поиска, это самый рискованный вариант.
Серверный рендеринг (SSR): сервер собирает страницу и сразу отдаёт роботу готовый HTML с текстом, ссылками и мета-тегами. Подходит для каталогов, карточек товаров и страниц с часто меняющимися данными.
Статическая генерация (SSG): страницы собираются заранее, при сборке сайта. Быстро и надёжно для услуг, статей и страниц о компании, где содержание меняется нечасто. Next.js и другие современные фреймворки поддерживают оба режима, и их можно сочетать: каталог через SSR, блог через SSG, кабинет и корзину оставить на CSR.
Как проверить сайт самостоятельно
Для первой диагностики не нужен специалист. Достаточно браузера и доступа к Search Console:
- Откройте исходный код страницы и найдите главный заголовок и абзац текста. Если их нет, робот без скриптов их тоже не увидит.
- В Search Console запустите проверку URL и сравните отрисованную версию с тем, что видит посетитель.
- Отключите JavaScript в браузере и пройдите по меню: открываются ли разделы обычными ссылками.
- Отправьте ссылку себе в Telegram и посмотрите, подтянулись ли заголовок и картинка превью.
- Убедитесь, что у каждой страницы свой адрес, свой title и свой description.
Что поручить разработчику
Формулируйте задачу через результат, а не через технологию: публичные страницы отдают основной текст, ссылки и мета-теги в исходном HTML; навигация построена на обычных ссылках; у каждой страницы свой URL; важный контент не спрятан за действием пользователя. Выбор между SSR и SSG разработчик сделает сам, исходя из вашего фреймворка.
Если сайт уже работает на клиентском рендеринге, переписывать всё не обязательно. Обычно начинают со страниц, которые приносят заявки и заказы: услуги, категории, карточки, статьи. Кабинет и корзину с оплатой через Click или Payme можно не трогать.
С чего начать
Выберите несколько ключевых страниц и проверьте их способами выше: так быстро видно, есть ли проблема. Если нужна помощь с SEO-оптимизацией сайта в Узбекистане, команда markdev разберёт технические причины и вместе с вашими разработчиками подберёт схему рендеринга под задачу. Опишите сайт и цели, и мы обсудим, с чего лучше начать.
Частые вопросы
Google вообще умеет читать JavaScript?
Умеет: он загружает HTML, а затем выполняет скрипты и видит итоговую страницу. Но это происходит с задержкой, а любая ошибка скрипта может спрятать контент. Поэтому для важных страниц надёжнее отдавать готовый HTML.
Нужно ли переписывать сайт на Next.js?
Не всегда. Сначала проверьте, что именно видит робот. Часто хватает перевести на серверный рендеринг или статическую генерацию публичные страницы, а остальное оставить как есть.
Почему превью ссылки в Telegram пустое?
Сервис превью читает исходный HTML и обычно не выполняет скрипты. Если заголовок и картинка подставляются только в браузере, превью получится пустым. Мета-теги нужно отдавать с сервера.
Страницы сайта с каталогом обязаны иметь отдельные URL?
Да. Без отдельного адреса поисковику нечего индексировать, а покупателю нечем поделиться. Каждая категория и карточка должна открываться по своей ссылке.
Разберём вашу задачу бесплатно
Оставьте контакт — за 15 минут созвона покажем, где теряются заявки и что сделать в первую очередь.