Я — Денис, Android-разработчик в «Лайв Тайпинге». В этой статье я продолжу рассказывать о современных подходах разработки адаптивного UI /UX для людей с ограниченными возможностями, разных национальностей и особенностями развития. В этой статьей я расскажу про разработку интерфейсов в XML и Compose для варьирующего размера шрифта. А также покажу почему атрибут contentDescription
так важен.
Accessibility *
Помогаем людям с повышенными потребностями
Я полностью слеп и я сам себе техподдержка
Во-первых, 20 лет назад вы могли написать практически в любую компанию и получить от нее персонализированный ответ. Теперь все расписано по скриптам, и в таких действительно крупных компаниях, как Google, любой технически подкованный человек, который потратил приличное количество времени на использование продукта, вероятно, будет более осведомлен, чем агенты службы поддержки. Я рассматриваю это скорее как результат плохого обучения, чем чего-либо еще, хотя подозреваю, что рабочая среда и низкая оплата труда, вероятно, способствуют полному отсутствию желания выходить за рамки этого обучения.
Десять лет назад (я взял эту цифру с потолка, но я думаю, что она точна) это все еще было в какой-то степени верно, но чтобы компенсировать это, агенты обычно имели определенный уровень прозрачности и контроля над системами, которые они поддерживали, и некоторые возможности, которых нет у пользователей. Сейчас часто кажется, что служба поддержки существует только для того, чтобы делать то же самое, что мы уже можем делать с веб-сайта или приложения.
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 6
Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке.
Сегодня мы рассмотрим следующие аспекты:
- какие символы нужно пропускать в тексте для атрибута
alt
; - в какой ситуации атрибут
inert
может быть бесполезен; - как атрибут
maxlength
не позволил моей знакомой купить авиабилеты; - в чём польза свойства
border
в режиме высокого контраста дисплея.
Давайте начнём!
Как студенты участвовали в огромной IT выставке со своим стендом
Всем привет, на связи Максим Рожков, frontend разработчик команды "ПИН-КОД".
Наша студенческая команда смогла поучаствовать в выставке с демонстрационным вариантом нашего сервиса "Изучение русского жестового языка".
В этой статье вы узнаете, как обычные студенты поучаствовали в масштабной IT выставке в Екатеринбурге.
Истории
Прокачиваем вёрстку ARIA-атрибутами. Атрибут role
В разговорах людей, интересующихся доступностью, часто можно услышать слово «Роль». Так, что это такое? Это специальная форма представления элемента для скринридера. Устанавливается она с помощью атрибута role
. Сегодня поговорим о нем.
Я не буду описывать всё. Атрибут слишком сложный для одной статьи. Остановлюсь на моментах, которые вы можете использовать сразу. Продвинутые техники оставим на другой случай.
Давайте начнём!
Технические предпочтения пользователей с нарушениями зрения в 2023 году. Исследование Яндекса
Цифровые продукты и сервисы стали обыденным явлением, и сегодня это часть повседневной жизни самых обычных людей, а не только ранних энтузиастов новых технологий. Однако есть пользователи, которые по-прежнему испытывают существенные трудности при взаимодействии с современными информационными технологиями. Они вынуждены преодолевать большой порог вхождения, осваивать не самые простые дополнительные инструменты и нетривиальные способы взаимодействия с компьютерной техникой, а также постоянно сталкиваются с неудобными или просто неработоспособными интерфейсами.
Привет, Хабр. Меня зовут Никита, я помогаю коллегам из Яндекса с технической экспертизой по вопросам accessibility. В этой статье я хочу поделиться результатами очередного исследования технических предпочтений пользователей с нарушениями зрения, которое предназначено для специалистов, работающих в сфере цифровой доступности. О подобном исследовании я рассказывал в 2020 году.
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 5
Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке.
Сегодня мы рассмотрим следующие аспекты:
- какое количество символов следует использовать для текста подсказки для атрибута
alt
; - в чём польза атрибута
lang
; - почему использование текстовых символов для декоративных задач — это плохая идея;
- для чего существует режим повышенной контрастности.
Давайте начнём!
Прокачиваем вёрстку ARIA-атрибутами. Атрибут aria-hidden
Хабр, я рассказал вам, как создавать подсказки с помощью атрибута aria-label
. Это отличный шаг к классному опыту для пользователей скринридера. А сегодня сделаем второй — мы научимся правильно скрывать элементы. Встречайте, атрибут aria-hidden
.
<dl> или <table>? Исследуем подходы к представлению пар ключ-значение в HTML
Казалось бы, простая задача - сверстать список пар ключ-значение. Бери <div>
и делай. Но что, если захотелось подушнить? Этим и займёмся в статье...
Рассмотрим три подхода к решению этой задачи: <div>
, <dl>, <dt>, и <dd>
, и <table>
. Обсудим преимущества, недостатки и примеры.
Цель - помочь выбрать наиболее подходящий подход для конкретной задачи.
Особенности подготовки текстов для правильного воспроизведения в программах для незрячих
Я впервые столкнулся с разработкой для незрячих пользователей в 2008 году, когда принимал участие в разработке программного телефона для контакт-центров, в котором большое число агентов было незрячими.
Когда один из моих коллег потерял зрение, у меня было 10 лет опыта с технологической точки зрения. По возвращении коллеги на работу моей задачей была подготовка для него отчетов о качестве звука в зависимости от используемых каналов связи, моделей телефонных аппаратов, версий программного обеспечения, вариантов используемых кодеков и массы прочих факторов.
Такую информацию логично было сводить в таблицы. Коллега слушал бы их, получая нужную информацию.
Но, как быстро выяснилось, информация в чистом виде очень плохо воспринимается на слух. Её нужно специально подготавливать, чтобы было кратко и информативно. И даже незначительные изменения в форматировании текста приводят к тому, что он полностью меняется при озвучании скрин-ридерами.
В результате итеративного анализа того, что плохо звучит, я идентифицировал причины, по которым что-то может так звучать, и выработал набор правил, как нужно оформлять тексты, чтобы их было удобно воспринимать на слух.
Набором этих правил я и хочу поделиться.
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 4
Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке.
Сегодня мы рассмотрим следующие аспекты:
- как сверстать поиск, чтобы им мог воспользоваться пользователь скринридера;
- чем полезно свойство
outline-offset
; - зачем вам нужно использовать медиа-функцию
prefers-color-scheme
; - где должен находиться заголовок в разметке блока с новостью.
Давайте начнём!
Сервис изучения русского жестового языка с применением модели распознавания жестов
Всем доброго первого зимнего дня!
Меня зовут Рома, я проджект менеджер студенческой команды ПИН-КОД.
Мы хотим рассказать о первой в России продуктовой истории с моделью распознавания РЖЯ - сервисе изучения русского жестового языка и представить небольшой кусочек, который вы сможете сами "пощупать". ?
GigaChat и русский жестовый язык
Всем привет! Меня зовут Капитанов Александр, я отвечаю за направление компьютерного зрения в SberDevices. В этой статье я расскажу о том, как моя команда Vision RnD разработала серию моделей SignFlow, обеспечивающих перевод с жестового языка на русский и американский английский в реальном времени с высокой метрикой качества. На основе этих моделей мы реализовали прототип общения с генеративной языковой моделью GigaChat, что является первым в мире открытым решением задачи общения с искусственным интеллектом при помощи русского жестового языка (РЖЯ). Далее я расскажу о разработке модели, тонкостях обучения, демо-стенде и интеграции с GigaChat.
Ближайшие события
Доступность игр для людей с ограниченными возможностями: проблемы и их решения
Видеоигры — это прекрасно. Они есть для любой возрастной категории, самых разных жанров. Однако далеко не все игры доступны каждому: слишком много преград для людей с ограниченными возможностями. Большинство из нас имеют нормальный слух, зрение и здоровую опорно-двигательную систему. Мы не отказываем себе в прохождении самых разных игр — от простых казуалок на экране смартфона до серьёзных стратегий с кучей текста или авто- и авиасимуляторов — лишь бы денег хватало на контроллеры. Но что, если я вам скажу, что в мире, по данным ВОЗ, живёт 1,3 миллиарда человек с инвалидностью?
Многие разработчики стремятся сделать графику более реалистичной. Современные движки и игры, разрабатываемые на них, требуют всё больше ресурсов. Однако людям, у которых есть проблемы со зрением, в целом без разницы, насколько красиво выглядит игра — главное, чтобы в неё было комфортно играть. И к сожалению, большинство разработчиков даже не пытается сделать свои проекты более доступными для людей с ОВЗ.
Не нужно блокировать кнопки
Инклюзивность в продуктах: новые возможности? Или путь в никуда?
Привет, я Марго — инклюзивный продакт. Впервые вопросом «Какого черта одним можно, а другим нет?» я задалась после отдыха в Турции, где мы с друзьями покоряли горки в аквапарке. Все было круто, потом мы прилетели в Россию и решили повторить, но на аттракционы… меня не пустили.
В ответ на праведный и почти цензурный гнев я услышала что-то про СанПиН (которых не нашла) и грязные колеса (которые я не подумала протереть, да же ж?).
Так вот, именно эту проблему решает инклюзивность: чтобы все могли разгонять адреналин на горках, пользоваться любыми приложениями и устройствами, пить пиво и тусить в клубах, вне зависимости от физических, национальных, гендерных и других особенностей.
И если вы подумали: «Эта ваша мораль и этика вовсе не про бизнес, а мы тут деньги зарабатываем», у меня для вас новости.
Инклюзивность — это действительно +100500 к карме, а еще способ сыграть на метриках и получить прибыль. Как? Погнали читать!
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 3
Хабр, я уже третий месяц пишу про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке.
Сегодня уже будет не только HTML и CSS. В некоторых кейсах мы будем использовать ARIA-атрибуты. Я расскажу:
- как мы незаметно потеряли пользу элементов
<section>
и<form>
; - как атрибут
tabindex
запутывает незрячего пользователя; - почему визуально скрытые элементы — проблема современных интерфейсов;
- что делать с паттерном «Звёздочка» для обязательных полей.
Давайте начнём!
Работа над доступностью: с чего начать, куда копать, как оценить прогресс
Допустим, вы уже прониклись важностью обеспечения доступности ваших сервисов, закатали рукава и готовы взяться за работу.
С чего же начать? Сделать методички для дизайнеров? Протестировать свои продукты на пользователях с нарушениями зрения? Отправить всех разработчиков читать материалы по доступной разработке?
Что вам действительно важно, если вы занялись доступностью? Вам важны работающие доступные сервисы, поэтому начать надо с решения конкретных проблем. Вам нужны быстрые победы. Много и недорого.
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 2
Я продолжаю рассказывать, как HTML и CSS могут улучшить или ухудшить доступность интерфейсов. В своём рассказе я использую свой опыт и моего незрячего знакомого Ильи.
В этой статье будет: атрибут autofocus
и его нюансы, паттерн «Skip-link» и идея Ильи об использовании его на практике, проблема использования одинаковых ссылок для одной новости, что не так с кнопкой «Наверх» и как вы спрятали список от скринридеров.
Давайте начнём!
Как я использовал тематическое разделение доступа для создания веб-приложения
В этой статье я хочу поделиться своим опытом использования тематического разделения доступа (ТРД) для создания веб-приложения, которое позволяет пользователям обмениваться сообщениями по разным темам. ТРД — это метод управления доступом, при котором права доступа субъектов системы на объекты группируются с учётом специфики их применения, образуя роли¹. Например, в моём приложении есть роли администратора, модератора, автора и читателя. Каждая роль имеет свой набор прав на разные действия, такие как создание, редактирование, удаление и просмотр сообщений.
Вклад авторов
melnik909 737.0Ohar 246.2Tseikovets 185.3MastaLomaster 174.6phillennium 168.0Foxvic 153.0tyomitch 153.0iovodov 147.0Delka 147.0savoptik 133.0