Категорії та норми для веб-інклюзивних груп користувачів

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

Доречі, коли я тільки почала ознайомлюватись з поняттям веб-інклюзивності, то чомусь орієнтувалася тільки на людей, у яких певні проблеми з зором, та аж ніяк не думала, що існує набагато більше груп захворювань, які належать до різноманітних категорій веб-інклюзивності. Згідно зі звітом WebAIM Million за 2024 рік, приблизно 96,3% з мільйона часто відвідуваних сторінок мають виявлені недоліки доступності. Це свідчить про те, що більшість сайтів можуть бути недоступними для багатьох користувачів з вадами слуху, зору, координації, неврології, або з обмеженнями мови. 

І хоч той самий звіт підкреслює, що використання атрибутів ARIA (Accessible Rich Internet Applications) зросло, ще виявляються помилки на сторінках, що використовують ARIA. Це натякає нам на те, що хоча все більше сайтів намагаються впровадити функції доступності, багато з них все ще не відповідають необхідним стандартам.

Юридичний тиск і регуляції спонукають більше сайтів приймати правила доступності. Наприклад, Американський закон про американців з обмеженими можливостями (ADA) був розширений так, що тепер включає сайти як публічні місця, що призвело до зростання кількості судових позовів, пов'язаних з доступністю. У 2023 році було подано 4605 таких позовів, що вказує на значний юридичний стимул для сайтів дотримуватися стандартів доступності.

Тож давайте в цьому матеріалі структуруємо вимоги до сайтів та листів, притримуючись яких ви будете підтримувати правила міжнародних стандартів веб-інклюзивності.

Які проблеми зі здоров'ям належать до категорії веб-інклюзивності (доступності)?

Вади зору

• повна або часткова сліпота;
• колірна сліпота (дефіцит кольоровідчуття) — 1 з 12 чоловіків (8%) і 1 з 200 жінок в усьому світі мають ту чи іншу форму дефіциту кольоровідчуття. Цей вид вади зору пов'язаний зі сприйняттям кольору і може значно відрізнятися за ступенем тяжкості;
• обмежений периферійний зір або інші види вад зору — 258 мільйонів людей мають легкі вади зору; 510 мільйонів людей мають проблеми з ближнім зором, що впливає на їхню здатність бачити предмети зблизька.

До речі, люди, які страждають на світлочутливу епілепсію, хоча й не входять до цієї групи, дуже чутливі до яскравих кольорів, GIF-ок і мерехтіння екрану. Це може викликати реакцію, здатну спровокувати напад у людей з фотосенситивною епілепсією.

Вади слуху

• повна або часткова глухота;
• проблеми зі сприйняттям звуків різної гучності або висоти тону.

Вади рухливості

• обмежені рухові здібності або координація;
• нездатність або труднощі під час використання рук (наприклад, під час роботи з мишею або клавіатурою);
• труднощі зі збереженням певної пози протягом тривалого часу або необхідність використання спеціальних допоміжних пристроїв.

Когнітивні та неврологічні вади

• стани, що впливають на концентрацію, увагу, здатність до навчання та логічне мислення;
• розлади аутистичного спектра;
• синдром дефіциту уваги з гіперактивністю (СДУГ) та інші.

Вади мовлення

• проблеми з вимовою слів;
• вади мовлення, що вимагають використання альтернативних методів комунікації.

Розширений список захворювань і симптомів можна знайти в нашому гайді з доступності.

Крім того, ви знайдете основні рекомендації зі створення листів для веб-інклюзивних категорій користувачів.

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

Обов'язкові поради для сайтів

Вади зору 

Якщо говорити про вади зору, то веб-інклюзивність охоплює кілька основних аспектів, які необхідні при розробці сайтів. Ось детальне пояснення того, що зазвичай є обов'язковим для забезпечення кращої доступності:

1. Достатній контраст тексту і фону: це надзвичайно важливо для людей з поганим зором і дальтонізмом, завдяки чому вони можуть читати текст без напруження. Стандарти, як-от Web Content Accessibility Guidelines (WCAG), вимагають певного рівня контрастності.
2. Альтернативні тексти для зображень (alt-тексти): це необхідно для того, щоб програми для читання з екрану могли озвучувати опис картинок для користувачів, які їх не бачать.
3. Підтримка скринрідерів: сайти мають бути сумісними з програмами читання екрану, що використовуються сліпими та слабозорими користувачами для навігації та взаємодії з контентом.
4. Масштабованість контенту: можливість збільшити текст і елементи інтерфейсу без втрати функціональності або погіршення оформлення сайту має величезне значення.
5. Клавіатурна навігація: усі інтерактивні елементи мають бути доступні для клавіатурної навігації, що є важливим для користувачів, які не можуть використовувати мишу.
6. Коефіцієнт контрастності: Web Content Accessibility Guidelines (WCAG) рекомендує мінімальний коефіцієнт контрастності щонайменше 4,5:1 для звичайного тексту і 3:1 для великого. Для кращої доступності, особливо для людей з поганим зором, рекомендується орієнтуватися на коефіцієнт контрастності 7:1 або вище.
7. Великий розмір тексту: текст розміром 18 пунктів (приблизно 24 px) або 14 пунктів (приблизно 18,66 px), виділений жирним шрифтом, вважається великим текстом, який може бути більш читабельним за трохи меншого коефіцієнта контрастності.
8. Колірні рішення: для користувачів з дальтонізмом важливо переконатися, що інформація, передана за допомогою кольору, також помітна і без нього. Уникайте використання поєднань кольорів, які важко розрізнити користувачам з дальтонізмом, наприклад, червоний / зелений, зелений / коричневий, зелений / синій, синій / сірий, світло-зелений / жовтий.
9. Інструменти для перевірки контрастності: різні онлайн-інструменти, як-от WebAIM Contrast Checker, допоможуть перевірити контрастність між текстом і фоном, щоб переконатися, що вона відповідає або перевищує рекомендовані стандарти.
10. Спрощений фон: однорідний простий фон допоможе отримати максимальну читабельність, на відміну від візерункових або насичених картинками фонів, які можуть знизити читабельність тексту.

Вади слуху 

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

Незалежно від цього, проблеми зі слухом належать до категорії веб-інклюзивних і потребують дотримання таких факторів: 

1. Субтитри до відеоматеріалів: усі відео, що містять аудіоінформацію (наприклад, діалоги або важливі звукові ефекти), мають бути супроводжені субтитрами, щоб люди з вадами слуху могли читати текст під час перегляду.
2. Текстова транскрипція аудіоматеріалів: надання повнотекстових розшифровок усіх аудіозаписів (наприклад, подкастів або аудіолекцій) є обов'язковим, щоб користувачі з вадами слуху могли отримати доступ до всієї інформації, що надається.
3. Синхронізація субтитрів і звуку: субтитри мають бути точно синхронізовані з відповідними звуками у відео, щоб забезпечити правильне і зрозуміле сприйняття інформації.

Вади рухливості 

Щодо групи вад рухової активності, пов'язаних із веб-інклюзивністю, то різноманітні захворювання та стани впливають на здатність контролювати рухи тіла, і всі вони можуть значно ускладнити використання традиційних пристроїв введення та навігацію сайтами. Тому розробка адаптивних і доступних інтерфейсів має ключове значення для поліпшення доступу до цифрових ресурсів. 

Тому важливо дотримуватися таких рекомендацій:

1. Клавіатурна навігація: усі інтерактивні елементи на сайті мають бути доступні та зручні для керування за допомогою клавіатури, без необхідності використання миші. Це стосується доступу до посилань, кнопок, форм та інших елементів керування.
2. Достатня кількість часу для взаємодії: користувачам з обмеженою моторикою може знадобитися більше часу для введення даних або навігації сайтом. На сайтах має бути передбачена можливість збільшити час відгуку, якщо це необхідно (наприклад під час заповнення форм).
3. Керування фокусом: під час навігації за допомогою клавіатури дуже важливо, щоб фокус на інтерактивних елементах був чітко помітним і узгодженим, щоб користувачі могли легко відстежувати, де вони перебувають на сторінці.
4. Відсутність вимушених рухів: дизайн сайту не повинен вимагати складних або точних рухів, які можуть бути скрутними для людей з обмеженими руховими навичками (наприклад система drag-n-drop. Якщо ви використовуєте функцію drag-n-drop, для користувачів, які не можуть виконати ці дії, мають бути доступні альтернативні методи. Це можуть бути кнопки для переміщення елементів вгору або вниз у списку як заміна перетягуванню).

