en<able> - о дизайне и доступности
814 subscribers
112 photos
4 videos
4 files
81 links
О дизайне с фокусом на цифровую доступность

По всем вопросам @anzhelikagerman
Download Telegram
5. Доступность с клавиатуры. Требования, рекомендации, опыт разработки…
Инклюзивный ананас
Доступность с клавиатуры. Требования, рекомендации, опыт разработки компонентов

С вами пятый выпуск Инклюзивного Ананаса! 🍍

В этот раз мы с Таней обсуждаем доступность с клавиатуры. Рассказываем про критерии WCAG 2.1 и WCAG 2.2, которые нужно соблюдать, приводим примеры из личного опыта при разработке и тестировании компонентов, делимся частыми ошибками и пробегаемся по руководствам от W3C про разработку клавиатурного интерфейса.

00:10 — Приветствие.
00:40 — Тема выпуска.
00:53 — Новости.
02:56 — Кто пользуется клавиатурой.
09:15 — Элементы с фокусом.
09:44 — Страшная история про кнопки.
14:46 — WCAG 2.1 про клавиатуру.
31:07 — WCAG 2.2 про клавиатуру.
46:08 — Реальные кейсы, распространённые ошибки.

Расшифровку можно почитать на нашем сайте!
Там же вы можете найти ссылки на все платформы, где мы еще выкладываемся :)
👍74🔥4
Обожаем подкасты, а этот особенно ❤️ Глаша и Таня очень легко и интересно говорят о сложных вещах.
7👍2
Субтитры.

Готовлю большую статью про них. Наверно, вы видели то, что сейчас происходит в Instagram*: все массово используют автоматические субтитры, часто это слишком быстрая скорость, неконтрастные цвета и тд.

И наткнулась на кастомизацию (обожаю-обожаю) субтитров Youtube - 9 пунктов, которые ты можешь изменить. Находится в настройках субтитров. Чудесно же, да?

*Instagram — проект Meta Platforms Inc., деятельность которой в России запрещена.

en<able> - о дизайне
#Анжелика #субтитры
🔥13👍21
2023 Digital Accessibility Index

Компания AudioEye провела большое исследование, проверив автоматическим способом более 40 000 сайтов из разных сфер, а также тестировала более 20 сайтов с помощью респондентов с разными ограничениями по здоровью.

93% сайтов содержали хотя бы 1 страницу без alt текста.
90% сайтов содержали хотя бы 1 страницу с недоступной ссылкой.
В каждой 4-й форме отсутствовали четкие инструкции, как нужно ее заполнять.

Вы можете проверить свой сайт на цифровую доступность https://www.audioeye.com/digital-accessibility-index/key-insights/form-accessibility-tips/#site-scan

Я проверила apple.com, у них 13 ошибок. А здесь лежит отчет по Vc.ru, у него 16 ошибок https://www.audioeye.com/scan/results/?uuid=e1f5d539-efca-4cfe-8129-1f687906c8ab&&url=https://vc.ru&&partner=false

en<able> - о дизайне
#Анжелика #автоматическаяпроверка
👍51🔥1
Мы совсем недавно познакомились с Женей из Контура, он инженер-программист в команде дизайн-системы, участвует в разработке компонентов, которыми пользуются все внешние сервисы Контура ❤️

Ребята внутри компании создали свой кружок по A11y, в котором:
- Запустят свой курс по доступности для разработчиков и дизайнеров Контура
- Занимаются аудитом сервисов Контура, привлекая пользователей с ограниченными возможностями
- Потихоньку затаскивают доступность в дизайн-систему
- Всячески драйвят a11y движуху в Контуре

Все же видели новости от ребят? Если нет, прочитайте здесь «Контур.сайн» первым из продуктов «Контура» стал доступен.

А теперь у Жени есть канал про Цифровую доступность, где будут новости и полезности! Искренне уважаю и восхищаюсь 🙂
10❤‍🔥4👍1🔥1
27 октября (пятница) в московском офисе VK пройдёт конференция VK Инклюзия, посвящённая цифровой доступности - https://team.vk.company/vkinclusion23/

Ребята собрали исключительно практиков IT-рынка, которые реально меняют цифровые продукты и всю индустрию.

На мероприятии выступят эксперты из Альфа-Банка, Госуслуг, Контура, Моего офиса, Мос.ру, Сбера, Яндекса️️, Dodo Engineering, ВКонтакте, OK, Mail.ru, VK ID, RuStore.

На конференции будут лекции по доступной разработке, accessibility-дизайну и организации бизнес-процессов, а также круглый стол, посвящённый импакт-контенту.

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

В программе интерактивные форматы и даже инклюзивный стендап с переводом на русский жестовый язык.
В программе стендапа:
• резидент телевизионных проектов и различных диджитал-шоу Александр Петросян;
• участница стендап-шоу Open Mic 2023, главная героиня документального фильма «Чип внутри меня» Яна Линкевич;
• финалист Comedy Battle, участник шоу «Открытый микрофон» на ТНТ и шоу Money Mic от VK Руслан Шамухаметов;
• ведущий — киборг, блогер bionic_russia Константин Дебликов.

VK Инклюзия пройдёт в гибридном формате: очно в московском офисе VK и онлайн. Обе версии будут переводится на РЖЯ.

