UX Research · Accessibility · Web · 2016—2018

Доступность для слабовидящих

По приказу о доступности сам инициировал полевое исследование со слабовидящими — интервью, наблюдение за работой, внедрение инструментария на сайты.

TL;DR

Полевое исследование со слабовидящими по личной инициативе → инструментарий доступности на сайтах

  • 01Сам предложил и организовал исследование: вместе с PM связался с центром, где слабовидящих учат компьютерной грамотности
  • 02Провёл интервью и наблюдение за тем, как люди реально работают с интерфейсами и какие у них сложности
  • 03Собрал инструментарий доступности и внедрил его на сайты концертно-театральных организаций

КЛИЕНТ

Gagarin-online

РОЛЬ

UX/UI Designer

СРОК

2016 — 2018

МЕТОД

Полевое исследование

Контекст

Вышел приказ о доступности сайтов для людей с нарушением зрения. Можно было закрыть задачу формально — подключить типовой плагин. Я предложил разобраться по-настоящему: понять, как слабовидящие реально пользуются сайтами.

Исследование

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

Провёл серию наблюдений и встреч: смотрел, как люди работают с браузером и экранным диктором, где теряются, какие паттерны навигации используют — клавиатурная навигация, масштабирование, High Contrast Mode.

Ключевые наблюдения: — Большинство пользуются экранным диктором, а не специальными плагинами — важна семантика HTML, а не «версия для слабовидящих». — Главная проблема — не размер шрифта, а порядок фокуса и качество alt-текстов у изображений. — Переключатель «версия для слабовидящих» путал: непонятно, что он включает и как вернуться назад.

Что изменилось

На основе наблюдений собрал инструментарий и внедрил на сайтах концертно-театральных организаций (ТКТО и других клиентов Gagarin-online):

— Исправили семантику: заголовки в правильном порядке (h1→h2→h3), навигация через <nav>, кнопки билетов — <button>, не <div onclick>. — Добавили alt-тексты к афишам, фотографиям артистов, баннерам — кратко, без «картинка» в начале. — Улучшили порядок фокуса: Tab должен идти в логическом порядке чтения, а не по порядку в DOM. — Доработали переключатель: сделали его работу очевидной, добавили состояние «активен».

Итог

Это мой первый полноценный опыт полевого UX-исследования и инклюзивного дизайна — 2017 год, задолго до того как accessibility стала обязательной темой в дизайн-сообществе.

Главный инсайт: нельзя спроектировать доступность по гайдлайнам, не видев, как люди реально используют продукт. Типовой плагин дал бы видимость решения — но не решение.

Похожая задача — обсудим.