Часть 1 из 22

Стратегия рендеринга: что на самом деле видит краулер?

Самое важное SEO-решение в Next.js — как рендерится каждый роут. Google умеет исполнять JavaScript, но рендеринг ставится в очередь, откладывается и не гарантирован — а большинство остальных краулеров (Bing частично, и почти все AI-краулеры) индексируют только исходный HTML-ответ.

Базовое правило:

  • Статика (SSG) — маркетинговые страницы, документация, блог. Быстрее и дешевле всего, полностью индексируется.
  • ISR (Incremental Static Regeneration) — каталоги, списки, всё, что меняется раз в час/день. Скорость статики с контролируемой свежестью.
  • SSR (динамический рендеринг) — персонализированные и по-настоящему realtime-страницы. Индексируется, но TTFB медленнее.
  • CSR (только клиент) — дашборды и внутренности приложения. Никогда — для контента, который должен индексироваться.
// app/blog/[slug]/page.tsx — ISR: статический HTML, перегенерация раз в час
export const revalidate = 3600;

export async function generateStaticParams() {
  const posts = await getPosts();
  return posts.map((post) => ({ slug: post.slug }));
}

Проверяйте, что получает краулер, а не что показывает ваш браузер:

curl -s https://example.com/your-page | grep -i "ключевая-фраза"

Если ключевого контента нет в этом ответе — для большинства краулеров его не существует.

Остерегайтесь случайного динамического рендеринга. Вызов cookies(), headers() или searchParams на странице молча переключает её в SSR. Для SEO это не фатально, но стоит вам TTFB и нагрузки на сервер. Эти ловушки мы подробно разобрали в статье Как работает кеширование в Next.js с App Router.

Чеклист:

  • Каждый индексируемый роут — SSG или ISR; SSR только там, где нужна персонализация
  • curl по «сырому» HTML подтверждает наличие основного контента
  • Нет вызовов cookies()/headers() на страницах, которые должны быть статическими
  • Клиентские компоненты — для интерактива, а не для контента

01—22

Все темы гайда

  1. 01Стратегия рендеринга: что на самом деле видит краулер?
  2. 02Metadata API: тайтлы, описания и паттерн с шаблоном
  3. 03Canonical и hreflang: одна страница — один адрес
  4. 04Open Graph и динамические OG-картинки
  5. 05sitemap.ts и robots.ts: файловые конвенции вместо рукописного XML
  6. 06Структурированные данные: JSON-LD, который приносит rich results
  7. 07Картинки, шрифты и скрипты: классическое трио производительности
  8. 08Core Web Vitals: три числа, которые измеряет Google
  9. 09Редиректы, 404 и коды ответов
  10. 10Кеширование и свежесть контента
  11. 11AEO/GEO: как попасть в ответы ChatGPT, Perplexity и Google AI Overviews
  12. 12Мониторинг: SEO — это цикл, а не задача на запуск
  13. 13Траст и E-E-A-T: как сделать сайт заслуживающим доверия
  14. 14Image SEO: как превратить картинки в трафик
  15. 15Внутренняя перелинковка и архитектура сайта
  16. 16Поисковые интенты: страницы под то, что люди реально ищут
  17. 17Programmatic SEO в Next.js: страницы в масштабе без спама
  18. 18SEO-миграция: переезд на Next.js без потери трафика
  19. 19Пагинация и фасетная навигация без раздувания индекса
  20. 20Доступность и SEO: одна работа — две награды
  21. 21Угасание контента: обновить, склеить или удалить
  22. 22Off-page для разработчиков: ссылки, которые не покупают

Нужно, чтобы это сделали за вас?

Я провожу аудит и чиню техническое SEO на сайтах Next.js — индексация, скорость, hreflang и видимость в AI.

Услуга «Техническое SEO»