Ви втрачаєте майже 100 тис. клієнтів: як і навіщо адаптувати сайт для людей з порушеннями зору

Майже чверть населення Землі має проблеми із зором. Ці люди активно користуються інтернетом, але постійно стикаються з проблемою недоступності: при розробці сайтів їх інтереси практично не враховуються.

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

Безкоштовне розміщення інклюзивних сайтів 

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

За статистикою Всесвітньої організації охорони здоров’я, у світі 2,2 млрд людей, які мають проблеми із зором. В Україні, за неофіційними даними, ця цифра становить близько 100 тис. людей.

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

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

Як бачать інтернет люди із порушеннями зору

Щоб вирішити будь-яку проблему, потрібно розуміти її суть. Існують симулятори, завдяки яким можна зрозуміти, як люди з порушеннями зору бачать сайти.

Для того, щоб це показати, я використав розширення Web Disability Simulator, яке доступне користувачам Google Chrome. На зображенні цифрами позначено оригінальний вигляд сайту (1), астигматизм (2), дальтонізм жовто-блакитного спектру (3) та повний дальтонізм (4). Перевірити в такий спосіб можна будь-який сайт.

Щоб адаптувати власний сайт, не обов’язково звертатися до розробників чи інших фахівців. Зробити це можна самостійно через впровадження деяких рекомендацій, про які я розповім далі.

Чому спеціальна версія сайту гірша за повну

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

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

Як зробити сайт зручнішим для людей із порушеннями зору

Рекомендації, що наведені нижче, стосуються розмітки та дизайну сайту. Більш докладні поради щодо адаптації сайтів ви можете прочитати у спеціальному «Посібнику із забезпечення доступності веб-контенту (WCAG)». 

Адаптація під читач екрану

Враховуйте, як з вашою розміткою працюватимуть програми екранного доступу. Люди з повною втратою зору слухають сайти, які для них озвучують спеціальні програми, так звані «читачи екрану». Але вони розпізнають як текст, так і саму розмітку. Тому важливо розміщувати елементи в логічні теги Н1, Н2, Н3, дотримуватися структурної ієрархії заголовків, прописувати alt всім зображенням.

В адаптації сайту також допоможе ознайомлення зі спеціальною мовою ARIA. Завдяки їй можна зробити веб-контент та веб-додатки (особливо ті, які розроблені за допомогою Ajax та JavaScriptмови програмування) більш доступними для людей із порушеннями зору.

Мінімалістичний дизайн

Зараз це модно: великі зображення та тексти, верстка в одну колонку, великі просвіти між елементами. Але це не лише тренд. Сайтом із таким дизайном простіше користуватися людям із порушеннями зору.

Реалізувати такий дизайн дуже просто – достатньо вибрати відповідний шаблон та тему для сайту. Подібні дизайни та шаблони широко представлені у популярних CMSсистеми керування контентом, на кшталт, Joomla або WordPress.

Керування клавіатурою

Спробуйте «прогулятися» структурою будь-якого сайту за допомогою клавіші TAB. Якщо елементи по черзі виділяються за допомогою рамки, підсвічуються кольором або вискакують підказки, значить такий сайт зручний для користувачів не лише зі слабким зором, а й із порушеннями моторики.

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

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

Великі читабельні літери та контрастне тло

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

Перевірити контрастність кольорів можна за допомогою аналізатора. Дотримуйтесь коефіцієнта щонайменше 4.5:1.

Масштабування сторінок

Багато хто користується сполученнями клавіш CTRL+ та CTRL- для збільшення та зменшення контенту. Це допомагає людям з короткозорістю, далекозорістю та іншими порушеннями зору легко налаштовувати розмір тексту. Завдання розробника – зробити так, щоб сайт не «їхав» і не з’являлося горизонтальне прокручування при таких діях.

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

Доступність слід розглядати як інвестицію.

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