Доступность сайта для AI-агентов важна потому, что семантический интерфейс сообщает смысл программно, а не только цветом и расположением. Нативная кнопка имеет роль и доступное имя, label связывается с полем, заголовки задают структуру. Эти сведения нужны людям, которые пользуются экранным диктором или клавиатурой, и могут помочь браузерному агенту понять страницу.
Но доступность и готовность к AI — не одно и то же. Соответствие WCAG не гарантирует, что любой агент оформит заказ, а WebMCP не делает сайт доступным людям автоматически. Это пересекающиеся области с разными целями.
Пример: кнопка, которая существует только визуально
Разработчик создаёт div, добавляет фон, надпись и обработчик клика. Мышью элемент работает. Клавиатура не может получить фокус, дерево доступности не сообщает роль, а агент видит обычный контейнер. Замена на button часто решает проблему без изменения дизайна.
Если кнопка повторяется в карточках, ей нужно понятное имя и связь с объектом. Десять элементов «Добавить» без информации о товаре создают неоднозначность даже при правильной роли.
Пример: форма с исчезающими подписями
Placeholder «Ваш телефон» выглядит как подпись, но исчезает после ввода. Пользователь забывает назначение поля, а программа не получает устойчивую связь. Явный label остаётся на месте и активирует поле при клике.
Ошибка должна быть связана с вводом и описана текстом. Красная рамка без сообщения недоступна человеку, который не различает цвет, и бесполезна агенту, пытающемуся исправить значение.
Динамический интерфейс требует сообщений о состоянии
После применения фильтра список обновляется через AJAX. Визуально появляются новые карточки, но программно непонятно, завершилась ли загрузка. Агент может прочитать старый результат или нажать кнопку во время перестройки.
Нужно различать ожидание, успешное обновление, пустой список и ошибку. Модальное окно управляет фокусом, а после закрытия возвращает его к исходному элементу. Эти детали редко видны на макете, но определяют работоспособность сценария.
Почему нельзя бездумно добавлять ARIA
Первое правило ARIA — использовать нативный HTML, когда он подходит. Атрибут role не добавляет автоматически клавиатурное поведение и серверную логику. Неверная роль способна сообщить ложный смысл. Например, контейнер можно назвать checkbox, но без состояния и обработки клавиш он останется имитацией.
- Сначала выбирайте нативный элемент.
- Добавляйте доступное имя, если видимой подписи недостаточно.
- Связывайте ошибки и подсказки с полем.
- Проверяйте клавиатуру и дерево доступности.
- Тестируйте смысл, а не только наличие атрибутов.
Что проверить на своём сайте
Пройдите ключевой путь только клавиатурой. Уберите CSS и посмотрите, сохраняется ли логика документа. Проверьте, различимы ли одинаковые ссылки и кнопки. Откройте форму с ошибками и выясните, можно ли понять их без цвета. В динамическом каталоге убедитесь, что состояние выбора сохраняется и сообщается.
Затем отдельно задайте агентский вопрос: какие данные нужны операции, как подтверждается результат и что произойдёт при повторе. Доступная кнопка всё равно может вызывать небезопасный серверный метод.
Алиса может проверить ключевой сценарий, исправить разметку и JavaScript и отделить ошибки доступности от проблем бизнес-логики.
Комментарии
Комментариев пока нет. Будьте первым!
Оставить комментарий