Accessibility *

Привет, я Марго — инклюзивный продакт. Впервые вопросом «Какого черта одним можно, а другим нет?» я задалась после отдыха в Турции, где мы с друзьями покоряли горки в аквапарке. Все было круто, потом мы прилетели в Россию и решили повторить, но на аттракционы… меня не пустили.

В ответ на праведный и почти цензурный гнев я услышала что-то про СанПиН (которых не нашла) и грязные колеса (которые я не подумала протереть, да же ж?).

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

И если вы подумали: «Эта ваша мораль и этика вовсе не про бизнес, а мы тут деньги зарабатываем», у меня для вас новости.

Инклюзивность — это действительно +100500 к карме, а еще способ сыграть на метриках и получить прибыль. Как? Погнали читать!

Хабр, я уже третий месяц пишу про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке.

Сегодня уже будет не только HTML и CSS. В некоторых кейсах мы будем использовать ARIA-атрибуты. Я расскажу:

• как мы незаметно потеряли пользу элементов <section> и <form>;
• как атрибут tabindex запутывает незрячего пользователя;
• почему визуально скрытые элементы — проблема современных интерфейсов;
• что делать с паттерном «Звёздочка» для обязательных полей.

Давайте начнём!

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

С чего же начать? Сделать методички для дизайнеров? Протестировать свои продукты на пользователях с нарушениями зрения? Отправить всех разработчиков читать материалы по доступной разработке?

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

Я продолжаю рассказывать, как HTML и CSS могут улучшить или ухудшить доступность интерфейсов. В своём рассказе я использую свой опыт и моего незрячего знакомого Ильи.

В этой статье будет: атрибут autofocus и его нюансы, паттерн «Skip-link» и идея Ильи об использовании его на практике, проблема использования одинаковых ссылок для одной новости, что не так с кнопкой «Наверх» и как вы спрятали список от скринридеров.

Давайте начнём!

В этой статье я хочу поделиться своим опытом использования тематического разделения доступа (ТРД) для создания веб-приложения, которое позволяет пользователям обмениваться сообщениями по разным темам. ТРД — это метод управления доступом, при котором права доступа субъектов системы на объекты группируются с учётом специфики их применения, образуя роли¹. Например, в моём приложении есть роли администратора, модератора, автора и читателя. Каждая роль имеет свой набор прав на разные действия, такие как создание, редактирование, удаление и просмотр сообщений.

Cегодня я хочу рассказать про атрибут aria-label. В статье не будет заумных определений и бездумного копирования стандарта. Я хотел простым языком объяснить, какая польза от атрибута, а также передать свой практический опыт, чтобы вы могли его повторить. А получилось у меня или нет, решать вам.

Со вступительным словом всё. Давайте начнём!

Всем привет! Меня зовут Артём Плаксин, я незрячий специалист по цифровой доступности и работаю в ВК. Почитать о моей работе в офисе вы можете в одном из постов этого блога, а сегодня я хочу поговорить о практической стороне доступности. Этот пост посвящён доступности изображений, выводимых через теги <img> и <svg>.

Вы узнаете:

• Как понять, нужна ли подпись (альтернативный текст) к картинке.

• Какие подписи будут too much.

• Как адаптировать картинки, которым нужна подпись.

• И, наконец, как адаптировать картинки, которым не нужна подпись.

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

Этот вопрос преследует меня всю мою карьеру, начиная с 2013 года. Одни разработчики отвечают, потому что так правильно. Другие говорят про SEO. Третьи — ничего не говорят. А я считаю, что атрибут role является отличным ответом на этот вопрос!

Привет, я Таня Рузанова, специалист по доступности интерфейсов в компании РТЛабс. Сегодня расскажу о разных ограничениях здоровья и о ситуациях, которые могут помешать людям пользоваться сайтом или приложением. 

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

Многие разработчики думают, что доступность реализуется только с помощью aria-атрибутов. Если их не добавить, то всё, доступности нет. Конечно, aria-атрибуты нужны, но HTML и CSS такая же важная часть процесса создания доступных интерфейсов. Эти технологии непросто несут в себе кучу скрытых моментов, влияющих на доступность. Они напрямую позволяют её улучшить. В статье хочу показать это.

Я затрону не все аспекты. Их очень много, поэтому поговорю о: интерактивных элементах, доступности текста, анимации и изображениях. В статье буду использовать опыт моего незрячего знакомого (привет, Илья). Он внёс бесценный вклад. Уверен, что вам будет интересно. Поехали!

Все слышали про "эпилепсию", иногда натыкались на видео с пометкой "epilepsy warning". И вроде бы понятно, что это что-то связанное с резкими мерцаниями и переменами цветов, но так ли все просто на самом деле? На True Tech Hack одной из задач учатников стала "Адаптация фильмов для людей с особыми потребностями", а одной из таких потребностей стала возможность фильтровать или изменять сцены, которые могли бы вызвать эпилептические припадки. Именно о решении мною этой задачи я и хочу рассказать далее.

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

Применение эвристик полезнее, когда невозможно провести исследования, но необходимо аргументировать решения.

Ниже расскажу на примере реальных приложений про каждую эвристику.

На связи Дарья Баканова-Жараспаева, ведущий проектировщик и специалист по доступности интерфейсов на Госуслугах.

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

Что нового в анимации на основе скрола?

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

Раньше единственным способом создания анимации на основе скрола страницы, было реагирование на событие прокрутки в главном потоке. Это приводило к двум основным проблемам:

Прокрутка выполняется в отдельном потоке, поэтому события прокрутки передаются асинхронно.

Анимации основного потока подвержены помехам.

На связи снова Таня Миронова — руководитель направления доступности Госуслуг в компании РТЛабс. Сегодня расскажу, как повысить доступность сервисов и встроить контроль в производственные процессы компании. Из моего опыта и общения с коллегами удалось выделить 3 базовых подхода к обеспечению доступности. Расскажу о каждом в отдельности, а потом о том, какой вариант мы выбрали для себя на Госуслугах.

Привет, я Таня Рузанова, занимаюсь доступностью и правилами озвучивания интерфейсов для незрячих в компании РТЛабс. Сегодня расскажу и покажу на примерах, как оценить, смогут ли люди с ограничениями здоровья воспользоваться вашим сайтом или приложением.