Нейросети работают не только с текстом. Но извлечь конкретный факт из графика или таблицы ИИ может только тогда, когда рядом есть машиночитаемый контекст: корректный alt, подпись figcaption, разметка caption/th/scope и число в HTML-тексте. Прятать данные только в PNG или SVG — значит отдавать их исключительно пользователям-людям, но не AI-краулерам.

Почему ИИ не «видит» данные внутри картинки?

ИИ-краулер получает HTML-документ, разбирает текст и разметку, но не распознаёт цифры, нарисованные внутри изображения. Если вы опубликовали столбчатую диаграмму с ростом показателей на 37%, а в HTML рядом нет этого числа — для модели оно просто не существует. Это не особенность какого-то одного поисковика: все AI-системы опираются на текстовый и структурированный слой страницы при извлечении фактов.

Google прямо указывает: для сложных изображений — графиков и диаграмм — рекомендуется краткий alt плюс подробное объяснение в тексте1. Это означает, что ключевые числа должны присутствовать в HTML-тексте рядом с визуализацией, а не только в самом изображении.

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

Как правильно написать alt для графика или диаграммы?

Что должен содержать информативный alt

Информативный alt описывает содержание, вывод и ключевые цифры изображения — но не превращается в перечисление ключевых слов. Google подчёркивает: alt должен быть полезным и информативным в контексте страницы; keyword stuffing в alt вреден2.

Плохой и хороший пример alt

Плохой пример: alt="график роста" — ничего не сообщает о данных.

Хороший пример: alt="Столбчатая диаграмма: ежемесячный охват ИИ-сервисов в РФ в октябре 2025 — 26% населения 12+, ежедневный — 5%" — и в этом случае конкретные числа дополнительно продублированы в тексте абзаца или в figcaption.

Формула alt для графика

Формула для alt графика: тип визуала + главный показатель + ключевая цифра + контекст (период/выборка). Затем в поясняющем абзаце или figcaption — вывод и условия.

Зачем нужны figure и figcaption?

Семантическая связь подписи с изображением

figure — HTML-элемент для самодостаточного контента, figcaption — подпись, семантически связанная именно с этим блоком3. Эта связь важна: краулер понимает, что подпись относится к конкретному изображению, а не к произвольному тексту на странице.

Что включить в figcaption

figcaption должен содержать вывод, а не просто повтор alt. Включите: что показывает график, период, источник и главный вывод. Пример: «Данные Mediascope, октябрь 2025. Ежемесячный охват ИИ-сервисов в РФ — 26% населения старше 12 лет.»

Подпись без сути («Рис. 1») или без периода/источника не добавляет ценности ни пользователю, ни ИИ.

Как оформить таблицу, чтобы ИИ правильно понял отношения между данными?

Семантически размеченная таблица позволяет ИИ понять, какой показатель соответствует какой строке и колонке. Для этого нужны: caption (заголовок таблицы), thead/tbody, ячейки th с атрибутом scope4.

ЭлементНазначениеПример значения
captionЗаголовок таблицы, даёт доступное имя всей таблице5«Охват ИИ-сервисов по возрастным группам, РФ, окт 2025»
thead / th scope="col"Заголовки столбцов, связывают данные с метриками«Возрастная группа», «Месячный охват», «Ежедневный охват»
th scope="row"Заголовок строки, связывает данные с объектом«12–17 лет», «18+ лет»
tbodyТело таблицы с даннымиЧисловые значения

Почему div-таблица и скриншот ломают связи

Таблица через div-ы или скриншот таблицы — ломает все семантические связи. Краулер видит текст, но не понимает, что «26%» относится к метрике «месячный охват», а не к чему-то другому.

Дополнительный сигнал через Schema.org Table

Google использует structured data для понимания контента и сущностей6, а в Schema.org есть тип Table7 — его можно добавить через JSON-LD для дополнительного сигнала о природе блока.

Что делать, если данные отображаются только в виде графика?

Структура блока с графиком

Дублируйте ключевые числа в HTML — это правило без исключений. Структура блока с графиком:

  1. Поясняющий абзац перед figure — одно-два предложения с ключевым выводом и цифрами в тексте.
  2. <figure> — оборачивает изображение и подпись.
  3. <img alt="..."> — краткое описание с главным числом.
  4. <figcaption> — развёрнутая подпись: вывод, период, источник.

Три независимых точки для извлечения числа

