Полное руководство по тестированию веб-доступности

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

К тому же, есть масса ложных представлений, которые могут вводить в заблуждение при тестировании доступности.

Данная статья — это полезный материал касательно инструментов и техник, которые стоит использовать при проверке веб-доступности.

Первые впечатления или нулевые наработки первых проверок

Почему первый пункт стоит именовать нулевым? Все потому, что его выполнение — исключительно по желанию.

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

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

Что желательно смотреть?

• Читабельность: насколько читабелен предоставленный на сайте текст?
• Метки: присутствуют ли интерактивные метки?
• Видео: воспроизводится ли видео в автоматическом порядке?
• Анимации: не переполнен ли сайт анимированными блоками?

Это могут быть наиболее «ранние симптомы» того, что корректная веб-доступность не была взята в расчет при создании сайта.

Далее наступает период более научного подхода с выявлением более распространенных багов.

Кнопка TAB

Поработаем с клавишей TAB. Не все пользователи используют клавиатуру и мышь для работы с веб-сайтами — кто-то может использовать только клавиши на клавиатуре.

Современный HTML поддерживает работу навигации с клавиатуры по умолчанию, но только если она корректно настроена. Но где-то на полпути, некоторые разработчики стали забывать об этом, и иногда подобная простая манипуляция становится абсолютно невозможной.

Стоит отдельно отметить, что не все веб-браузеры ведут себя одинаково. В Google Chrome/Edge клавиша TAB ведет себя по-одному, а с macOS есть несколько исключений (например, фокус устанавливается только для полей ввода и кнопок, но не работает со ссылками).

Группа автоматизированных тест-инструментов

Важная особенность автоматизированного ПО — простота и удобство в использовании: с его помощью можно получать мгновенно воспроизводимый результат. С их помощью запросто можно находить проблемы, лежащие на поверхности, которые проще всего исправить.

Для поиска подобных багов можно использовать продукт Lighthouse, который «ловит» массу проблем доступности, оптимизирует SEO, а также предоставляет исчерпывающий функционал для оптимизации производительности.

Естественно, что автоматизированные программы не могут найти все баги — в их «способности» входит выборка от 65 до 71% от общего количества дефектов.

Итоги

Если после выполнения всех данных манипуляций вы не смогли найти багов, значит, вы проделали работу правильно! Веб-сайты без багов доступности — очень большая редкость в наши дни (согласно опросу портала WebAIM, около 98% из посещенных сайтов содержат те или иные проблемы с доступностью).

Нахождение «больших» проблем доступности связаны, в первую очередь, с недостаточностью знаний, или «победой эстетичного над практичным».