Как писать alt-текст для картинок, созданных ИИ

Вы сделали картинку, она получилась именно такой, как нужно, а редактор страницы просит «alt-текст». Большинство вписывает имя файла, вставляет промпт или пропускает поле. Все три варианта впустую тратят это поле. Alt-текст - это несколько слов, которые заменяют картинку, когда её не видно: пользователю программы чтения с экрана, посетителю с медленным соединением, поисковой системе, которая читает страницу. Это короткий практичный способ написать его для картинок, которые вы создали сами.

Для чего на самом деле нужен alt-текст

У него одна задача: дать читателю то, что картинка даёт зрячему посетителю, там, где картинка стоит. Это не подпись (подпись видна всем и добавляет контекст) и не поле для ключевых слов. Поисковые системы его читают, и ясное честное описание помогает им понять страницу, но предложение, набитое поисковыми запросами, никому не помогает, а пользователи программ чтения с экрана замечают это сразу.

Простая формула

Задайте три вопроса в таком порядке и по ответам напишите одно простое предложение.

1. 01Что это? Главный объект обычными словами: керамическая кружка, маяк, столбчатая диаграмма.
2. 02Что важно здесь? Деталь, нужная странице: цвет товара, настроение обложки, тренд на диаграмме.
3. 03Что это за картинка? Только когда это меняет смысл: иллюстрация, 3D-рендер, рендер в стиле фото, акварель.

Укладывайтесь примерно в одно предложение. Не пишите «изображение» и «картинка»: программа чтения с экрана и так объявляет, что это изображение.

Информативная или декоративная: решите сначала

Прежде чем писать, спросите себя, несёт ли картинка информацию, которой нет в соседнем тексте. Фото товара на странице товара несёт. Спокойный абстрактный фон за заголовком - нет. Декоративной картинке нужен пустой атрибут alt (alt=""), который говорит вспомогательным программам её пропустить. Это лучше описания, из-за которого человеку трижды на странице зачитывают «фиолетовый градиент с мягким светом».

• Информативные: фото товаров, иллюстрации, что-то объясняющие, диаграммы, обложка статьи. Опишите их.
• Декоративные: текстуры, разделители, фоны для настроения, шапка, которая лишь повторяет заголовок. Оставьте alt пустым.
• Функциональные: картинка внутри ссылки или кнопки. Опишите, куда она ведёт или что делает, а не как выглядит.

Честно описывайте стиль

Сгенерированная картинка - не фотография реального места, и alt-текст не должен делать вид, что это так. Если стиль важен читателю, назовите его: «Иллюстрация маяка на утёсе в сумерках» или «Рендер товара: керамическая кружка на дубовом столе». Не пишите «фото» про то, что никогда не фотографировали. Смысл не в рекламе инструмента, а в том, чтобы не вводить в заблуждение человека, который не может проверить сам. Если вы публикуете сгенерированные картинки, руководство о том, как отличить ИИ-изображения раскрывает другую сторону этой честности.

Три примера

Фото товара

На странице магазина читателю нужно то, что увидел бы покупатель: цвет, форма, обстановка только если она важна.

Иллюстрация

Для обложки блога, которая задаёт настроение, хватит одного короткого предложения, а пустой alt тоже подходит, если заголовок уже всё говорит.

Картинка, похожая на диаграмму

Здесь картинка несёт данные, поэтому alt должен нести вывод. Будьте осторожны: модели рисуют то, что похоже на диаграммы, но их цифрам и подписям верить нельзя (почему так, объясняет руководство по рукам и тексту). Постройте настоящую диаграмму в инструменте для диаграмм и пишите alt по её реальным данным. Полные цифры поместите в таблицу или в текст рядом.

Промпт - это черновик, а не копия

Написанный вами промпт - полезный первый черновик, потому что в нём уже назван объект. Но не вставляйте его как есть. Хороший промпт - это рецепт для модели: в нём термины освещения, слова про камеру и теги стиля, которые ничего не говорят слушателю (о том, почему они помогают модели, рассказывает руководство по промптам). К тому же промпт описывает то, что вы хотели, а alt-текст должен описывать то, что действительно есть на готовой картинке. Модели отклоняются: у третьей кружки может не оказаться ручки. Посмотрите на результат, оставьте объект из промпта, уберите технические слова и поправьте всё, что вышло не так, как просили.

Краткий чек-лист

• Картинка информативная, декоративная или функциональная?
• Одно предложение, сначала объект, без «изображение».
• Деталь, нужная этой странице, а не все детали.
• Вид картинки назван, когда это важно (иллюстрация, рендер).
• Соответствует готовому изображению, а не только промпту.
• Никаких списков ключевых слов и имён файлов.

Что студия делает и чего не делает

Студия создаёт картинку, но не пишет за вас alt-текст и не добавляет его в скачиваемые файлы. Картинка приходит в 2K, а описание вы пишете там, где публикуете, ведь именно там известен контекст страницы. Это ваше решение: только вы знаете, зачем нужна картинка. Для работы с товарами и обложками посты про фотографию товаров и шапки для блога показывают изображения, к которым относится этот совет. Откройте студию, чтобы их создать, или загляните на страницу моделей, чтобы увидеть доступные стили.