SEO изображений: Полное руководство по Alt-тексту, именам файлов & оптимизации (2026)

Изображения — наименее оптимизированный элемент на среднестатистическом сайте. В то время как большинство владельцев сайтов тратят часы на совершенствование тегов title, мета-описаний и контент-стратегии, они загружают изображения с именем IMG_4832.jpg, пустыми атрибутами alt и размерами файлов, убивающими скорость страницы. В 2026 году SEO изображений — не опция — оно напрямую влияет на ваши позиции в Google, трафик из Google Картинок, показатели Core Web Vitals, соответствие требованиям доступности и на то, как системы ИИ понимают ваш контент.

Вот реальность: у 63% сайтов отсутствует или недостаточен alt-текст на изображениях. Большинство сайтов отдают изображения в 3-5 раз больше необходимого. И почти никто не внедряет Schema-разметку для изображений, хотя она может кардинально увеличить видимость в расширенных результатах и ответах, сгенерированных ИИ. Каждое неоптимизированное изображение — это упущенная возможность — для трафика, для позиций и для конверсий.

Это руководство охватывает все, что вам нужно знать о SEO изображений в 2026 году. Мы начинаем с основ — alt-текст и именование файлов — затем переходим к сжатию, выбору формата, технической реализации с реальными примерами кода, Schema-разметке и тому, как ИИ-поисковики интерпретируют изображения. Управляете ли вы сайтом-портфолио из 10 страниц или интернет-магазином с 50 000 товаров, это руководство дает вам практические стратегии для исправления SEO изображений уже сегодня.

Почему SEO изображений важно в 2026 году

SEO изображений — это не нишевая оптимизация. Это основа современной поисковой видимости. Вот почему сейчас это важнее, чем когда-либо.

Google Картинки генерирует огромный трафик. Google Картинки составляет 22,6% всех поисковых запросов Google. Это больше, чем YouTube, Google Карты и Google Новости вместе взятые. Если ваши изображения не оптимизированы, вы невидимы для почти четверти всей поисковой активности. Для электронной коммерции, продуктовой фотографии, рецептов, DIY-руководств и визуальных индустрий Google Картинки может быть крупнейшим единственным источником трафика.

Изображения напрямую влияют на скорость страницы. Изображения обычно являются самыми тяжелыми ресурсами на любой веб-странице, составляя в среднем 50-75% общего веса страницы. Неоптимизированные изображения разрушают ваши показатели Core Web Vitals — особенно Largest Contentful Paint (LCP), который является прямым фактором ранжирования Google. Страница, загружающая hero-изображение размером 2 МБ, когда WebP на 150 КБ выглядел бы идентично, саботирует собственные позиции.

Доступность — сигнал ранжирования. Alt-текст существует не только для SEO. Это юридическое требование в соответствии с законами о доступности, такими как ADA, Section 508 и Европейский акт о доступности (EAA), вступающий в силу в июне 2025 года. Скринридеры полагаются на alt-текст для описания изображений слабовидящим пользователям. Google все больше поощряет доступные сайты, а отсутствие alt-текста — одна из самых легко обнаруживаемых и наказуемых проблем доступности.

Системы ИИ используют изображения для понимания вашего контента. Мультимодальные модели ИИ — включая Google Gemini, GPT-4o и Claude — теперь могут интерпретировать изображения напрямую. Но они также сильно полагаются на alt-текст, имена файлов, подписи и окружающий текст для понимания контекста изображения. Правильная оптимизация изображений делает ваш контент более понятным для систем ИИ, увеличивая ваши шансы быть процитированным в ответах, сгенерированных ИИ.

Alt-текст: Полное руководство

Alt-текст (альтернативный текст) — это HTML-атрибут, описывающий содержание и назначение изображения. Он добавляется к тегу <img> через атрибут alt. Когда скринридер встречает изображение, он читает alt-текст вслух. Когда Google сканирует вашу страницу, он использует alt-текст как основной сигнал для понимания того, что изображает картинка и как она соотносится с содержанием страницы.

