Альтернативний текст

Що це означає

Альтернативний текст - короткий опис зображення, записаний в атрибуті alt у коді сторінки. Екранний читач зачитує його незрячим користувачам, а браузер показує, якщо зображення не завантажилося.

За правилами доступності WCAG текстова альтернатива потрібна кожному зображенню, що несе інформацію, наприклад графіку, схемі чи фото товару. Суто декоративні зображення мають мати порожній alt, щоб читач не затримував користувача марно.

Альтернативний текст допомагає і SEO: пошуковики розуміють за ним, що на картинці, і можуть показати її в пошуку зображень. Проте головна мета - доступність, а не ключові слова.

Як це працює на практиці

Добрий альтернативний текст описує, що зображення означає в цьому контексті, а не як воно виглядає. Для графіка виручки недостатньо «графік», потрібно «виручка зросла з 1,2 до 1,8 мільйона євро у 2022-2024 роках», для логотипа досить назви компанії.

З 2025 року діє акт про доступність, що покладає обов'язки й на окремі приватні послуги, наприклад інтернет-магазини та банківські сервіси. Відсутні альтернативні тексти - одна з найчастіших помилок під час аудитів.

У системах керування контентом альтернативний текст вводиться під час завантаження зображення. Варто зробити його обов'язковим полем, щоб про нього не забували під час додавання контенту.

На що звернути увагу

Часта помилка - вставляти в alt список ключових слів або ім'я файлу, наприклад «IMG_2034.jpg». Такий текст не допомагає читачу, а пошуковики можуть вважати його маніпуляцією.

Якщо важливий текст є частиною зображення, наприклад ціна на банері, він має бути й в alt, а краще прямо в HTML. Інакше його не прочитає ні незрячий, ні пошуковик, а за адаптивного дизайну він до того ж часто губиться на мобільних.