Такая структура обеспечивает три независимых точки, где ИИ может найти число: в тексте абзаца, в alt и в figcaption. Даже если одна из них будет проигнорирована, две другие дадут модели достаточно контекста.

Если вы пишете контент в GEO-стиле — подробнее об этом в материале «Как AI-поисковики выбирают источники: ранжирование фрагментов»: именно на уровне фрагментов происходит извлечение данных из вашей страницы.

Какие типичные ошибки убивают машиночитаемость визуального контента?

График только картинкой без чисел в HTML. Самая распространённая ошибка: всё значимое — в SVG или PNG, HTML-текст содержит лишь «Рис. 2». Для ИИ данных нет.

alt="график" или alt="диаграмма". Такой alt не несёт информации. Поисковик не понимает, что именно показывает изображение.

Таблица как скриншот или через <div>-ы. Визуально выглядит как таблица, семантически — просто набор текстовых блоков. Отношения «показатель → значение» утеряны.

Нет caption, th, scope. Без этих атрибутов краулер видит числа, но не знает, что они означают: нет связи между заголовком столбца и значением ячейки4.

Подпись без сути, периода, вывода. figcaption вида «Источник: наш отчёт» не даёт модели ничего полезного. Нужен контекст: что измерялось, когда, каков вывод.

«По данным исследования» без даты, числа, ссылки. Такие фразы снижают доверие к фрагменту: ИИ не может проверить или процитировать неопределённый источник.

Как связать визуальные данные с семантической разметкой страницы?

Изображение и таблица — части более широкого структурного контекста. Семантическая вёрстка HTML5 для нейросетей описывает, как section, article, main помогают ИИ понять принадлежность данных к теме. Блок с графиком, вложенный в section с заголовком-вопросом, сообщает краулеру: «вот раздел, вот данные, вот их смысл».

Минимальная структура семантического блока с данными:

<section>
  <h2>Какой охват ИИ-сервисов в РФ в 2025 году?</h2>
  <p>По данным Mediascope, в октябре 2025 ежемесячный охват ИИ-сервисов в России составил 26% населения старше 12 лет, ежедневный — 5%.</p>
  <figure>
    <img src="ai-coverage-russia-2025.png"
         alt="Охват ИИ-сервисов в РФ, октябрь 2025: 26% месячный, 5% ежедневный">
    <figcaption>Ежемесячный и ежедневный охват ИИ-сервисов в России, октябрь 2025. Источник: Mediascope / adindex.ru.</figcaption>
  </figure>
</section>

Число «26%» появляется трижды: в тексте абзаца, в alt, в figcaption. Это не дублирование ради дублирования — это три независимых машиночитаемых сигнала об одном факте.

Чек-лист: проверьте машиночитаемость визуального контента

  • Все ключевые цифры продублированы в HTML-тексте рядом с изображением
  • alt содержит тип визуала, главный показатель и цифру — без keyword stuffing
  • Изображение обёрнуто в <figure>, подпись — в <figcaption> с выводом и источником
  • Таблицы оформлены через <table> с <caption>, <thead>, <th scope="col/row">
  • Нет таблиц в виде скриншотов или <div>-грида
  • Фраза «по данным исследования» содержит дату и числовое значение
  • Рассмотрена разметка Schema.org Table для ключевых таблиц

Правильно оформленный мультимодальный контент — один из элементов E-E-A-T и технической готовности сайта к AI-поиску. Если вы хотите проверить, как ИИ-поисковики видят ваш контент сейчас — платформа GeoWatch делает GEO-аудит: определяет, какие страницы и блоки попадают в AI-ответы, а какие остаются невидимыми из-за технических проблем с разметкой.

Источники

Footnotes

  1. Google Technical Writing Accessibility — Write alt text — developers.google.com ↗ (дата доступа: 17 апр 2025) ↩
  2. Google Search Central — Google Images guidance — developers.google.com ↗ (дата доступа: 2026-06-03) ↩
  3. MDN Web Docs — <figure> element — developer.mozilla.org ↗ (дата доступа: 24 апр 2026) ↩
  4. MDN Web Docs — Table accessibility — developer.mozilla.org ↗ (дата доступа: 17 ноя 2025) ↩ ↩2
  5. MDN Web Docs — <caption> element — developer.mozilla.org ↗ (дата доступа: 24 апр 2026) ↩
  6. Google Search Central — Introduction to structured data — developers.google.com ↗ (дата доступа: 2026-06-03) ↩
  7. Schema.org — Table — schema.org ↗ (дата доступа: 2026-06-03) ↩