Как создавать сервисы, доступные всем: опыт ЮMoney
Привет, меня зовут Паша Ефремов, я фронтенд-разработчик в ЮMoney. Я работаю с accessibility, то есть с доступностью сервисов. Хочу рассказать, как мы в компании делаем сайты и приложения доступными для людей с ограниченными возможностями, какие комбинации кода для этого используем и какими инструментами поддерживаем accessibility.
На наглядных примерах разберемся как проектировать интерфейсы, с которыми будет удобно взаимодействовать пользователям с особенными потребностями.
Для кого эта статья: не знаешь, что такое доступность или только слышал о ней.
Согласно оценкам, 1,3 миллиарда человек, или каждый шестой человек в мире, страдает существенными ограничениями возможностей здоровья
Accessibility/A11Y. Веб доступность - зачем и для кого?
Несколько лет назад я публиковал статью о том, как писать код не глядя.
Статья неплохо зашла, на столько неплохо, что меня пригласили поднимать с колен доступность в IDE на базе IntelliJ.
С виндой то там всё было ок, а вот для MacOS требовалось вмешательство, и я вмешался. Погнали под кат, там всё расскажу. А кто буковы не любит, внизу видео с моего доклада на SnowOne по этой теме.
Нередко получается так, что имея наследие и ограниченные ресурсы нужно делать так, чтобы продукт не проседал на фоне конкурентов.
Хочу поделиться как мы, имя слабую компонентную базу, умудрились завезти тёмную тему для айос и андроид.
При этом в «дано» у нас было:
— библиотека цветов в Фигме;
— библиотека цветов на платформах (с кучей цветов наследия);
— только базовые компоненты в Фигме и ещё меньше — в коде;
— иконочный сет и сет иллюстраций.
В статье я по шагам опишу наш путь.
Lighthouse - это инструмент для аудита веб-сайтов, который помогает разработчикам с помощью возможностей и диагностики улучшить пользовательский опыт их сайтов.
Lighthouse 10 доступен в командной строке через npm и в Chrome Canary. В ближайшие недели он появится в стабильном Chrome в Chrome 112 и в PageSpeed Insights.
28 декабря на площадке форума встретятся врачи, инженеры и ученые, которые представят свои разработки по развитию нейротехнологий и мозг-компьютерных интерфейсов.
В ходе мероприятия участники обсудят тренды нейроиндустрии и перспективы развития рынка «Нейронет» в России.
Согласно «дорожной карте» НТИ, к направлению «Нейронет» относятся:
- Нейропротезирование конечностей и органов чувств;
- Устройства и импланты для нейромодуляции и лечения заболеваний нервной системы;
- Нейроинтерфейсы, интегрированные в экзоскелеты, протезы, инвалидные коляски, системы «умный дом»;
- Системы нейрореабилитации после инсульта и травм мозга.
В числе приглашенных экспертов в рамках форума выступят:
- Александр Семенов, исполнительный директор Отраслевого Союза «Нейронет»;
- Андрей Богданов, исполнительный директор Фонда развития Физтех-школ;
- Наталья Подсосонная, заместитель директора Центра нейробиологии и нейрореабилитации по развитию «Сколтех»;
- Иван Бирюков, генеральный директор Центра «Технологии возможностей»;
- Андрей Виленский, руководитель экспертной группы Агентства по технологическому развитию;
- Денис Кулешов, директор Лаборатории «Сенсортные технологии для слепоглухих «Сенсор-Тех»;
- Андрей Андрианов, руководитель проектов внедрения инновационных технологий реабилитации ГК «Исток Аудио».
- Павел Фролов, основатель АО РОББО – открытой платформы образовательной робототехники;
- Михаил Лебедев, ведущий ученый в области инвазивных нейроинтерфейсов;
- Владимир Конышев, генеральный директор ООО «Нейроботикс».
В веб-разработке написание семантического HTML важно для доступности, а также дает некоторые приятные побочные эффекты, такие как поддержка режима «чтения» в браузере, SEO, graceful degradation и возможность экспорта.
Привет, меня зовут Анатолий Попко. Последние 15 лет (или около того) я работаю над тем, чтобы технологии становились доступнее для пользователей с различными ограничениями. Участвовал и продолжаю участвовать в работе разных групп и организаций, которые объясняют разработчикам технологий реальные потребности людей, пишут гайды, стандарты и так далее.
Уже много лет я сотрудничаю с Яндексом, а с прошлого года мы вместе строим единые процессы улучшения доступности в сервисах. Это бесконечный путь, всегда можно сделать лучше — текущее состояние продуктов Яндекса тоже не отражает идеальную картину. Я бы хотел рассказать об этой работе и поделиться примерами, которые можно брать и реализовывать где угодно. Поговорим о мифах, о моей работе тестировщиком цифровой доступности, да и в целом о восприятии окружающего мира.
Я не люблю нытьё «раньше трава была зеленее» и в целом рад техническому прогрессу. Но считаю, что вместе с развитием компьютеров произошли и некоторые перемены, которые ухудшили жизнь «продвинутых пользователей» (power users) в угоду массовому пользователю. Перемены, которые мешают людям использовать технологии максимально эффективно.
Думаю, что на Хабре много людей, которых эта проблема затрагивает. А ещё думаю, что ситуацию возможно хотя бы немного изменить к лучшему. Поэтому решил рассказать, в чём вижу проблему и путь её частичного исправления.
Что-то в тексте может показаться спорным, поэтому хочу уточнить: хотя этот пост размещён в блоге компании, мнение только моё личное.
По данным ВОЗ, в мире более миллиарда человек обладает с той или иной формой инвалидности. Поэтому Accessibility, или доступность, — важная штука в разработке программного обеспечения, особенно под мобильные платформы.
Адаптировать View-интерфейс для людей с ограниченными возможностями не так трудоёмко, как кажется: об этом мы рассказывали в предыдущей статье.
Сегодня — про Accessibility в Jetpack Compose: в нём сделать доступный графический интерфейс приложения ещё легче, чем на View. Разбираемся, как устроена поддержка доступности в Compose и какие особенности учесть при разработке.
Представьте, что в кафе на застолье пришел веган. Его друзья, зная это, специально выбрали кафе с отдельным меню для веганов. Но в нем только макароны с кабачками и вишневый компот, а в обычном меню есть и картошка, и салаты и другая еда, в которой достаточно заменить пару ингредиентов, чтобы веган мог это есть. Естественно, гость в недоумении? Почему макароны с кабачками? Для чего вообще отдельное веганское меню?
Это реальная история, которую рассказал мой друг Дима, проводя аналогию с версиями для слабовидящих. На самом деле раньше я тоже делала отдельную версию для слабовидящих и вбрасывала на сайт, совершенно не разбираясь в том, что такое доступность.
У меня есть хороший знакомый, который в 25 лет полностью потерял зрение. Представляете, все то, что для нас привычно, для него изменилось? Компьютеры и телефоны превратились в кирпичи, и толку от них стало мало. Или нет?
Привет! Меня зовут Андрей Кузнецов. Я frontend lead в «Рунет Бизнес Системы». Мы разрабатываем сервис для интернет-эквайринга банков, и работаем по модели White label, поэтому мне нельзя называть клиентов. Но я хочу рассказать, как у нас в компании появилось accessibility. То есть, доступность — возможность использования интерфейса всеми, независимо от физических или технических ограничений. Это история о том, как мы это нашли, на какие грабли наступали и к чему пришли в данный момент. Я буду считать, что не зря всё это написал, если после моего рассказа, вы захотите сделать шаги в сторону того, чтобы accessibility появилось и в ваших продуктах.
UX-дизайн может улучшить повседневную жизнь людей. А если вы работаете UX-дизайнером в сфере здравоохранения, то ставки ещё выше. По данным Grand View Research, сектор медицинских технологий является одним из самых быстрорастущих в мире с ожидаемым доходом в размере 1305,1 млрд долларов США в 2030 году. Как у UX-дизайнера, у вас есть возможность помочь определить будущее здравоохранения. Давайте рассмотрим роль UX-дизайна в сфере здравоохранения, влияние пандемии COVID-19 на цифровые медицинские решения, феномен старения населения и ключевую роль проектирования для новых технологий, таких как виртуальная реальность (VR) и искусственный интеллект (ИИ).
Большинство цифровых решений для здравоохранения разрабатывается на базе уникального программного обеспечения, которое имеет высокий спрос и у которого практически отсутствует конкуренция. Поэтому компании часто пренебрегают UX медицинских продуктов. Однако спрос на цифровые решения для здравоохранения, такие как телемедицина, резко возрос из-за пандемии COVID-19, и они стали гораздо более востребованными. Компании делают ставки на цифровые решения для здравоохранения и разрабатывают гораздо больше продуктов, чем до пандемии, что и вызвало необходимость в улучшении UX-дизайна.
Это заключительная статья из цикла статей о работе браузеров. Ссылка на первые два перевода:
Часть 1: навигация и получение данных
Часть 2: парсинг и выполнение JS
Статьи предназначена для начинающих разработчиков и тех, кто интересуется разработкой. Здесь нет глубоких технических деталей, хотя, возможно, вы найдете что-то новое для себя.
Помимо деревьев, о которых мы уже говорили — DOM, CSSOM и AST — браузеры также строят дерево специальных возможностей. Деревья, построенные на этапе парсинга (DOM, CSSOM), объединяются в дерево рендеринга. Его цель – убедиться, что содержимое страницы отобразит элементы в правильном порядке.
Согласно данным Всемирной организации здравоохранения, серьезные проблемы со зрением испытывают около 300 миллионов человек на нашей планете. Из них более 40 миллионов являются полностью незрячими.
Это огромная цифра, для сравнения: население Испании составляет всего 60 миллионов человек. По сути, в мире существуют целые «страны», населенные людьми с ограничениями по зрению, которым точно так же хочется общаться, делиться информацией и получать знания из всемирной паутины, как и всем нам.
Проведите эксперимент: закройте глаза и попробуйте воспользоваться Интернетом – прочитать новости на сайте Яндекса, зайти в вашу любимую социальную сеть или записать голосовое сообщение в мессенджере другу. Скорее всего, у вас ничего не получится.
А ведь с подобными проблемами каждый день сталкиваются миллионы слепых людей по всему миру. Итак, как же сделать сайт или приложение более доступными для незрячих и слабовидящих?
Дайджест новостей и полезных статей из мира фронтенд-разработки за неделю 27 июня–3 июля.
? Большое обсуждение, что использовать в prettier — табы или пробелы.
? W3C станет некоммерческой организацией, представляющей общественные интересы с января 2023 года.
Дайджест новостей и полезных статей из мира фронтенд-разработки за неделю 20–26 июня.
? EcmaScript 2022. 22 июня 2022 года 123 Генеральная ассамблея Ecma утвердила спецификацию языка ECMAScript 2022 — теперь он официально является стандартом. Внутри все новинки.
? Как создавать иконки сайтов в 2022 году — всё о favicon. Пришло время переосмыслить то, как мы создаем набор иконок для современных браузеров, и остановить безумные генераторы.
? Как будет выглядеть веб только с Chromium?. Chromium – это движок, Chrome – браузер. На Chromium построено большинство браузеров.