Alt-текст одновременно является самым простым и самым эффективным элементом SEO изображений. Написание хорошего alt-текста занимает 10 секунд на изображение, однако большинство сайтов либо полностью его пропускают, либо пишут настолько плохо, что он не дает никакой ценности. Давайте это исправим.

Формула alt-текста

Используйте эту формулу для стабильно эффективного alt-текста:

[Конкретный дескриптор] + [Субъект] + [Контекст/Действие] + [Релевантная деталь]

Примеры с использованием формулы:

• Товар: «Красная кожаная сумка через плечо с золотой цепочкой на мраморной поверхности»
• Человек: «Шеф-повар готовит свежую пасту на кухне ресторана»
• График: «Столбчатая диаграмма, показывающая рост органического трафика на 47% с января по июнь 2026»
• Скриншот: «Отчет о производительности Google Search Console, показывающий 12 000 кликов в марте 2026»
• Лайфстайл: «Женщина бежит по прибрежной тропинке на закате в кроссовках Nike Pegasus 42»

Alt-текст: что делать и чего не делать

Примеры кода alt-текста

Хороший alt-текст для товарного изображения:

<img
  src="tissot-prx-blue-dial-40mm.webp"
  alt="Автоматические часы Tissot PRX с синим солнечным циферблатом и интегрированным стальным браслетом, 40мм"
  width="800"
  height="800"
  loading="lazy"
>

Хороший alt-текст для информационного изображения:

<img
  src="core-web-vitals-scores-chart.webp"
  alt="График сравнения показателей Core Web Vitals до и после оптимизации изображений, LCP улучшился с 4,2с до 1,8с"
  width="1200"
  height="600"
  loading="lazy"
>

Декоративное изображение (пропустить alt-текст):

<!-- Декоративный разделитель — alt-текст не нужен -->
<img src="decorative-wave.svg" alt="" role="presentation">

Именование файлов для SEO

Имена файлов изображений — подтвержденный сигнал ранжирования Google. Google прямо заявляет, что использует имена файлов для понимания содержания изображений. Еще до сканирования изображения его имя файла дает Google сильный начальный сигнал о том, что оно изображает. Файл с именем krasnaya-kozhanaya-sumka-vid-speredi.webp говорит Google гораздо больше, чем foto-tovara-3.jpg.

Правила именования файлов

• Используйте дефисы для разделения слов. Google воспринимает дефисы как разделители слов. Подчеркивания воспринимаются как соединители слов. sinie-krossovki = два слова. sinie_krossovki = одно длинное слово для Google.
• Включите целевое ключевое слово. Если страница таргетирует «кожаная сумка через плечо», изображение должно называться kozhanaya-sumka-cherez-plecho-korichnevaya.webp, а не foto-sumki.webp.
• Будьте описательны, но кратки. 3-6 слов — идеально. Избегайте как однословных имен (obuv.jpg), так и чрезмерно длинных (luchshaya-krasnaya-kozhanaya-sumka-cherez-plecho-dlya-zhenshchin-2026-vesna.webp).
• Используйте только строчные буквы. Некоторые серверы воспринимают Kartinka.jpg и kartinka.jpg как разные файлы. Всегда используйте строчные буквы во избежание ошибок 404 и проблем с дублированным контентом.
• Удалите специальные символы. Никаких пробелов, акцентов или специальных символов. Используйте только буквы, цифры и дефисы.
• Добавляйте дескрипторы вариантов. Для товарных изображений с несколькими ракурсами: kozhanaya-sumka-pered.webp, kozhanaya-sumka-bok.webp, kozhanaya-sumka-detal-strochka.webp.

Сжатие изображений & производительность

Сжатие изображений — самый значительный выигрыш в скорости страницы для большинства сайтов. Средняя веб-страница отдает 1,5-3 МБ изображений. При правильном сжатии вы можете снизить это до 200-400 КБ без видимой потери качества. Влияние на Core Web Vitals — особенно LCP (Largest Contentful Paint) — немедленное и значительное.

