WCAG 3.2.4 Единообразная идентификация

Критерий успеха 3.2.4 позволяет разобраться в сайте один раз. Пользователи программ экранного доступа (скринридеров) ориентируются по доступным именам, а люди с когнитивными нарушениями или трудностями в обучении — по знакомым словам и иконкам. Если одна и та же кнопка поиска на одной странице называется «Поиск», а на другой — «Найти», человек может решить, что это разные функции. Это уровень AA, в EN 301 549 он представлен как пункт 9.3.2.4. Тот же стандарт принят в Украине как ДСТУ EN 301 549:2022.

Что требует критерий

Компоненты с одинаковой функциональностью в пределах набора веб-страниц должны идентифицироваться единообразно. «Одинаковая функциональность» означает, что компонент при использовании даёт один и тот же результат. Идентификация включает видимую подпись, иконку и альтернативный текст или доступное имя.

Уточнения из документа W3C Understanding:

• единообразие не означает идентичность: формулировка может зависеть от контекста, если функция остаётся узнаваемой;
• компоненты, которые делают разное, не обязаны называться одинаково;
• критерий касается только компонентов, которые действительно повторяются на нескольких страницах.

Типичные ошибки в интернет-магазине

• «В корзину» на страницах товаров и «Купить» на страницах категорий для одного и того же действия, с разными доступными именами;
• у иконки корзины альтернативный текст «Корзина» в одном шаблоне и «Сумка» или вообще никакого имени — в другом;
• поле поиска подписано «Поиск» в шапке и «Найти товары» в мобильном меню, с разными иконками;
• одна и та же ссылка «Скачать счёт» в одном месте с иконкой принтера, в другом — с иконкой документа;
• видимая подпись одинаковая, но aria-label на разных страницах отличается.

Как проверить

Автоматически: в нашей проверке нет правила для этого критерия. Она может сообщить об отсутствующих именах (см. 4.1.2), но решить, что два компонента выполняют одну функцию, может только человек.

Вручную: составьте список компонентов, которые встречаются на многих страницах: поиск, корзина, личный кабинет, избранное, «В корзину», подписка на рассылку, переключатель языка. На страницах разных типов сравните их видимую подпись, иконку и доступное имя (через инспектор элементов или скринридер). Отметьте те, что различаются при одинаковой функции.

Как исправить

• Задайте подписи один раз в строках перевода темы и используйте их во всех шаблонах.
• Используйте один набор иконок и один альтернативный текст для каждой функции.
• Синхронизируйте значения aria-label с видимыми подписями и начинайте доступное имя с видимого текста.
• Если приложения добавляют свои кнопки, переименуйте их в соответствии с формулировками темы.

Связанные критерии

• 3.2.3 Единообразная навигация — повторяющаяся навигация в одном и том же порядке.
• 2.5.3 Подпись в имени — доступное имя содержит видимую подпись.
• 4.1.2 Имя, роль, значение — у каждого элемента управления есть имя.

Частые вопросы

Должны ли подписи совпадать слово в слово?

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

Распространяется ли 3.2.4 на иконки?

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

Может ли автоматическая проверка протестировать 3.2.4?

Нет. Решить, выполняют ли два компонента одну функцию, может только человек, поэтому это ручная проверка на нескольких страницах.