Alt-текст изображения

Alt-текст изображения — атрибут `alt` тега `<img>`. Текстовое описание картинки для поисковиков, людей с нарушениями зрения (через screen reader) и при ошибке загрузки.

Зачем нужен

1. SEO — Google индексирует картинки и показывает их в Image Search. Alt — основной сигнал о чём картинка. 2. Accessibility — пользователи screen-reader'ов «слышат» alt-текст. 3. Fallback — при невозможности загрузить изображение пользователь видит alt-текст. 4. GEO/AI — AI-системы (особенно мультимодальные) используют alt для понимания контекста картинки.

Хороший alt

• •Описательный — рассказывает что на картинке
• •Краткий — 5-15 слов оптимально
• •Содержит ключевое слово — если уместно, без переспама
• •Контекстный — учитывает контекст страницы

Примеры

❌ Плохо: `<img src="seo.jpg" alt="seo">` ❌ Плохо: `<img src="audit.jpg" alt="seo аудит купить заказать москва недорого">` (спам) ✅ Хорошо: `<img src="audit.jpg" alt="Скриншот SEO-аудита сайта в Google Search Console: график трафика за 90 дней">`

Когда alt не нужен

Декоративные картинки (фоны, разделители, иконки без смысла) должны иметь `alt=""` (пустой). Это говорит screen-reader'у «можно пропустить».

<img src="divider.svg" alt="" role="presentation">

Топ ошибок

1. alt отсутствует — критичная ошибка accessibility и SEO 2. alt с именем файла — `alt="IMG_4521.jpg"` бесполезно 3. alt-спам ключами — Google понижает страницу 4. Длинный alt (>150 символов) — для описаний используйте `figcaption` 5. alt одинаковый у всех картинок — снижает релевантность

Как проверить

Lighthouse Audit → раздел Accessibility → «Image elements do not have [alt] attributes». Screaming Frog → закладка Images → Missing Alt Text.