Существует два типа сжатия:

Сжатие с потерями безвозвратно удаляет некоторые данные изображения для достижения меньшего размера файлов. При настройках качества 75-85% потеря качества незаметна для человеческого глаза, но размеры файлов падают на 60-80%. JPEG, WebP (с потерями) и AVIF используют сжатие с потерями.

Сжатие без потерь уменьшает размер файла без удаления данных изображения. Распакованное изображение пиксельно идентично оригиналу. Экономия размера файла меньше (10-30%), но качество полностью сохраняется. PNG, WebP (без потерь) и AVIF (без потерь) поддерживают этот режим. Используйте без потерь для логотипов, иконок, скриншотов с текстом и любого изображения, где важна точная попиксельная воспроизводимость.

Рекомендуемые настройки качества

• Фотографии: WebP при качестве 80% (или AVIF при 65%). Визуально неотличимы от оригинала, но на 70-80% меньше.
• Товарные изображения: WebP при качестве 85% (или AVIF при 70%). Чуть выше качество для сохранения деталей при принятии решения о покупке.
• Скриншоты & изображения с текстом: PNG или WebP без потерь. Текст должен оставаться четким и читаемым.
• Логотипы & иконки: SVG (вектор) по возможности. Если растровый формат, используйте PNG или WebP без потерь.
• Hero-изображения: WebP при качестве 80%, поданные максимум в 2x размере отображения. Hero, отображаемый при ширине 1200px, должен подаваться максимум при 2400px.

Инструменты сжатия

• Squoosh (squoosh.app): Бесплатный браузерный оптимизатор изображений от Google. Поддерживает сравнение бок о бок, все современные форматы. Лучше всего для ручной оптимизации отдельных изображений.
• ShortPixel: Автоматический плагин WordPress и API. Массово оптимизирует существующие изображения и конвертирует в WebP/AVIF при загрузке. Лучше всего для сайтов на WordPress.
• ImageOptim (macOS) / FileOptimizer (Windows): Настольные приложения для пакетной оптимизации. Удаляют метаданные и применяют оптимальное сжатие.
• Cloudflare Polish: Автоматическая оптимизация изображений на уровне CDN. Не требует изменений кода. Лучше всего для сайтов, уже использующих Cloudflare.
• sharp (npm): Библиотека Node.js для программной обработки изображений. Лучше всего для сборочных конвейеров и автоматизированных рабочих процессов.

Влияние оптимизации изображений

Рабочий процесс оптимизации изображений

Следуйте этому шестишаговому процессу для каждого публикуемого изображения:

Сравнение форматов изображений

Выбор правильного формата изображений — одно из самых эффективных решений для скорости страницы и качества изображений. Вот сравнение четырех основных форматов веб-изображений в 2026 году:

Рекомендуемая стратегия на 2026 год: Используйте WebP как основной формат изображений. Подавайте AVIF как прогрессивное улучшение для поддерживающих браузеров с помощью элемента <picture>. Сохраняйте JPEG-резерв только если нужна поддержка очень старых браузеров или почтовых клиентов. Используйте SVG для всей векторной графики (логотипы, иконки, иллюстрации).

Техническая оптимизация изображений

Помимо alt-текста, имен файлов и сжатия, существует несколько технических HTML-реализаций, существенно влияющих на SEO изображений и производительность. Вот самые важные с готовыми примерами кода.

Отложенная загрузка (Lazy Loading)

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

<!-- Изображение ниже видимой области: отложенная загрузка -->
<img
  src="product-gallery-image-3.webp"
  alt="Задняя крышка Tissot PRX с автоматическим механизмом"
  width="800"
  height="800"
  loading="lazy"
  decoding="async"
>

<!-- Hero-изображение в видимой области: НЕ откладывать загрузку -->
<img
  src="hero-banner-spring-collection.webp"
  alt="Весенняя коллекция часов 2026 с Tissot и Maurice Lacroix"
  width="1200"
  height="600"
  loading="eager"
  fetchpriority="high"
