Pomijanie bloków

Co wymaga kryterium

Jeśli ten sam blok treści pojawia się na wielu stronach — nagłówek strony, główna nawigacja, mega-menu, pasek nawigacji okruszkowej, linki pomocnicze — użytkownicy myszy pomijają go natychmiast. Użytkownicy klawiatury muszą go tabulować przy każdym otwarciu strony. Użytkownicy czytników ekranu muszą go wysłuchiwać. Kryterium wymaga co najmniej jednego mechanizmu umożliwiającego przejście wprost do treści głównej.

WCAG akceptuje kilka mechanizmów: link „Przejdź do treści głównej”, właściwe regiony orientacyjne (<header>, <nav>, <main>, <footer>) lub prawidłową hierarchię nagłówków, po której użytkownicy czytników ekranu mogą nawigować klawiszem H. W praktyce link pomijający w połączeniu z elementami orientacyjnymi stanowi bezpieczną linię bazową.

Jak spełnić wymaganie

• Dodaj link „Przejdź do treści głównej” jako pierwszy element fokusowany na stronie. Powinien być widoczny po uzyskaniu fokusu, a nie trwale ukryty.
• Atrybut href linku pomijającego wskazuje na id elementu <main>; do <main> dodaj tabindex="-1", aby Safari prawidłowo przenosiło fokus.
• Używaj właściwych elementów orientacyjnych: jeden <header>, jeden <nav> (lub kilka z aria-label), jeden <main>, jeden <footer> na stronie.
• Utrzymuj czytelną hierarchię nagłówków, by użytkownicy JAWS i NVDA mogli nawigować klawiszami H, 1, 2, 3.
• Jeśli masz wiele powtarzających się bloków (nawigacja pomocnicza + główna + okruszki), rozważ dodanie drugiego linku pomijającego dla najbardziej uciążliwego z nich.

Typowe błędy

• Link pomijający ukryty z użyciem display: none zamiast przeniesienia poza ekran i ujawniania przy fokusu — technologie wspomagające nie mogą go znaleźć.
• Element docelowy linku pomijającego bez tabindex="-1", przez co Safari i WebKit ignorują przeskok i fokus pozostaje na samym linku.
• Element <main> zagnieżdżony w <nav> lub powielony kilka razy na stronie.
• Hierarchia nagłówków pomijająca poziomy (h1 → h4) lub używająca nagłówków wyłącznie do wizualnego doboru rozmiaru, co niszczy strategię nawigacji klawiszem H.
• Stałe nagłówki strony przesłaniające sfokusowany element po uruchomieniu linku pomijającego — zob. 2.4.11.

Dlaczego to ważne

Pomijanie bloków to najtańsze usprawnienie dostępności na liście — link pomijający to zaledwie około 10 linii HTML i CSS — a mimo to wskaźnik błędów na stronach produkcyjnych nadal wynosi około 60% według corocznego skanu WebAIM Million. Dla użytkownika korzystającego wyłącznie z klawiatury, nawigującego po stronie z 40-elementowym mega-menu, tabulowanie przez nie przy każdym otwarciu strony jest wyczerpujące i przy dłuższych sesjach — ograniczające.