Оптимизация изображений для SEO в 2026: ALT, WebP, AVIF и lazy-load

На большинстве сайтов, которые приходят ко мне на аудит, картинки — это 30–60% веса страницы и одновременно самая запущенная часть оптимизации. Alt-атрибутов нет, форматы — десятилетней давности JPG, ленивая загрузка либо отсутствует, либо настроена так, что ломает LCP. И это при том, что инструменты для оптимизации картинок в 2026 уже встроены практически во все CMS и CDN — нужно просто их включить.

В этой статье собрал то, что реально влияет на ранжирование и Core Web Vitals, и убрал то, что давно перестало работать.

Зачем вообще оптимизировать картинки для SEO

Три прямых эффекта, которые я вижу на проектах:

1. Поиск по картинкам. Яндекс.Картинки и Google Images дают 5–15% дополнительного трафика на e-commerce и информационных сайтах. Без корректных alt и подписей этот трафик просто не приходит.
2. Core Web Vitals. LCP (Largest Contentful Paint) — в 80% случаев это изображение в первом экране. Не оптимизированное — провал в Google PageSpeed и косвенно в ранжировании.
3. Поведенческие факторы. Медленная загрузка картинок = pogo-sticking. Пользователь не дождётся прогрузки и уйдёт обратно в выдачу — а это сигнал, который Яндекс отслеживает напрямую.

ALT-атрибут: что писать и чего не писать

Главное заблуждение — что alt пишется «для поисковика». Изначально это текстовая альтернатива для скринридеров (для слабовидящих пользователей). Поисковики используют его как дополнительный сигнал релевантности, но не как место для переспама ключами.

Мои правила alt:

• Описывайте картинку буквально. «Угловой диван серого цвета в интерьере гостиной», а не «купить диван Москва недорого».
• Длина 5–15 слов. Слишком короткий alt бесполезен, слишком длинный обрезается скринридерами.
• Уникальность. Каждой картинке — свой alt. Если на странице 20 фото товара — 20 разных alt: «вид спереди», «вид сбоку», «крупный план обивки» и так далее.
• Без переспама. Один ключевой запрос на alt, не больше. Лучше — ноль ключей, но точное описание.
• Декоративные картинки — пустой alt (alt=""). Это сигнал скринридеру пропустить элемент. Не нужно писать alt="декоративная картинка".

Проверить alt на конкретной странице (своей или конкурента) можно моим бесплатным сервисом — он вытаскивает все картинки со страницы и показывает, у каких alt пустой, дублируется или явно переспамлен.

Форматы: WebP, AVIF, JPG, PNG — что выбирать

В 2026 правильный ответ почти всегда — AVIF с фолбэком на WebP, без JPG и PNG там, где можно без них обойтись. Конкретика:

• AVIF — лучший по сжатию (на 30–50% легче WebP при том же качестве). Поддерживается всеми актуальными браузерами с 2023 года. Используйте как основной формат.
• WebP — фолбэк для старых браузеров и для случаев, где AVIF не поддерживает ваш CDN. На 25–35% легче JPG.
• JPG — оставляйте только для случаев, когда нужна максимальная совместимость (например, картинки для outlook-рассылок).
• PNG — только для изображений с прозрачностью и графики (логотипы, иконки). Для фотографий PNG в 2026 — это убийство Core Web Vitals.
• SVG — для всей векторной графики: иконки, схемы, простые иллюстрации. Весит копейки и масштабируется без потерь.

В HTML это выглядит через <picture> с несколькими <source>:

<picture>
  <source srcset="/images/hero.avif" type="image/avif">
  <source srcset="/images/hero.webp" type="image/webp">
  <img src="/images/hero.jpg" alt="Описание картинки" width="1200" height="630" loading="lazy">
</picture>

Браузер выбирает первый поддерживаемый формат — никаких JS, никаких костылей.

Размеры файлов: ориентиры на 2026

Что я считаю нормой для своих проектов:

• Hero/первый экран — до 150 КБ в AVIF (или 250 КБ в WebP).
• Контентные картинки в статьях — до 80 КБ.
• Превью и миниатюры — до 30 КБ.
• Иконки и UI-графика — только SVG, размер не нормирую.

Если картинка весит больше — нужно либо пересжать, либо уменьшить физический размер. Загружать фото 4000×3000 пикселей, чтобы потом масштабировать его CSS-ом до 600×400, — это самый распространённый антипаттерн, который я встречаю.

Lazy-load: где включать, а где категорически нельзя

loading="lazy" — встроенная браузерная ленивая загрузка. Поддерживается всеми браузерами с 2022 года, не требует JS-библиотек.

Правила, которые я никогда не нарушаю:

• На LCP-картинке (главное изображение в первом экране) — НИКОГДА не ставить loading="lazy". Это самая частая ошибка, которая убивает Core Web Vitals: браузер откладывает загрузку картинки, и LCP уезжает с 1.5 секунд до 3+. Для hero-изображения, наоборот, ставьте loading="eager" и fetchpriority="high".
• На всех картинках ниже первого экрана — loading="lazy". Это базовая гигиена.
• Всегда указывайте width и height. Без них браузер не зарезервирует место под картинку, и страница будет «прыгать» при загрузке — это убивает CLS (Cumulative Layout Shift).

Имена файлов и пути

Маленькое, но недооценённое. IMG_4827.jpg и seroe-uglovoe-divan-v-interiere.jpg — это разные сигналы для поисковика.

• Используйте транслит или английский, без пробелов, через дефис. kraskoraspylitel-elektricheskij.webp, а не Краскораспылитель электрический.WebP.
• Один-два ключевых слова в имени файла, без переспама.
• Структурированные пути: /images/products/divany/uglovye/seryj-pravyj.avif лучше, чем все картинки в /img/.

Что точно перестало работать

Список устаревших советов, которые до сих пор встречаются в гайдах:

• «Поставьте микроразметку ImageObject везде» — Google игнорирует её для большинства типов страниц с 2024 года. Размечайте только там, где это реально влияет на сниппет (товары, рецепты, статьи).
• «Используйте 10 синонимов в alt» — переспам, риск пессимизации.
• «Заливайте картинки в отдельный поддомен для скорости» — устарело, HTTP/2 и HTTP/3 убрали этот эффект.
• «PNG для контентных картинок, чтобы не было артефактов» — JPG/WebP/AVIF при правильном уровне сжатия неотличимы от PNG для фотографий, при этом весят в 5–10 раз меньше.

Чек-лист для самостоятельной проверки

Прогоните свой сайт по этим пунктам — если все «да», вы уже в верхних 20% рунета по работе с картинками:

• У каждой контентной картинки есть осмысленный alt
• LCP-картинка загружается без loading="lazy", с fetchpriority="high"
• Все остальные картинки — с loading="lazy"
• У всех <img> указаны width и height
• Используется AVIF или WebP вместо JPG
• Картинки сжаты до разумного размера (не 4000px для блока 600px)
• Имена файлов в транслите, через дефис
• Декоративные картинки — с пустым alt или в CSS как background

Подробнее про комплексную техническую гигиену — в моём гайде по техническому SEO 2026.

Что в итоге

Картинки — это низковисящий фрукт в SEO. Эффект от грамотной работы с alt, форматами и lazy-load часто заметен уже через 2–4 недели после переобхода: рост позиций на 1–3 пункта по средне- и низкочастотным запросам, рост трафика из Яндекс.Картинок, прирост по Core Web Vitals на 15–30 пунктов.

Если хотите, чтобы я разобрал ваш сайт по картинкам и Core Web Vitals — напишите мне или закажите технический аудит.