>

Адаптивные изображения с srcset

Атрибут srcset позволяет браузерам выбирать наиболее подходящий размер изображения на основе ширины экрана и плотности пикселей устройства. Это предотвращает загрузку мобильными устройствами изображений десктопного размера:

<img
  src="product-watch-800w.webp"
  srcset="
    product-watch-400w.webp 400w,
    product-watch-800w.webp 800w,
    product-watch-1200w.webp 1200w,
    product-watch-1600w.webp 1600w
  "
  sizes="(max-width: 600px) 400px,
         (max-width: 1024px) 800px,
         1200px"
  alt="Tissot PRX 40мм автоматические с зеленым циферблатом"
  width="1200"
  height="1200"
  loading="lazy"
>

Элемент picture (мульти-формат + арт-дирекция)

Элемент <picture> позволяет подавать разные форматы изображений и даже разные кадрирования в зависимости от поддержки браузера и размера экрана. Это рекомендуемый подход для подачи AVIF с резервом WebP:

<picture>
  <!-- AVIF: лучшее сжатие, для поддерживающих браузеров -->
  <source
    type="image/avif"
    srcset="hero-collection.avif"
  >
  <!-- WebP: отличное сжатие, широкая поддержка -->
  <source
    type="image/webp"
    srcset="hero-collection.webp"
  >
  <!-- JPEG: универсальный резерв -->
  <img
    src="hero-collection.jpg"
    alt="Весенняя коллекция люксовых часов 2026 на бархате"
    width="1200"
    height="600"
    loading="lazy"
  >
</picture>

Предотвращение сдвига макета (CLS)

Всегда включайте атрибуты width и height в теги <img>. Это позволяет браузеру вычислить соотношение сторон изображения и зарезервировать правильное пространство до загрузки изображения, предотвращая Cumulative Layout Shift (CLS) — один из трех Core Web Vitals:

<!-- Хорошо: width и height предотвращают сдвиг макета -->
<img
  src="blog-post-cover.webp"
  alt="Скриншот результатов аудита SEO изображений в seoscore.tools"
  width="1200"
  height="630"
  loading="lazy"
>

<!-- Тоже хорошо: CSS aspect-ratio как альтернатива -->
<style>
  .responsive-img {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }
</style>

6 столпов SEO изображений

Schema-разметка изображений

Schema для изображений (ImageObject) сообщает поисковым системам и системам ИИ, что именно представляют ваши изображения, кто их создал и какую лицензию они несут. Если alt-текст предоставляет описание для людей, Schema-разметка дает машиночитаемые структурированные данные, которые поисковые системы могут использовать для расширенных результатов, каруселей изображений и улучшенных визуальных поисковых листингов.

Schema ImageObject

Используйте Schema ImageObject для самостоятельных изображений, которые вы хотите проиндексировать с полными метаданными:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "ImageObject",
  "contentUrl": "https://example.com/images/tissot-prx-blue-40mm.webp",
  "name": "Tissot PRX Автоматические Синий Циферблат 40мм",
  "description": "Вид спереди автоматических часов Tissot PRX с синим солнечным циферблатом и интегрированным стальным браслетом, диаметр корпуса 40мм",
  "width": 1200,
  "height": 1200,
  "encodingFormat": "image/webp",
  "creator": {
    "@type": "Organization",
    "name": "Gazelli Saat"
  },
  "copyrightHolder": {
    "@type": "Organization",
    "name": "Gazelli Saat"
  },
  "license": "https://example.com/image-license"
}
</script>

Schema товарного изображения