Мероприятие бесплатное, однако регистрация обязательна. Залетайте, пожалуйста, пока не расхватали
https://team.vk.company/vkinclusion23/
🦄7👍51👏1
Возращаемся после перерыва 💜 У нас продолжается учеба на курсе по цифровой доступности от Валерии Курмак @neiskluchenie, скоро сдача редизайна музейных сайтов, у Аси - Пушкинский музей, у меня Третьяковская галерея. Дальше будет тестирование прототипа у незрячего пользователя. И это очень волнительно, все ли мы учли. Расскажем обязательно, как все прошло.
8👍2
All Inclusion - Медиа про опыт людей с инвалидностью и без.

Рома Клюкин создал новое медиа и выразил свои мысли в манифесте:

1. Инвалиды — в порядке;
2. Права человека — цель;
3. Инклюзия — путь;
4. Попутчики — драгоценность;
5. Принятие — итог.

https://t.iss.one/allinclusion

Рома — продакт-менеджер и внедряет доступность в Яндекс Учебнике. При этом у него пигментная абиотрофия сетчатки и частичная потеря слуха, кстати, в последнем посте он рассказывает про личный опыт и налог на инвалидность. Все посты полезные, очень рекомендую почитать 🔮

Про Рому, автора канала https://t.iss.one/allinclusion/18
All Inclusion Media https://t.iss.one/allinclusion/87
Что такое инклюзия https://t.iss.one/allinclusion/94
6👍2🔥1
Contrast Grid

Сегодня принесла вам инструмент, который поможет построить цветовую матрицу в соответствии с WCAG 2.1.

А еще есть экспорт Grid HTML & CSS.

Ссылка на фигма плагин https://www.figma.com/community/plugin/993414361395505148/contrast-grid
Ссылка на сайт https://contrast-grid.eightshapes.com

en<able> - о дизайне в A11y
🔥821👍1💘1
🧭 Long time no see! Давно не виделись!

Давайте начнем со свежего исследования Яндекса о технических предпочтениях пользователей с нарушениями зрения в 2023 году.

Исследователи провели опрос и проанализировали около 500 подробных анкет, собранных на специализированных сайтах для людей с нарушениями зрения.

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

✦ Доля пользователей телефонов и планшетов с сенсорным экраном выросла до 98,8% и впервые превысила долю пользователей ПК, которая упала с 97,3% до 91,4%.

✦ Самыми популярными операционными системами остаются Windows (98,7%) и Android (79,7%), доля iOS и iPadOS увеличилась с 37,2% до 38,6%, а macOS снизилась с 12,2% до 9,4%.

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

73,5% опрошенных отдают приоритет мобильным приложениям, а не мобильным веб-версиям сервисов, так как считают их менее удобными и доступными.

✦ Основные программы экранного доступа на ПК — NVDA с долей в 66,3% и JAWS с долей 27,5%.

✦ Самые популярные программы на смартфонах и планшетах — Talkback с долей 54,6%, Jieshuo Screenreader с долей 39,9% и VoiceOver для iOS с долей 38,8%.

✦ Самым популярным браузером на ПК остаётся Chrome, его доля выросла с 42,9% до 47,9%. Доля Firefox упала с 28,7% до 18,9%, третье место занимает Яндекс Браузер, доля которого выросла с 6,9% до 16,4%.

✦ На мобильных устройствах лидирует Chrome с долей в 41% против 49,5% в 2020 году. На втором месте Safari с долей в 26,5%, на третьем — Яндекс Браузер, его доля выросла с 8,1% до 20,4%.

en<able> - о дизайне в A11y
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5🌭21👍1🦄1
👁 Доброе утро! Всю неделю только и разговоры про Apple Vision Pro.

Собрала подборку статей и видео на эту тему.

✦ Видео от Apple "Как создавать приложения для Vision Pro" https://developer.apple.com/videos/play/wwdc2023/10034/

✦ Видео от Apple про функции доступности, которые уже заложены в Vision Pro https://www.youtube.com/watch?v=E1DLpGWOUsk&t=1s

Подробный разбор настроек доступности в Apple Vision Pro https://www.youtube.com/watch?v=b-GLz_VMCe4

✦ Интересная статья на Forbes о том, что у Apple Vision Pro есть свои ограничения, как у физического предмета. А еще автор говорит про косоглазие и его проблемах при регистрации в FaceID, что тоже может быть ограничением при использовании шлема https://clck.ru/38Z4Cs

✦ Доступность Vision Pro: Большой потенциал, но много неизвестных https://sixcolors.com/post/2023/06/vision-pro-accessibility-great-potential-but-many-unknowns/

en<able> - о дизайне в A11y
👍31👌1
Ничего удивительного - просто переписываемся с Якобом Нильсеном в LinkedIn.

Когда увидела уведомление из LinkedIn, клянусь, чуть со стула не упала )))
31👏2
⌨️ Исследование невизуальной доступности 2023

Ребята из Everland огромные молодцы, собрать такое большое исследование (6 сфер, 36 компаний, 90 платформ) и показать в структурированном виде 👍

Исследование https://startinclusion.ru/issledovanie

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

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

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

В их телеграм-канале саммари исследования https://t.iss.one/inclusion_everland/655

Everland занимается трудоустройством людей с инвалидностью и развитием доступной среды (в т.ч. и цифровой доступностью).

en<able> - о дизайне в A11y
Please open Telegram to view this post
VIEW IN TELEGRAM
👍41
5 - Отличная доступность - Проблем не замечено либо имеется 1–2 незначительных комментария.

И 5 все еще очень мало! Есть куда стремиться )
🔥71
Channel name was changed to «en<able> - о дизайне и доступности»