Когнітивні та неврологічні вади 

Ця група розладів насправді є однією з найпоширеніших і містить доволі великий список захворювань і станів. Наприклад, у нас є матеріал про дислексію від Деніела Бріттона, який сам має цю ваду і розповів про неї на своєму вебінарі.

А ось посттравматичний стресовий розлад (ПТСР) — один з найпоширеніших станів, що може призвести до проблем з концентрацією уваги та гіперзбудливості, що робить взаємодію з перевантаженими або складними інтерфейсами особливо важкою. Тому дуже важливо звертати увагу на цю категорію веб-інклюзивності та дотримуватися таких правил:

1. Зрозумілість і простота вмісту: використання простої та зрозумілої мови має величезне значення для людей з когнітивними вадами. Відмова від жаргону та складних речень і чіткі інструкції допоможуть користувачам краще зрозуміти інформацію. 
2. Логічна навігація і структурований контент: важливо, щоб структура сайту була інтуїтивно зрозумілою, з чітко позначеними розділами та послідовною навігацією. Це допоможе користувачам із когнітивними вадами зорієнтуватися на сайті та полегшить пошук інформації. 
3. Надання інструкцій і підказок: наявність чітких інструкцій для таких задач, як заповнення форм або виконання онлайн-транзакцій, має найважливіше значення. Ці інструкції мають бути легкими для пошуку та розуміння, що знизить імовірність помилок і невдоволення користувачів із когнітивними вадами.
4. Відсутність часових обмежень: якщо на сайті є елементи, що вимагають виконання дій протягом певного часу, надання можливості керувати цим часом, подовжувати його або вимикати таймери є дуже важливим для людей з низькою швидкістю роботи.

Вади мовлення

Звісно, перше питання, яке виникає: як люди з вадами мовлення можуть належати до груп доступності? Я теж переймалася цим питанням. Але, як виявилося, до цієї групи найчастіше входять:

• проблеми з вимовою слів;
• розлади мовлення, що вимагають використання альтернативних методів комунікації.

Так, наприклад, заїкання може стати проблемою під час спілкування в інтернеті, тому що:

• це може ускладнити використання голосових команд у веб-застосунках або пошукових системах, оскільки голосові помічники можуть не розпізнати заїкання або повторення слів;
• інтерактивні форми, що вимагають голосового введення, можуть бути проблематичними для людей з заїканням, якщо технологія не налаштована на розуміння нерівного мовлення;
• заїкання може обмежити здатність людини швидко і впевнено спілкуватися в соцмережах, особливо під час використання функцій голосового чату;
• заїкання може знижувати впевненість людей під час користування сайтами, особливо якщо на них є складні інтерактивні елементи, що вимагають активної участі користувача.

Найчастіше використовується найважливіша функціональність, а саме: 

• альтернативні методи комунікації, не пов'язані з вербальним спілкуванням (месенджери), оскільки людям потрібно більше часу для відповіді;
• чітка і доступна структура цільових сторінок, тексту сайту, постів у соцмережах або листів, оскільки сприйняття людей з заїканням відрізняється, і якщо все не буде чітко структуровано, їм буде складніше сприймати інформацію навіть візуально.

Найголовніше, що в Сполучених Штатах заїкання визнано інвалідністю відповідно до Закону про американців з обмеженими можливостями (ADA). Це визнання вимагає адаптації в освітньому та професійному середовищі, що відповідає іншим питанням доступності. Таким чином, сайти також занесено до списку професійних об'єктів.

Тому необхідно перевірити, чи враховані ці фактори на вашому ресурсі: 

