Исследование доступности веб-сайтов вузов России для лиц с ограничениями по зрению
А.С. Пудич,М.Г. Гриф, М.А. Бакаев
Аннотация
Постановка проблемы. В современном мире увеличилась востребованность веб-сайтов вузов. По закону в России на образовательные сайты внедрены версии для слабовидящих. Целью исследования стала оценка (преимущественно автоматическим способом) данных сайтов на предмет доступности и качества версий для слабовидящих, а также выявление лучшего способа реализации таких решений и создания доступных сайтов в целом. Методология. Разработана программная система сбора метрик с сайтов в двух версиях: обычной и для слабовидящих. Сравниваются количественные метрики на основе html-кода и визуального анализа скриншотов главных страниц. Показатели получены ручным тестированием. Результаты. Изучены данные 571 сайта вузов, представленные в общем доступе. Произведен корреляционный анализ метрик. Сделана оценка качества работоспособности версий для слабовидящих, составлены рекомендации к технической реализации и стандартному набору настроек версий для слабовидящих. Собрана статистика используемых готовых решений, инструментов разработки сайтов. Заключение. Выявлены актуальные проблемы в области доступности образовательных сайтов в России, сформулированы предложения по проведению оценки и разработке доступных сайтов. Рекомендации могут использоваться как одна из инструкций для разработки или проверки версий для слабовидящих.
Ключевые слова: оценка интерфейсов, визуальный анализ, доступность веб-сайтов, образовательные сайты, рейтинги вузов, слабовидящие, ограниченные возможности
Abstract
веб-сайт вуза версия для слабовидящих
Research of the accessibility of Russian universities websites for persons with visual disabilities
Alexander S. Pudich, G. Grif, Maxim A. Bakaev
Problem statement.Nowadays the demand for university websites has increased. According to the law, versions for visually impaired have been introduced on educational sites in Russia. The research objective is to evaluate accessibility of sites and quality of versions for visually impaired (mainly in an automatic way), and to identify the best way to implement such solutions and to create accessible sites in general. Methodology.A software system for collecting metrics from websites in two versions - a normal and for visually impaired users - has been developed. Quantitative metrics based on the HTML code of homepages and visual analysis of homepages screenshots are compared. Metrics were also received by manual testing. Results.Data from 571 universities websites with open access to files was observed. The correlation analysis of metrics was carried out. The quality of versions for visually impaired was assessed, recommendations were made for technical implementation and a standard set of settings for panel of version for visually impaired users. Statistics of used ready-made solutions, as well as website development tools, was collected. Conclusion.An idea has appeared about current issues in the field of accessibility of educational sites in Russia, and about what can be used to evaluate and developing of accessible sites. The recommendations can be used as one of the guidelines for developing or checking versions for visually impaired.
Keywords: interfaces assessment, visual analysis, website accessibility, educational sites, university rankings, visually impaired, disabilities
Постановка проблемы
Во время пандемии COVID-19 вводилась дистанционная форма образования, вследствие чего выросло количество обращений к образовательным сайтам. Важно, чтобы такие сайты были доступны для различных категорий лиц (в том числе с временными или постоянными ограничениями) и в различных условиях доступа (мобильный экран, слабая яркость и др.). В данном исследовании речь будет идти о сайтах высших учебных заведений России.
Известно, что образовательные сайты входят в категорию сайтов, где должны быть внедрены версии для слабовидящих (ВДС). Рособрнадзор утвердил в 2015 г. перечень тегов микроразметки для официальных сайтов образовательных организаций. В их число входит атрибут itemprop="Copy", по замыслу обрамляющий ссылку на версию официального сайта для слабовидящих. Сейчас у всех сайтов есть ссылка/кнопка переключения на ВДС. В простом случае это применение некоторой логики, включающей на сайте особый режим, в другом - используются панели для настройки параметров страницы под конкретные нужды пользователя (размер шрифта, контраст, отключение картинок, цветовые схемы и т. д.), либо все вместе.
Встречаются проблемы с работоспособностью такого функционала, а некоторый функционал плохо тестировался и делает только хуже - сайтом становится еще труднее пользоваться. Таким образом, предлагается оценить ВДС сайтов вузов РФ, выявить основные недостатки, собрать некоторую статистику проблем. Будет произведена оценка ВДС относительно субъектов РФ - местонахождения вузов, позиций вузов в актуальных популярных рейтингах и категорий направленности обучения.
Методология. Метрики, полученные на основе анализа кода страниц. В исследованиях встречается использование руководства по обеспечению доступности веб-контента WCAGдля получения количественных метрик по анализу html-кода страниц сайтов. В России в 2007 г. появился ГОСТ Р 52872, а в 2020 г. введена актуализированная редакция, в основе которой лежит документ WCAG2.1. Данные рекомендации содержат критерии доступности и делят их на принципы:
- perceivable (воспринимаемость);
- operable (управляемость/работоспособность);
- understandable (ясность/понятность);
- robust (надежность/совместимость).
Также каждые критерии имеют свой уровень доступности информации (А, АА, ААА), где минимальный уровень А позволяет ограниченным по зрению обеспечить доступность к интернет-ресурсу без потери информации, непрохождение таких критериев - грубый барьер. Уровень доступности информации АА - включает в себя уровень А. Но не включает ААА, который нам не интересен, автоматический поиск таких барьеров не будет продуктивным: он содержит много не реальных, а потенциальных барьеров. С нарушениями критериев уровня ААА пользователь сможет работать с сайтом, но с меньшим комфортом.
Зачастую в исследованиях используется анализаторы WAVE WAVE Web Accessibility Evaluation Tool. URL: https://wave.webaim.org/ (accessed:и Achecker. Барьеры, полученные такими анализаторами, относятся к определенному принципу и уровню доступности, а также имеют свой уровень достоверности: ошибка, предупреждение, потенциальная ошибка (требует полной перепроверки вручную). Мы будем рассматривать только ошибки и предупреждения.
Указанные сервисы имеют платное APIлибо бесплатный доступ через веб-форму для анализа сайтов вручную. В настоящем исследовании был выбран другой способ. Для сбора WCAG-барьеров (выбран уровень АА) в страницу обрабатываемого сайта инъектится скрипт HTML_CodeSniffer. URL: https://squizlabs.github.io/HTML_CodeSniffer/ (accessed:, или aXe aXe. URL: https://www.deque.com/axe/ (accessed: 25.06.2021)., который собирает нарушения, результат сохраняется в базу данных. JavaScriptпозволяет считывать примененные к элементам CSS-стили, когда у него есть доступ к DOM-дереву, а это важно для анализа контраста, видимости элементов, поэтому при выборе логики и языка программирования обработчика страниц учитывался этот фактор. Выбран язык NodeJS, взаимодействие со страницами происходит посредством браузера Chromeв headlessрежиме. Следовательно, нет сложности в передачи данных между кодом, выполненным в таком браузере и обработчике, запускающем этот браузер, так же ресурсные затраты минимальные. На выходе с найденными нарушениями сохраняется XPath-путь к элементу в коде, часть окружающего кода, что полезно для разработчика.
Метрики, полученные на основе анализа скриншотов страниц. Это метрики, преимущественно полученные на основе проекта AIM (AaltoInterfaceMetrics) AIM - Aalto Interface Metrics service. URL: https://interfacemetrics.aalto.fi/ (accessed:. Известно, что такие метрики имеют корреляцию с визуальной сложностью интерфейсов, эстетичностью, восприятием [1].
Пример таких метрик:
1) объекты:
- количество элементов на интерфейсе;
- количество типов элементов;
2) colourperception(различные аспекты красочности интерфейса и их влияние на восприятие и юзабилити):
- размер в формате PNG(чем больше, тем более цветная картинка);
- количество уникальных цветов в спектрах RGB, HSV, LAB;
- отклонения каналов в HSV (Hue, Saturation, Value- тон, насыщенность, значение - пространство цветов, близкое к человеческой визуальной системе);
- стандартное отклонение яркости цветов (luminance);
- количество статических и динамических цветовых кластеров;
3) perceptualfluency(простота, с которой видимая информация воспринимается эстетически):
- размер изображения в формате JPEG(предполагается, что беспорядочная картинка будет больше размером);
- пиксельная симметрия (оси максимальной симметрии);
- качество сетки (grid);
- пропорции пустого места;
- контраст границы фигур;
- визуальная беспорядочность (clutter).
Для сбора скриншотов также используется Chromeв headlessрежиме, чтобы осуществить поддержку JavaScript, так как в некоторых случаях скрипты меняют интерфейс сразу после загрузки. Для сбора скриншотов ВДС отрабатывает алгоритм поиска ссылки на такую версию и выполняется «щелчок» по ней.
Некоторые их данных метрик по скриншотам уже использовались в других исследованиях [2; 3]
Ручное тестирование. Для оценки реальной работоспособности ВДС произведено ручное тестирование на всех сайтах, включая весь функционал панелей помощи слабовидящим, собрана статистика проблем и внедрения готовых решений. Для сбора информации об инструментах разработки сайтов использован сервис Wappalyzer Wappalyzer. URL: https://www.wappalyzer.com/ (accessed: 25.06.2021)., чтобы собрать актуальную статистику используемых технологий.
Автоматический сбор метрик. Для сбора метрик разработана вебплатформа, позволяющая массово импортировать списки сайтов и страниц из CSV, выбирать и отправлять списки на обработку, просматривать и экспортировать результаты в CSVдля дальнейшего анализа. Структура проекта рассчитывалась на возможность горизонтального масштабирования для увеличения скорости обработки, используется Docker.
Обработчики платформы созданы для следующих задач:
- сохранение скриншотов в различных разрешениях;
- сбор метрик HTMLCodeSniffer HTML_CodeSniffer. URL: https://squizlabs.github.io/HTML_CodeSniffer/ (accessed:- для получения метрик, сгруппированных по WCAG-принципам;
- сбор метрик aXe aXe. URL: https://www.deque.com/axe/ (accessed: 25.06.2021).- преимущественно метрики контраста и прочие, относящиеся к WCAG, разделу 508 закона США AmericanWorkforceRehabilitationAct, отдельной авторской категории правил лучших практик в индустрии, а также к правилам ACTRulesCommunity ACT Rules Community Group (previously known as Auto-WCAG). URL: https://act- rules.github.io/pages/about (accessed: 25.06.2021).для автоматического тестирования;
- сбор метрик Lighthouse Lighthouse. URL: https://developers.google.com/web/tools/lighthouse (accessed: 25.06.2021). (Desktop, Mobile) - включает оценку доступности;
- сбор метрик AIM- идет обращение по websocketк локальному сервису AIM(собираем только количественные метрики, то есть без метрик, отдающих изображения в base64-формате, для большей стабильности).
Метрики по коду рассмотрены относительно округов, в которых располагаются вузы и их позиций в рейтингах. Например, оценка по округу составлялась среди метрик, полученных из кода по формуле
где i- индекс округа; j- индекс метрики; mean^ - среднее значение метрики по сайтам в округе (обычной версии сайта); meanB- среднее метрики тех же сайтов, но ВДС.
К разнице средних применялась нормализация от 0 до 1, так как она не всегда положительная. Оценка показывает, насколько ВДС улучшает пользование сайтом исходя из метрик по коду.
Результаты и обсуждение
В качестве метрик на основе кода страниц выступают количественные показатели найденных барьеров (количество мест с проблемой в коде). Наибольшее количество достоверно найденных ошибок относится к принципу «Восприятия», меньше всего - к принципу «Понятности». Первый влияет на удовлетворенность пользователя, способность разобраться с содержимым, здесь преобладает легко распознающийся критерий - отсутствие текстовой альтернативы. Второй сложнее обнаружить и требует внедрения дополнительных средств для анализа. Заполнение альтернатив возможно только вручную либо генерируя с помощью искусственного интеллекта и корректируя уже результаты вручную. Появляются продукты, реализующие это10, и даже внедряются на сайты вузов (табл. 4).
Что касается метрик из отчетов Lighthouse, оценки доступности сильно коррелируют с метриками aXeввиду того, что второй инструмент используется для этого внутри первого. Однако Lighthouseне получится использовать для оценки отдельной ВДС, поскольку он перезагружает страницу при старте анализа для измерения времязависимых показателей. Метрики aXeи HTMLCodeSnifferмежду собой немного коррелируют, так как затрагивают одни принципы WCAG.
Между версией для слабовидящих и обычной значения метрик очень слабо отличаются, иногда разница в метриках и вовсе отрицательная, что указывает на ухудшение ВДС относительно обычной версии исходя из html- кода. Поэтому сравнительный анализ проводится на большом наборе данных.
Для улучшения точности к набору применены:
- поиск и исключение дубликатов;
- исключение метрик Lighthouse, так как применение скрипта включения ВДС не применимо к методике анализа данным способом;
- исключены 49 сайтов с отсутствующими данными (пропуски) по каким- либо группам метрик в любой из версий;
- исключены 22 сайта, где программный алгоритм не смог включить ВДС (отсутствует, не работает или неизвестная разметка);
- исключены 13 сайтов с чрезмерно большим количеством ошибок по некоторым метрикам (выбросы).
После обработки данных число оставшихся сайтов - 479.
Первые места по оценкам у Сибирского и Северо-Западного округов (табл. 1, 2). Последние места заняли Центральный и Приволжский округа, хотя они наиболее населены в России.