Для электронной коммерции товарные изображения должны быть указаны внутри Schema Product через свойство image. Это включает расширенные результаты Google Покупок, карусели товаров на основе изображений и функции визуального поиска:

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Product",
  "name": "Tissot PRX Автоматические Синий Циферблат 40мм",
  "image": [
    "https://example.com/images/tissot-prx-blue-front.webp",
    "https://example.com/images/tissot-prx-blue-side.webp",
    "https://example.com/images/tissot-prx-blue-wrist.webp"
  ],
  "description": "Автоматические часы Tissot PRX с синим солнечным циферблатом...",
  "brand": {
    "@type": "Brand",
    "name": "Tissot"
  },
  "offers": {
    "@type": "Offer",
    "price": "650.00",
    "priceCurrency": "USD",
    "availability": "https://schema.org/InStock"
  }
}
</script>

Типы Schema для изображений

Приоритеты типов изображений

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

SEO изображений для ИИ-поиска

В 2026 году оптимизация изображений уже не касается только традиционного краулера Google. Мультимодальные системы ИИ — включая GPT-4o, Google Gemini и Claude — могут интерпретировать изображения напрямую. Но даже эти продвинутые системы сильно полагаются на текстовые сигналы вокруг ваших изображений для формирования полного понимания вашего контента.

Как системы ИИ интерпретируют изображения на вашем сайте:

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

Окружающий текст для уточнения. Системы ИИ читают текст непосредственно до и после изображения для установления контекста. Изображение рядом с абзацем о «ценах Tissot PRX в 2026» понимается иначе, чем то же изображение в разделе о «сравнении часовых механизмов». Расположение изображений относительно текста имеет значение.

Подписи как подкрепление. Подписи к изображениям (элемент <figcaption>) предоставляют дополнительный слой контекста, используемый и пользователями, и системами ИИ. Подписи читаются посетителями чаще, чем основной текст, а системы ИИ рассматривают их как описания с высокой степенью доверия. Используйте подписи для добавления контекста, дополняющего (не дублирующего) alt-текст.

Schema-разметка как структурированные данные. Системы ИИ, особенно Google Gemini и AI Overview, могут разбирать Schema.org разметку для извлечения структурированной информации об изображениях. ImageObject, Product.image и другие типы Schema дают системам ИИ машиночитаемые метаданные, выходящие за рамки alt-текста — включая лицензирование, дату создания, информацию о создателе и размеры изображения.

<!-- ИИ-оптимизированная реализация изображения -->
<figure>
  <picture>
    <source type="image/avif" srcset="seo-audit-results.avif">
    <source type="image/webp" srcset="seo-audit-results.webp">
    <img
      src="seo-audit-results.jpg"
      alt="Панель SEO-аудита с общим баллом 92 и детализацией: техническое SEO 95, контент 88, обратные ссылки 91"
      width="1200"
      height="675"
      loading="lazy"
    >
  </picture>
  <figcaption>
    Результаты SEO-аудита для example.com после внедрения рекомендаций по оптимизации изображений.
    Балл улучшился с 67 до 92 за 4 недели.
  </figcaption>
</figure>

Распространенные ошибки SEO изображений

Большинство сайтов допускают как минимум три из этих ошибок. Каждая из них незаметно стоит вам трафика, позиций и ИИ-видимости. Вот наиболее вредные ошибки SEO изображений и способы их исправления:

