Ссылки для пропуска и семантические ориентиры
Клавиатура позволяет перейти непосредственно к основному содержимому — без необходимости перемещаться по навигации и заголовку.
Что означает "Пропустить ссылки и семантические ориентиры"?
Ссылки для перехода — это невидимые ссылки в верхней части страницы, которые становятся видимыми при первом открытии вкладки с помощью клавиатуры, позволяя пользователям клавиатуры переходить непосредственно к основному содержимому, минуя навигацию, заголовки и рекламу. Семантические ориентиры (, , ) Предоставить программам чтения с экрана карту страницы, чтобы пользователи могли переключаться между разделами с помощью сочетания клавиш.
Обязательства и выгоды — WCAG 2.4.1.
WCAG 2.4.1 (Обходные блокировки) Это требует, чтобы повторяющиеся блоки контента можно было пропускать — это не просто „желательная функция", а требование уровня А. Без ссылки для пропуска пользователю клавиатуры приходится переключаться между десятками пунктов меню на каждой подстранице, прежде чем добраться до фактического контента. То же самое относится и к пользователям программ чтения с экрана — они слышат всю навигацию вслух.
Как именно мы это решим.
- Первый элемент, на который можно сфокусироваться на каждой странице:
<a class="skip-link" href="#main">Перейти к основному содержимому</a>. - CSS визуально скрывает ссылку (позиционирует её отрицательно), когда
:фокусЭто становится видимым — при контрастности уровня AAA. - Правильное использование структурных ориентиров: а)
, аза страницу.-элементы сaria-labelдля предотвращения неоднозначности (например, „основная навигация", „хлебные крошки"). - Проверка доступности в дереве инструментов разработчика браузера и с помощью программ чтения с экрана (VoiceOver / NVDA).
Соответствующие структурные элементы нашего модульного комплекса
-
Доступные формы
WCAG 3.3.1Четкие обозначения, программная обработка ошибок, валидация — никаких всплывающих окон браузера, никаких просьб заполнить.
-
Видимый индикатор фокусировки
WCAG 2.4.11Пользователи, использующие вкладки для навигации, всегда знают, где они находятся. Никакого исчезающего контура.
-
Простой язык (с поддержкой ИИ)
WCAG 3.1.5Упрощенный контент одним нажатием кнопки — для людей с трудностями при чтении, изучающих языки и тех, кто спешит.
-
Полная навигация с помощью клавиатуры
WCAG 2.1.1Все функции доступны — без мыши. Незаменимо для пользователей программ чтения с экрана, полезно для всех остальных.
Вам нужен именно этот модуль?
Первичная консультация (15 минут) — мы выясним, насколько она актуальна для вашего сайта.
Запишитесь на первичную консультацию
Дополнительная информация:
Обзор BFSG ·
Обзор производительности ·
Финансирование BAFA ·
Часто задаваемые вопросы
