Як зробити сайт доступним: загальна інформація

Існує набір рекомендацій по доступності WCAG2.0, опублікований консорціумом W3C, загальний підхід якого ґрунтується на чотирьох принципах.

Загальний підхід

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

Вимоги щодо доступності

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

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

Доступність для сліпих (повністю незрячих) користувачів

Повністю незрячі люди для роботи з персональним комп’ютером або смартфоном використовують спеціальні програми считування з екрану (скрин-рідери), які працюють тільки з текстовою інформацією. Також ці користувачі не користуються мишкою.

Для нормальної роботи користувачя скрін-рідера важливо:

  1. Надання текстової альтернативи для всіх важливих нетекстових елементів: кнопки, посилання, чекбокси – все повинно мати текстову мітку (для додавання текстової мітки потрібно використовувати атрибути alt, value, aria-label та ін.).
  2. Надання текстових міток та, при необхідності, підказок для елементів вводу: полів, чекбоксів.
  3. Повна керованість і доступність сайту з клавіатури: реалізація взаємодії з елементами управління або вводу можлива за допомогою набору атрибутів (role, aria та ін.).
  4. Правильне використання семантичних областей, заголовків та інших елементів.
  5. Дублювання інформації у вигляді тексту, коли для індикації або надання інформації використовується колір (наприклад: не припустимо на картах місць концертного залу або вагона поїзда зайняті місця позначати лише кольором).
  6. Врахування особливостей сприйняття контенту: він сприймається на слух, тобто послідовно, без можливості охопити всю сторінку поглядом цілком, без можливості помітити інформацію в іншій області сторінки.
  7. Надання додаткових засобів навігації сторінкою. Наприклад, посилання “Перейти до контенту” дуже полегшує навігацію.

Доступність для користувачів, що страждають на дальтонізм

У випадках, коли колір використовується для індикації або надання інформації, повинні бути передбачені альтернативні візуальні засоби.

Доступність для слабозорих користувачів

Для користувачів цієї групи має значення:

  1. Контрастність тексту відносно фону: 5 / 1.
  2. Розмір елементів: елементи навігації не повинні бути занадто дрібними.
  3. Підтримка масштабування сторінки: при збільшенні тексту сторінка повинна зберігати форму та функціональність.

Доступність для користувачів з порушеннями слуху

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

Доступність для користувачів з порушеннями моторики

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