Как да напишеш добър алтернативен текст за изображения

За какво служи алтернативният текст

Алтернативният текст е текстовата алтернатива на изображението, записана в атрибута alt. Екранните четци го четат на глас, брайловите дисплеи го показват, а браузърът го показва, когато изображението не се зареди. Търсачките също могат да го използват. Уеб стандартът за достъпност WCAG изисква текстова алтернатива, която върши същата работа като изображението (критерий за успех 1.1.1, ниво A).

Основната идея: алтернативният текст не е надпис и не е описание на картината само по себе си. Той казва какво добавя изображението към страницата. Една и съща снимка може да има нужда от различен алтернативен текст на две страници или от никакъв.

Четири вида изображения

• Информативните изображения добавят смисъл: снимка, иконка до телефонен номер, диаграма. Напиши кратък алтернативен текст, който предава този смисъл.
• Функционалните изображения стоят във връзки и бутони. Алтернативният текст назовава действието или целта, а не картината: „Търсене“ за лупа, „Отпечатай тази страница“ за иконка на принтер.
• Декоративните изображения не добавят нищо: рамка, разделител, орнамент или картина, която само повтаря текста до нея. Дай им празен атрибут alt (alt=""), за да ги пропускат екранните четци, или ги сложи в стиловия файл като фон.
• Изображенията на текст са последна мярка. Ако ти трябва такова, алтернативният текст повтаря думите в изображението. Лого, което не е връзка, получава името на организацията.

Как да напишеш добър алтернативен текст

1. 1Попитай се защо изображението е на страницата. Какво би пропуснал посетителят, ако го нямаше?
2. 2Напиши това, което е важно за тази цел, с израз или с едно изречение.
3. 3Започни със съдържанието. Екранният четец обикновено съобщава, че нещо е изображение, затова „изображение на“ или „снимка на“ рядко помага.
4. 4Не повтаряй това, което текстът до изображението вече казва. Ако той казва всичко, изображението е декоративно и получава празен alt.
5. 5Прочети алтернативния текст на глас, без да гледаш страницата. Има ли смисъл сам по себе си?

Чести грешки

• Изобщо няма атрибут alt. Тогава някои екранни четци прочитат името на файла.
• Име на файл или код като алтернативен текст, например „IMG_2041.jpg“.
• Един и същ низ от ключови думи на много изображения. Алтернативният текст е преди всичко за хората.
• Дълго описание на чисто декоративно изображение.
• Описание на външния вид на изображение-бутон вместо на действието му. Бутонът за търсене не е „лупа“, а „Търсене“.

Колко дълъг да бъде?

WCAG 1.1.1 не посочва брой знаци. Съветът на W3C е да е кратък, в идеалния случай израз или изречение. За графики и други сложни изображения дай пълната информация като текст на страницата и дръж алтернативния текст кратък. Ако ти трябва повече от едно изречение, изображението вероятно носи съдържание, чието място е в текста на страницата.

Провери сайта си

За да намериш изображения без полезен алтернативен текст, пусни безплатната Проверка на алтернативни текстове за една страница. За да получиш предложения за много изображения, използвай Генератора на алтернативен текст. Автоматичното предложение може да пропусне това, което е важно на страницата ти, затова прочети всеки текст и го промени, когато не отговаря на целта на изображението.

Инструментите на Do4U помагат с писането, а не с решението: дали едно изображение е информативно, функционално или декоративно, знаеш най-добре ти. Провери отново след големи промени в сайта си.