В этой статье мы рассмотрим основные принципы создания эффективного альтернативного текста для изображений.
Что такое альтернативный текст?
Альтернативный текст, или атрибут alt в HTML-разметке, используется для описания изображений на веб-страницах. Он предназначен для скрин-ридеров и пользователей, которые не могут загрузить изображения из-за медленного интернет-соединения или других технических проблем. Вместо изображения они видят текст, указанный в атрибуте alt.
Как написать хороший alt-текст для изображений
Никогда не забывайте об альтернативном тексте
Каждое изображение на вашем сайте должно иметь атрибут alt. Это основное правило, которое обеспечивает доступность вашего контента для всех пользователей.
Используйте только заглавные буквы для аббревиатур
Если в альтернативном тексте есть аббревиатуры, пишите их заглавными буквами. Это позволяет скрин-ридерам правильно произносить каждую букву аббревиатуры. Например, такие аббревиатуры как «WHO», «NASA» или «HTML» должны быть написаны заглавными буквами.
Пустой атрибут alt для нерелевантных изображений
Если изображение не несет смысловой нагрузки или его описание не требуется для понимания контента, оставьте атрибут alt пустым:
<img src="https://image_link" alt="Основные подходы к написанию качественного альтернативного текста для изображений">Избегайте слов «image of» или «graphic of»
Не начинайте альтернативный текст со слов «image of» или «graphic of». Это создаёт излишние повторения и делает текст менее удобным для восприятия.
Например:
<img src="https://dog.jpg" alt="Image of a German Shepherd dog">Будет прочитано как:
«Image of a German Shepherd dog, image»
Лучше написать:
<img src="https://dog.jpg" alt="German Shepherd dog">Тогда скрин-ридер прочитает:
«German Shepherd dog, image»
Точность в определениях
Убедитесь, что ваш альтернативный текст точно и однозначно описывает изображение. Это поможет всем пользователям правильно понять, что изображено.
Будьте лаконичны
Создавая альтернативный текст, стремитесь к краткости и ясности. Переведите суть изображения максимально сжато, чтобы пользователи быстро получили нужную информацию.
Применение этих простых правил поможет вам создать эффективные и доступные описания для изображений на вашем сайте.