1. Альтернативні форми введення: надання методів введення, які не залежать від голосу, як-от введення тексту, вибір із запропонованих варіантів або використання клавіатури, є обов'язковою умовою забезпечення доступності для користувачів з вадами мовлення.
2. Уміння користуватися допоміжними технологіями: сайти мають підтримувати сумісність із допоміжними технологіями, як-от голосові програми введення тексту для тих, хто може користуватися голосом, але зазнає труднощів зі звичайним мовленням.
3. Текстові альтернативи для голосового контенту: надання текстової транскрипції або субтитрів для будь-якого аудіо- або відеоконтенту, в якому ключову роль відіграє мовлення, необхідне для забезпечення доступу до інформації.

І, звісно, крім обов'язкових факторів, є й ті, які рекомендовано, але не менш важливі у використанні. Тож давайте розглянемо і їх.

Рекомендовані поради для сайтів

1. Підтримка різних режимів відображення: наприклад, темний режим може допомогти користувачам із певними порушеннями зору.
2. Кастомізація шрифтів: надання користувачам можливості вибирати тип і розмір шрифту може значно поліпшити читабельність для людей з вадами зору.
3. Аудіоописи для відеоматеріалів: надання звукових описів дій у відео, які не описуються голосовими доріжками, може бути корисним, але не завжди обов'язковим.
4. Використання іконографії: дає змогу людям з дальтонізмом не загубити важливу інформацію.

Ось деякі ключові аспекти, в яких іконографія може допомогти досягти веб-інклюзивності:

1. Покращення навігації: іконки можуть слугувати універсальними символами, допомагаючи користувачам легко орієнтуватися на сайті. Для людей з когнітивними розладами або незнайомих з мовою сайту іконки можуть спростити розуміння функцій і навігації.
2. Доступність контенту: іконки можуть допомогти у візуальному поданні інформації, що корисно для людей з вадами зору або труднощами читання. Яскраві та чіткі іконки легше розпізнати, що робить інформацію доступнішою.
3. Міжкультурна комунікація: іконки можуть подолати мовний бар'єр, подаючи поняття і дії без слів.
4. Універсальний дизайн: розробка іконографії, що враховує потреби всіх користувачів, включно з людьми з обмеженими можливостями, є важливою частиною створення універсально доступних веб-ресурсів.

Для людей з розладами рухової функції може бути корисним наступне:

1. Підтримка альтернативних пристроїв введення: крім клавіатурного введення, сайти можуть підтримувати й інші пристрої введення, як-от голосове введення, однокнопкові миші, керування очима тощо.
2. Кастомізація інтерфейсу: надання користувачам можливості налаштовувати елементи інтерфейсу, як-от розмір кнопок або чутливість введення, може покращити доступність для людей з різними видами розладів рухової функції.
3. Мінімізація фізичних зусиль: скорочення кількості дій, необхідних для виконання завдання (наприклад автозаповнення форм), може значно полегшити користування сайтом.

Для людей з вадами мовлення:

1. Інтерактивні підказки: інтерактивні підказки або покрокові інструкції, які не потребують голосового введення, можуть допомогти користувачам з вадами мовлення легше взаємодіяти з сайтом.
2. Персоналізація користувацького інтерфейсу: можливість налаштування користувацького інтерфейсу для зменшення або виключення необхідності голосового введення може значно поліпшити доступність для людей з вадами мовлення.
3. Зрозумілий зворотний зв'язок і підтримка: чіткі інструкції та легкодоступна підтримка за допомогою текстових засобів комунікації, як-от чати або форми зворотного зв'язку, можуть допомогти користувачам, які зазнають труднощів з мовленням.
4. Тестування з реальними користувачами: проведення тестування доступності сайту за участю людей з обмеженими можливостями, які є частиною веб-інклюзивної спільноти, допоможе виявити та усунути потенційні недоліки, які могли залишитися непоміченими.

На завершення

Насправді тема доступності дуже широка, і в цьому матеріалі ми розглянули категорії та основні вимоги до стандартизації для сайтів і листів, але вони є фундаментальними для створення найкращих умов для всіх груп користувачів.