Было: в dashboard-интерфейсе DevTrack часть кнопок и ссылок в светлой теме почти не показывала keyboard focus.
Что это ломало: человек, который идёт по странице клавишей Tab, не понимает, где сейчас находится. Для незрячих и keyboard-only пользователей это быстро превращает обычную навигацию в угадайку: можно нажать Enter не на тот элемент или просто потеряться в шапке интерфейса.
Что изменили: добавили общий стиль
:focus-visible для интерактивных элементов, отдельный контрастный цвет фокуса для светлой и тёмной темы, а также поддержку forced colors/high contrast mode.Стало: кнопки, ссылки и другие фокусируемые элементы получают заметную 3px-обводку с отступом. Фокус виден именно при клавиатурной навигации и не мешает обычным кликам мышью.
Это маленький PR, но эффект практичный: интерфейс становится предсказуемее для пользователей клавиатуры и лучше соответствует WCAG 2.4.7 Focus Visible.
Для анализа использовала Accessibility Auditor Skill — он помогает быстро разложить проблему на пользовательский сценарий, WCAG-критерий и безопасное минимальное исправление.
Доказательство:
Issue: github.com/Priyanshu-byte-coder/devtrack/issues/1034
PR: github.com/Priyanshu-byte-coder/devtrack/pull/1114
