Accessibility *

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

У меня тремор головы. Несколько лет, с неврологом. Муж однажды подарил тайский массаж, и девушка, помимо массажа, прошлась по точкам тела: спина, шея, лицо. На одной из них я заметила, что тремор стих. Она тоже заметила. Сказала, что её отец занимается точками и научил её. Я не поверила, но запомнила.

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

Мне нужны были говорящие часы для слабовидящего человека. Купил первые попавшиеся на маркетплейсе и понял, что они непригодны, так как звук тихий, голос высокий и неразборчивый для пожилого человека.
Пришлось слепить говорящие часы самому. Использовал то, с чем был знаком. А именно, написал программу для Windows. Возможно, кому-то пригодится.

Привет, Хабр!

Я часто вам рассказываю, как HTML и CSS помогают улучшить пользовательский опыт в наших веб-интерфейсах. Мне это наскучило. Сегодня я хочу поговорить с вами о практиках, которые заставляют пользователей очень сильно ругать разработчиков.

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

Давайте посмотрим, что я вам подготовил.

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

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

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

Привет, Хабр!

Я говорю о семантической вёрстке уже десять лет. Только как-то так получилось, что в последнее время я ничего не писал на эту тему. Надо исправляться!

В современных веб-интерфейсах я часто встречаю определённый набор семантических элементов. Это header, main, nav, footer. Даже элемент button встречается. Реже, чем другие, но всё же есть.

Не будем на этом останавливаться! Сегодня мы с вами рассмотрим ещё несколько элементов, которые почему-то редко используются. Хотя с ними ваша вёрстка станет ещё более семантичной, а значит, и интерфейсы станут ещё лучше.

Давайте посмотрим, что я вам подготовил.

Bash/awk formatter для Linux CLI: превращает ps, top, df, free и другие таблицы в key: value, vertical или JSON Lines. Пригодится для восприятия информации на слух через скринридер или для конвертации таблиц в JSON для автоматической обработки

Привет, Хабр.

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

Вместо обычного ворчания я делюсь мыслями о том, как исправить ситуацию. Больше всего мне нравится показывать, что HTML и CSS могут помочь в этой задаче.

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

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

А теперь давайте посмотрим, что я вам подготовил.

Я незрячий и пользуюсь NVDA. После покупки ExeGate LLB-3000 выяснилось, что работать с PowerManagerII с клавиатуры и на слух неудобно. Вместе с Codex я разработал дополнение: разобрали графические кнопки, наладили навигацию, добавили текстовые показания и проверили управление. Рассказываю, как устроено решение и что в этой работе делал я.

Казалось бы, на дворе 2026 год, есть статьи про доступность (и ещё больше на английском) и, собравшись организовать повышение доступности у себя в отдельно взятом «корпоративном микрорайоне», просто берёшь, читаешь, сталкиваешься с тем, что о процессах организации разработки и тестирования accessibility мало что есть, но не останавливаешься, так как молод, полон сил и наивен, и проживаешь год, полный удивительных приключений и невыносимой радости бытия.

Меня зовут Шуст Иван, за мной закреплено более 15 продуктовых команд, что делают фичи ежедневного входа, профиля, истории операций и связанные с безопасностью. Поэтому я, как лид, имею прямое отношение к процессам внедрения accessibility в Альфе, проживший последний год, пытаясь наладить и внедрить процессы accessibility, расскажу о всех граблях, которые мы собрали. Вы узнаете о рабочих подходах при работе с доступностью и как делать вот точно-точно не надо. 

Технических подробностей будет мало. Но будет очень много про процессы/политику/конфликты, — всё то, что так сильно любят лиды будет интересно всем. В общем, добро пожаловать под кат.

Я незрячий и пользуюсь двумя Braille eMotion 40. На одном устройстве мне стало тесно в рамках штатного набора программ, поэтому я сделал доступный диспетчер APK и автономный установщик для Windows. Рассказываю, почему для интеграции понадобился отдельный пакет-мост, как я проверял опасные операции и какую часть работы взял на себя GPT Codex.

Привет, Хабр!

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

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

Давайте посмотрим, что я вам подготовил.

Привет, Хабр!

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

Мне нравится наблюдать за тем, как меняются подходы к ней. Это не история о том, что раньше всё было плохо, а сейчас хорошо, или наоборот. Просто одни ошибки уходят, а на их место приходят другие.

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

Давайте посмотрим, что я вам подготовил.

Уже более 10 лет мы сопровождаем Единый официальный сайт органов власти Ханты-Мансийского автономного округа — Югры (admhmao.ru, далее – сайт), в структуру которого входят ещё 36 сайтов органов власти округа. За это время требования к доступности государственных сайтов несколько раз менялись.

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

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

Меня зовут Антонина, я дизайнер интерфейсов ЮMoney. Мы изучили десятки исследований — от Baymard Institute до Google web.dev. Единого документа с лучшими практиками не нашлось: источники противоречили друг другу или оказывались слишком общими.

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

Девять чисел из научной статьи 2009 года сегодня работают у меня в четырёх местах: на HTML-странице, в canvas, в двух плагинах Figma и в чужом расширении для Chrome. Разбираю, как одна и та же матрица цветовосприятия ведёт себя в четырёх средах, где каждая среда сопротивляется по-своему — и почему честные ограничения инструмента важнее его возможностей.

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

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

Я долго думала, как это починить. И в итоге перестала объяснять словами. Я сделала штуку, которая даёт побыть тем самым пользователем — на несколько секунд. Расскажу, как она устроена и почему чек-листы не работают.

Свежее исследование Стэнфорда (Nature Health, январь 2026) связало дальтонизм с поздней диагностикой рака мочевого пузыря — у пациентов-дальтоников смертность за 20 лет на 52% выше. Причина в том, что главный ранний симптом, кровь в моче, они просто не видят: цвет для них не считывается. Это медицинская история, но она точно описывает ошибку, которую дизайнеры делают каждый день — кодируют критическую информацию одним только цветом. Разбираю, как устроена эта ошибка в интерфейсах и что с ней делать на практике.

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

Сотни строк кода, страницы документации, корпоративные чаты — и всё это каждый день. Когнитивная нагрузка не снижается. Внутри — система инструментов, которая помогает мне не тонуть: конфиги clang и специфичные настройки VSCode, приложения визуализации и др. С объяснением зачем каждый из них.