ARIA-метки не чинят плохой интерфейс — они закрывают то, чего не видно глазами

ARIA-метки не чинят плохой интерфейс — они закрывают то, чего не видно глазами

Чаще всего ARIA нужна там, где нативный HTML не справляется: кастомные кнопки, выпадающие списки, переключатели, вкладки. Если элемент уже есть в HTML, сначала проверь его родную семантику. button лучше, чем div role="button", потому что клавиатура, фокус и поведение уже работают без костылей.

Главная ошибка — вешать ARIA «для красоты». Пустой aria-label, дублирование видимого текста, десяток ролей на одном элементе, aria-hidden="true" на том, что нужно озвучить, — всё это ломает доступность вместо того, чтобы помочь. ARIA не делает элемент доступным сама по себе: без фокуса, понятного состояния и клавиатурного управления она бесполезна.

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

Хорошее правило простое: если можно решить задачу семантическим HTML — выбирайте его; если без ARIA не обойтись, добавляйте её точечно и проверяйте с клавиатуры и скринридером.