Image SEO: как превратить картинки в трафик

Большинство команд воспринимает картинки как проблему производительности, которую надо сдерживать. Это половина истории. Изображения — это ещё и канал трафика: Google Картинки, Discover, rich results и AI-ответы находят страницы через визуалы. И сигнал качества: гайд на 2000 слов без единой оригинальной картинки читается как халтура и пользователями, и системами ранжирования.

Каждая контентная страница заслуживает настоящих изображений

• Уникальное всегда бьёт сток. Оригинальная диаграмма, скриншот с пометками, фото реального результата — всё это может ранжироваться в поиске по картинкам и приносить цитирования. Стоковое фото «бизнесмены жмут руки» не ранжируется ни за что и сигналит шаблонный контент.
• Google Discover сильно предпочитает страницы с большими качественными картинками (от 1200px по ширине) — для контентных сайтов это бесплатный трафик.
• Диаграммы и скриншоты делают контент цитируемым для AI-движков: страница, объясняющая визуалом плюс текстом, оценивается как более богатый источник.
• Не прячьте смысловой текст внутрь картинок — краулеры читают HTML, текст-в-картинке для них невидим (как и для скринридеров).

Механика: назвать, описать, задать размер

<Image
  src="/images/next-seo/isr-revalidation-flow.png" // говорящее имя в kebab-case
  alt="Схема ISR: публикация в CMS дёргает вебхук, revalidatePath сбрасывает кеш"
  width={1400}
  height={800}
/>

• Имена файлов участвуют в ранжировании поиска по картинкам: isr-revalidation-flow.png бьёт screenshot-final-2.png.
• Alt-текст описывает картинку для скринридеров и для поиска. Пишите, что реально изображено; ключевые слова — только где естественно. Пустой alt="" корректен для чисто декоративных изображений.
• Текст вокруг картинки (подпись, предыдущий абзац) даёт ей контекст — Google ранжирует изображения во многом по их окружению.

Структурированные данные: застолбите свои изображения

Размечайте картинки через ImageObject — с license и creator вы получаете бейдж Licensable в Google Картинках, что важно, если делаете оригинальные визуалы:

const imageSchema: WithContext<ImageObject> = {
  "@context": "https://schema.org",
  "@type": "ImageObject",
  contentUrl: `${baseUrl}/images/next-seo/isr-revalidation-flow.png`,
  creator: { "@type": "Person", name: "Vlad Sedenko" },
  license: `${baseUrl}/image-license`,
  creditText: "sedenko.net",
};

Добавьте изображения в sitemap — sitemap.ts в App Router поддерживает массив images для каждой записи:

{
  url: `${baseUrl}/blog/${post.slug}`,
  images: [`${baseUrl}${post.heroImage}`],
}

AI-сгенерированные картинки: осторожно

Сгенерированные иллюстрации годятся для декора, но маркируйте их честно (IPTC-метаданные DigitalSourceType — формирующийся стандарт, который Google уже читает) и не используйте там, где важен пруф из первых рук: сгенерированный «скриншот» результатов, которых вы не достигали, — это удар по трасту, а не актив. Оригинальные скриншоты и настоящие диаграммы несут вес E-E-A-T; см. Траст и E-E-A-T.

Чеклист:

• На каждой значимой странице есть хотя бы одно уникальное содержательное изображение
• Говорящие имена файлов и честный alt; смысловой текст не заперт в картинках
• Hero/OG-картинки от 1200px — для попадания в Discover
• Схема ImageObject с лицензией/автором на оригинальных визуалах
• Картинки включены в sitemap; AI-изображения маркированы и не имитируют пруфы