Закрыть меню
Доступ к материалам в удобное время и в комфортном темпе
Без использования звука
Изучайте контент на любом устройстве и в любом удобном месте
Начните знакомство с платформой без вложений.

Введение в доступный дизайн

Изучите основы разработки доступных цифровых продуктов и стандарты, которым они должны соответствовать.

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

Автоматические инструменты хорошо находят технические нарушения, но лучший результат достигается в связке с ручным тестированием — только так можно учесть тонкие нюансы доступности. Расширения для браузеров, отдельные приложения и встроенные средства разработчиков образуют полный набор, который помогает проверять соответствие сайта требованиям на всех этапах создания продукта. Внедрение таких проверок на ранних стадиях избавляет от дорогостоящих переделок в будущем.

Какой стандарт использовать в России

В мире ориентируются на международные стандарты WCAG (Web Content Accessibility Guidelines). В России ситуация немного иная: специального закона, который обязывал бы все коммерческие сайты соблюдать WCAG, нет . Однако есть ГОСТ Р 52872-2019 «Интернет-ресурсы и другая информация, представленная в электронно-цифровой форме. Приложения для стационарных и мобильных устройств, иные пользовательские интерфейсы» .

Этот ГОСТ полностью соответствует международному стандарту WCAG 2.1 . Формально он обязателен в первую очередь для государственных информационных систем и сайтов органов власти . Для коммерческих проектов это пока рекомендация, но именно на нее опираются, когда хотят сделать продукт по-настоящему доступным. На практике в профессиональной среде говорят просто «соответствие WCAG», подразумевая, что это покрывает и требования ГОСТа.

Что такое доступность?

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

Функции доступности полезны не только людям с инвалидностью. Голосовые команды помогают и слепым пользователям, и тем, у кого временно заняты руки. Субтитры нужны не только глухим, но и тем, кто смотрит видео в шумном месте. Высококонтрастный режим пригодится и при нарушениях зрения, и при работе на ярком солнце. А четкий структурированный контент одинаково полезен людям с когнитивными особенностями и тем, кто просто спешит.

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

Что такое инвалидность?

Инвалидность возникает не как следствие состояния человека, а во взаимодействии между ним и окружающей средой. Возможности человека становятся барьерами, только если среда, продукты или сервисы не рассчитаны на разные способы взаимодействия с миром.

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

В мире больше миллиарда людей с инвалидностью — это значительная часть аудитории любого продукта. А если добавить временные и ситуативные ограничения, эта цифра становится еще больше. Признание инвалидности частью человеческого опыта ведет к более продуманным и удобным для всех решениям в дизайне.

Руководство по доступности веб-контента (WCAG)

Руководство по доступности веб-контента (Web Content Accessibility Guidelines, WCAG) — это международный стандарт, который помогает делать цифровые продукты доступными для людей с инвалидностью. В его основе лежат четыре ключевых принципа: контент должен быть воспринимаемымуправляемымпонятным и надежным . Каждый принцип раскрывается через конкретные рекомендации и проверяемые критерии успеха.

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

Многие страны включили WCAG в свое законодательство о цифровой доступности. Чтобы соответствовать законам, организации обязаны выполнять определенные критерии успеха .

WCAG делится на три уровня: A, AA и AAA .

  • Уровень А — базовый минимум доступности. Без него часть пользователей просто не сможет воспользоваться продуктом.
  • Уровень АА — основной рабочий стандарт. Именно его обычно требуют в законодательстве и рекомендуют для большинства сайтов .
  • Уровень ААА — самый высокий, но достижим не для всего контента, поэтому его не требуют как обязательный для всего сайта целиком .

В мире WCAG используют как основу для законодательства о цифровой доступности. Российский ГОСТ Р 52872-2019 полностью соответствует WCAG 2.1 — об этом мы подробнее говорили в начале раздела.

Уровень A в WCAG

Требования уровня A закладывают базовую основу, которая предотвращает полную недоступность. Без выполнения этих условий некоторые пользователи вообще не смогут пользоваться продуктом. Но соблюдение только уровня A не делает продукт полностью доступным — оно лишь исключает полное исключение части пользователей.

Рассмотрим, как продукт передает информацию с помощью цвета. Если диаграмма использует только цвет для различения данных, пользователи с дальтонизмом не смогут ее понять. Уровень A требует альтернативных способов передачи — например, узоров, подписей или иконок вместе с цветом. Так уровень A обеспечивает базовую пригодность продукта для всех пользователей.

Уровень AA в WCAG

Уровень AA — это стандарт, который обеспечивает по-настоящему удобный цифровой опыт для большинства людей. Если уровень A убирает полные барьеры, то AA делает продукты комфортными и практичными для широкого круга пользователей. Именно этого уровня требуют законы в большинстве стран и именно его стоит брать за основу, если вы хотите сделать продукт действительно доступным.

Пример — требования к контрастности. Текст с низким контрастом технически прочитать можно, но это вызывает напряжение и раздражение. Уровень AA требует контраста 4.5:1 для обычного текста — так текст остаётся читаемым при разных нарушениях зрения и в любых условиях освещения.

Соответствие уровню AA показывает серьёзный подход к доступности, но при этом остаётся достижимым для большинства цифровых продуктов.

Уровень AAA в WCAG

Уровень AAA — это наивысший стандарт цифровой доступности, который задает ориентир для максимального удобства всех пользователей. Полное соответствие уровню AAA достижимо не для каждого продукта, но его критерии служат ценным ориентиром для повышения доступности сверх базовых требований.

Пример — требования к контрасту. Уровень AAA требует соотношения 7:1 для обычного текста — это значительно выше, чем 4.5:1 на уровне AA. Такая контрастность ограничивает выбор цветовой палитры, но обеспечивает оптимальную читаемость для пользователей с выраженными нарушениями зрения. И она же помогает всем в сложных условиях — например, при ярком солнце или тусклом освещении.

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

Принципы WCAG

Руководство по доступности веб-контента строится вокруг четырёх ключевых принципов, известных под аббревиатурой POUR. Каждый из них охватывает разные аспекты взаимодействия пользователей с цифровым контентом.

Воспринимаемость (Perceivable) — пользователи должны иметь возможность воспринимать контент хотя бы одним из органов чувств. Это значит: текстовые альтернативы для изображений, субтитры для видео, возможность представить контент по-другому без потери смысла.

Управляемость (Operable) — пользователи должны иметь возможность взаимодействовать с функциями независимо от того, каким способом они управляют устройством. Продукты должны поддерживать разные методы ввода: мышь, клавиатуру, голос или вспомогательные устройства.

Понятность (Understandable) — контент должен быть ясным и логичным. Навигация — последовательной, инструкции — простыми. Пользователи должны успевать воспринимать и обрабатывать информацию в своем темпе.

Надёжность (Robust) — контент должен стабильно работать с разными технологиями. Продукты обязаны сохранять функциональность в разных браузерах, на разных устройствах и при использовании вспомогательных средств — экранных читалок или инструментов увеличения.

Руководство «5½ шагов, чтобы стать UX/UI-дизайнером»

Мы подготовили практичное и структурированное пособие о входе в профессию UX/UI-дизайнера.

В нём разобраны ключевые этапы развития: от освоения основ и практики до работы с портфолио, обратной связью и первых шагов в карьере.

Зарегистрироваться и скачать
Руководство «5½ шагов, чтобы стать UX/UI-дизайнером»