Сайт из нейросетевого конструктора не видит Яндекс: как мы вытащили его в поиск без переписывания

Что было

Сайт клуба собрали быстро: от первых референсов до релиза прошло три дня. Родители видят расписание, тренеров, турниры и новости, могут записать ребёнка на пробную тренировку. Клуб сам меняет расписание и новости в админке.

Интерфейс сделан в Lovable. Это React-приложение: браузер получает почти пустую страницу, скачивает скрипт, и уже скрипт рисует содержимое, подтягивая данные из базы.

Человек ничего не замечает. А поисковый робот часто видит только пустой блок <div id="root"></div>. Ни расписания, ни тренеров, ни текста про клуб. Для робота сайт пустой.

Как проверить свой сайт за минуту

• откройте сайт и нажмите Ctrl+U (просмотр исходного кода). Если в коде нет текста, который вы видите на экране, - у вас та же история;
• в Яндекс Вебмастере: Инструменты, затем Проверка ответа сервера. Посмотрите, какой HTML получает робот;
• в Google Search Console: Проверка URL, затем Посмотреть просканированную страницу.

Google умеет запускать скрипты и часто справляется сам, хоть и с задержкой. Яндекс с такими сайтами работает заметно хуже, и для бизнеса в России это главная проблема.

Три способа починить

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

Подключить сервис пререндера. Есть платные сервисы, которые отдают роботам заранее отрисованные копии страниц. Работает, но это ежемесячный платёж и ещё одна внешняя зависимость.

Сделать пререндер самим. Мы выбрали этот путь. Схема простая:

• на сервере раз в сутки запускается браузер Chrome без окна;
• он открывает каждую страницу сайта, ждёт, пока скрипт дорисует содержимое, и сохраняет готовый HTML;
• веб-сервер отдаёт этот HTML и роботам, и людям. Для человека ничего не меняется: дальше страница оживает как обычно.

Заодно для каждой страницы прописали свой заголовок, описание и адрес в разметке. В исходной сборке они были одинаковыми на всех страницах.

Грабли, на которые мы наступили

Сохранялась надпись «Загрузка...». Chrome иногда сохранял страницу раньше, чем приходили данные из базы, особенно новости. В поиск могла попасть страница с одним словом «Загрузка». Решили так: скрипт ищет эту надпись в результате и пробует снова, до пяти раз. Если не вышло, старую готовую копию не трогает.

Новость из админки не должна падать в 404. Клуб публикует новость, а пререндер пройдёт только ночью. Для раздела новостей и админки оставили запасной вариант: если готовой копии ещё нет, отдаётся обычная версия сайта. Для всех остальных несуществующих адресов отдаётся настоящая страница 404, закрытая от индексации. Иначе поисковик видит сотни «страниц» с одинаковым содержимым по любому выдуманному адресу.

Сайт выглядел полупустым, хотя база была полная. После переезда базы на свой сервер страницы открывались, но без расписания и тренеров. В базе всё было на месте. Оказалось, у поддомена, с которого сайт берёт данные, не было записи в DNS: сайт загружался, а запросы к данным уходили в никуда. Теперь, если контент пропал, первым делом проверяем DNS, а не базу.

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

Что в итоге

Роботы получают полноценные страницы с текстом, а не пустой блок. Сайт клуба при этом не переписывали: тот же интерфейс, та же админка, клуб работает как раньше. Пререндер обновляется сам каждую ночь.

Если у вас сайт из конструктора

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

• что видит робот (Ctrl+U и Вебмастер);
• есть ли у каждой страницы свой заголовок и описание;
• отдаёт ли сайт настоящую 404 на несуществующие адреса;
• индексируются ли страницы, которые наполняются из базы: новости, каталог, расписание.

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

Частые вопросы