• Полное отсутствие alt-текста. Атрибут alt опущен в теге <img>. Это и нарушение доступности, и провал SEO. Решение: добавьте описательный alt-текст к каждому контентному изображению. Используйте alt="" только для действительно декоративных изображений.
• Alt-текст, набитый ключевыми словами. Написание alt-текста вроде alt="купить часы дешево часы онлайн лучшие часы Tissot часы скидка часы". Это спам, бесполезно для доступности и может вызвать санкции Google. Решение: пишите естественный, описательный alt-текст, один раз естественно включающий основное ключевое слово.
• Подача несжатых изображений. Загрузка изображений напрямую с камеры или из дизайн-инструмента без сжатия. Одно несжатое фото может весить 5-15 МБ, тогда как сжатый WebP-эквивалент — 100-200 КБ. Решение: пропускайте каждое изображение через Squoosh или ShortPixel перед загрузкой. Стремитесь к менее 100 КБ на изображение.
• Использование только JPEG и PNG. Неподача современных форматов, таких как WebP или AVIF. Современные форматы предлагают на 25-50% меньшие размеры файлов при равном качестве. Решение: конвертируйте все изображения в WebP. Используйте элемент <picture> для подачи AVIF с резервом WebP.
• Отложенная загрузка LCP-изображения. Применение loading="lazy" к hero-изображению или крупнейшему изображению в видимой области. Это задерживает Largest Contentful Paint и напрямую ухудшает показатель Core Web Vitals. Решение: никогда не откладывайте загрузку первого видимого изображения. Используйте fetchpriority="high" для hero-изображений.
• Отсутствие атрибутов width и height. Неуказание размеров изображения в HTML, что вызывает сдвиг макета при загрузке изображений. Это увеличивает ваш показатель CLS (Cumulative Layout Shift). Решение: всегда включайте атрибуты width и height, соответствующие внутренним размерам изображения.
• Общие имена файлов. Использование имен, сгенерированных камерой, таких как IMG_4521.jpg или DSC_0032.jpg. Они дают нулевую SEO-ценность. Решение: переименовывайте каждое изображение описательными ключевыми словами через дефис перед загрузкой.
• Одинаковый alt-текст для каждого изображения. Дублирование идентичного alt-текста на нескольких изображениях одной страницы. Это выглядит как спам для поисковых систем и не дает дополнительного контекста. Решение: пишите уникальный alt-текст для каждого изображения, точно описывающий то, что оно показывает.
• Отсутствие карты сайта для изображений. Неключение изображений в XML-карту сайта, что снижает способность Google обнаруживать и индексировать их. Решение: добавьте записи изображений в существующую карту сайта или создайте отдельную карту для изображений с помощью тега <image:image>.
• Блокировка изображений в robots.txt. Случайный запрет директорий изображений или CDN-доменов в robots.txt. Если Google не может сканировать ваши изображения, они не появятся в результатах Google Картинок. Решение: проверьте robots.txt, чтобы убедиться, что директории изображений и CDN-домены не заблокированы.

Часто задаваемые вопросы

Ключевые выводы

1. Alt-текст — самый эффективный элемент SEO изображений. Пишите описательный alt-текст с ключевыми словами (5-15 слов) для каждого контентного изображения. Используйте пустой alt="" для декоративных. Никогда не оставляйте атрибут alt полностью отсутствующим.
2. Имена файлов важнее, чем вы думаете. Переименовывайте каждое изображение описательными ключевыми словами через дефис перед загрузкой. tissot-prx-blue-dial-40mm.webp бесконечно лучше IMG_4521.jpg.
3. WebP — стандартный формат 2026 года. Конвертируйте все изображения в WebP. Используйте элемент <picture> для подачи AVIF как прогрессивного улучшения. Стремитесь к менее 100 КБ на изображение.
4. Сжатие — самый большой выигрыш в скорости. Сжатие с потерями при качестве 80% уменьшает размеры файлов на 70-80% без видимой потери качества. Используйте Squoosh, ShortPixel или автоматические конвейеры.
5. Техническая реализация важна. Всегда включайте атрибуты width и height для предотвращения CLS. Используйте loading="lazy" для изображений ниже видимой области и fetchpriority="high" для hero-изображений. Внедрите srcset для адаптивной подачи.
6. Schema для изображений открывает расширенные результаты. Используйте Schema ImageObject для самостоятельных изображений и Product.image для электронной коммерции. Включайте несколько ракурсов в Schema товара для максимальной видимости.
7. Системы ИИ зависят от метаданных ваших изображений. Alt-текст, подписи, имена файлов и Schema-разметка — это то, как мультимодальные модели ИИ понимают ваши изображения. Оптимизируйте их, и ваш контент станет более ценным для каждой ИИ-поисковой платформы. Используйте seoscore.tools для аудита SEO изображений по всем этим направлениям.