Видео, изображения и инфографика: как использовать в контенте

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

Дайте понятное название, превью и объяснение, что показано. Для инструкции нужны условия применения, различимые действия и удобное управление. Субтитры или текстовое сопровождение помогают тем, кто не может смотреть со звуком.

Google способен обнаруживать видео через стандартные элементы страницы; VideoObject не является единственным способом сообщить о нём. Для видеорезультатов важны требования Google к доступной странице просмотра, видимому видео и доступу к ресурсам. Разметка дополняет сведения и не гарантирует показ. На товарной странице видео может оставаться полезным дополнением, даже если страница не предназначена прежде всего для просмотра.

Внешний плеер снимает часть нагрузки с вашего сервера, но может добавлять сторонние запросы и зависимость от доступности платформы. Собственный хостинг даёт контроль, но требует ресурсов для доставки файла.

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

Подбирайте размеры под место показа и экран. WebP или AVIF могут уменьшить размер файла, но итог зависит от изображения и настроек качества. Используйте адаптивные варианты и задавайте размеры, чтобы уменьшать сдвиги макета.

Alt описывает значимую для задачи информацию. Для чисто декоративного изображения W3C рекомендует пустой alt="". Для сложной схемы или графика одного короткого alt недостаточно: рядом нужны пояснение и данные. Не добавляйте в описания невидимые свойства, ключи и города ради SEO.

У графика должны быть источник, период, единицы и понятная шкала. Не изображайте прогноз как измеренный результат. Важные сведения продублируйте доступным текстом или таблицей, чтобы их можно было прочитать, скопировать и проверить.

В галерее оставьте изображения, помогающие выбору: детали, разные состояния и ракурсы. Подписи должны объяснять различия. Не выдавайте стоковое или сгенерированное изображение за фотографию выполненного проекта. Если предлагаете код вставки инфографики, не прячьте в нём обязательную рекламную ссылку.

Для условной настройки формы может хватить трёх скриншотов: нужное поле, заполненный пример без персональных данных и проверка успешного результата. Декоративное видео на первом экране не добавит ответа.

Сначала напишите короткие шаги и поясните ошибки. Затем добавьте изображения к тем местам, которые трудно объяснить словами. Проверьте, читаются ли подписи на телефоне и совпадают ли скриншоты с описанной версией.

• Медиа решает конкретную задачу и соответствует тексту.
• Источник и право использования проверены.
• Важная информация доступна без звука и вне картинки.
• Управление работает с клавиатуры и на телефоне.
• Размеры файлов и влияние плеера проверены.
• Содержимое первого экрана не задерживается неоправданной загрузкой; главное изображение не получает lazy loading по умолчанию.
• Разметка, подписи и видимое содержание не противоречат друг другу.

Core Web Vitals оценивайте по полевым данным, а лабораторную проверку используйте для диагностики. Один хороший тест не описывает опыт всех посетителей.