Проблема индексации в проектах на Next.js
Запускать многоканальный сервис с более чем 200 страницами без видимости в поисковой выдаче — типичный сценарий, когда разработчик упускает из виду детали SEO‑конфигурации. Даже при полностью готовом пользовательском интерфейсе и положительных отзывах от первых пользователей, отсутствие индексации делает проект бесполезным с точки зрения привлечения новой аудитории. В случае с приложением, построенным на Next.js, причина оказалась в одной неверно заданной строке конфигурационного файла, которая полностью блокировала доступ поисковых роботов к содержимому.
Первичный аудит SEO‑настроек
Перед тем как искать «чудо‑решение», необходимо провести системный обзор текущих настроек проекта:
| Элемент | Состояние | Последствия |
|---|---|---|
| Sitemap | Устаревший, генерировался вручную | Поисковые системы не получали актуального списка URL |
| Canonical‑теги | Отсутствовали | Дублирование контента воспринималось как попытка манипуляции |
| hreflang | Не использовались, хотя сайт поддерживал 3 языка | Google не мог определить языковую версию страницы |
| Структурированные данные | Минимальные | Возможности rich snippets оставались неиспользованными |
| robots.txt | Оставлен по умолчанию из create-next-app (доступ к / закрыт) | Поисковые боты получали директиву Disallow: / |
| Meta‑description | Не заполнены на половине страниц | Снижается CTR в результатах поиска |
Эти недочёты объясняют нулевые показы в Google Search Console, но не решают корневую проблему — блокировки, внедрённой на уровне конфигурации Next.js.
Ключевая ошибка в конфигурации
В next.config.js была включена опция output: 'export' без дополнительного указания, как генерировать статические файлы для каждой локали. При экспорте в статический сайт Next.js автоматически создаёт файл robots.txt, в котором прописана строка:
User-agent: *
Disallow: /
Эта директива полностью запрещает индексацию всех страниц. При обычном запуске в режиме разработки эта проблема незаметна, а в продакшене — сразу приводит к полному игнорированию сайта поисковыми системами.
Как исправить: шаги по настройке
-
Обновление robots.txt
- Удалить директиву
Disallow: /и добавитьAllow: /. - При желании ограничить доступ к служебным путям (например,
/api) добавить отдельные правила.
- Удалить директиву
-
Генерация актуального sitemap
- Установить пакет
next-sitemap. - В
next-sitemap.config.jsуказать базовый URL, поддерживаемые локали и правила исключения. - Добавить скрипт в
package.json:"postbuild": "next-sitemap".
- Установить пакет
-
Настройка canonical и hreflang
- В компоненте
<Head>каждой страницы добавить:<link rel="canonical" href={`${process.env.SITE_URL}${router.asPath}`} /> {locales.map((locale) => ( <link key={locale} rel="alternate" hrefLang={locale} href={`${process.env.SITE_URL}/${locale}${router.asPath}`} /> ))} - Переменная
localesберётся изi18n‑конфигурации.
- В компоненте
-
Внедрение структурированных данных
- Использовать JSON‑LD для описания путешествий:
@type: TravelAgency,offers,itinerary. - Добавлять скрипт в
<Head>только на страницах с готовым планом.
- Использовать JSON‑LD для описания путешествий:
-
Заполнение meta‑description
- В
getStaticPropsформировать короткое описание на основе заголовка и первых 150 символов контента. - При отсутствии данных использовать fallback‑текст.
- В
-
Проверка в Google Search Console
- После деплоя выполнить запрос «Inspect URL» для нескольких страниц.
- Убедиться, что статус изменился с Blocked на Indexed.
Результаты и выводы
После внесения описанных правок и повторного деплоя проекта количество проиндексированных страниц выросло с нуля до более 170 за три недели. Трафик из органического поиска начал постепенно расти, а показатель CTR улучшился благодаря корректным мета‑описаниям и появлению rich snippets.
Ключевой урок: в проектах на Next.js стоит проверять автоматически генерируемый robots.txt, особенно при использовании статической экспорта. Одна строка конфигурации может полностью закрыть сайт от поисковых систем, а последующая проверка в Search Console быстро укажет на проблему.
Оптимизация SEO в современных фреймворках требует не только качественного контента, но и тщательного контроля над техническими аспектами—от карты сайта до правильного указания языковых альтернатив. При соблюдении этих рекомендаций любой Next.js‑проект способен эффективно конкурировать в поисковой выдаче.