Kryteria sukcesu WCAG · Level AAA
WCAG 2.4.8: Lokalizacja
WCAG 2.4.8 wymaga, aby użytkownicy mogli określić, gdzie się znajdują w obrębie zestawu stron internetowych — na przykład za pomocą okruszków nawigacyjnych (breadcrumbs), map witryny lub wyróżnionych linków nawigacyjnych. Pomaga to osobom z niepełnosprawnościami poznawczymi, użytkownikom czytników ekranu oraz każdemu, kto porusza się po złożonych serwisach, zorientować się i przemieszczać po treściach z pewnością siebie.
Co Oznacza Ta Zasada
WCAG 2.4.8 Location to kryterium poziomu AAA w ramach zasady Operable. Stwierdza: „Informacje o położeniu użytkownika w obrębie zestawu stron internetowych są dostępne.” W praktyce oznacza to, że Twoja strona musi zapewniać wyraźne, stałe sygnały, które w każdej chwili informują użytkowników dokładnie, gdzie znajdują się w szerszej strukturze serwisu.
Kryterium to ma zastosowanie zawsze, gdy strona internetowa składa się z wielu podstron zorganizowanych w sensowną hierarchię lub sekwencję — na przykład serwis e‑commerce z kategoriami, podkategoriami i stronami produktów albo portal rządowy z działami i podsekcjami. Jeśli użytkownik trafi na stronę, powinien być w stanie odpowiedzieć na pytanie „Gdzie jestem w tym serwisie?” bez zgadywania i bez polegania wyłącznie na pamięci.
Akceptowalne techniki spełnienia tego kryterium obejmują między innymi:
- Ścieżki okruszków (breadcrumbs) — pomoc nawigacyjna pokazująca drogę od strony głównej serwisu do bieżącej strony (np. Home > Products > Laptops > 15-inch Models).
- Mapy serwisu — dedykowana strona lub panel prezentujący ogólną strukturę serwisu i wyróżniający lub oznaczający bieżące położenie.
- Wyróżnione lub wizualnie odróżnione linki nawigacyjne — menu nawigacyjne, które wyraźnie oznacza aktywną sekcję lub stronę, często uzupełnione atrybutem
aria-currentdla użytkowników technologii asystujących. - Numerowane kroki w procesie wieloetapowym — wskaźniki takie jak „Krok 2 z 5” w procesie zakupu lub kreatorze formularza, które komunikują pozycję w sekwencji.
Strona spełnia to kryterium, jeśli dostępny jest co najmniej jeden wiarygodny mechanizm informujący użytkownika o jego bieżącym położeniu w strukturze serwisu. Strona nie spełnia kryterium, jeśli taki mechanizm nie istnieje — na przykład gdy pasek nawigacyjny nie zawiera żadnej wizualnej ani programistycznej informacji o bieżącej stronie, nie ma ścieżki okruszków i nie jest wyświetlany żaden wskaźnik kroku.
Ważne jest, że WCAG 2.4.8 nie narzuca konkretnej techniki; wymaga, aby istniał jakiś skuteczny wskaźnik położenia. Aby jednak wskaźnik był naprawdę dostępny, musi być również postrzegalny dla technologii asystujących, takich jak czytniki ekranu, a nie tylko wizualnie widoczny dla osób widzących. Oznacza to, że wyłącznie wizualne wskaźniki (takie jak pogrubiony link bez zmiany etykiety dostępnej) mogą być niewystarczające, jeśli nie są programistycznie ujawnione.
WCAG nie przewiduje oficjalnych wyjątków od tego kryterium poza ogólnym założeniem, że dotyczy ono zestawów powiązanych stron. Pojedyncza, samodzielna strona internetowa, która nie jest częścią większego zestawu, nie musi spełniać tego kryterium, ponieważ nie ma tu „położenia w obrębie zestawu”, które należałoby komunikować.
Dlaczego To Ma Znaczenie
Świadomość, gdzie się znajdujesz w środowisku cyfrowym, to podstawowa potrzeba orientacyjna, którą większość użytkowników uważa za oczywistą — dopóki nie zabraknie odpowiednich wskazówek. WCAG 2.4.8 odnosi się do realnej i powszechnej bariery, której doświadcza kilka odrębnych grup użytkowników.
Osoby z niepełnosprawnościami poznawczymi należą do najbardziej dotkniętych. Schorzenia takie jak zespół nadpobudliwości psychoruchowej z deficytem uwagi, zaburzenia pamięci czy nabyte uszkodzenia mózgu mogą utrudniać śledzenie swojej ścieżki w złożonym serwisie. Bez ścieżki okruszków lub podobnego sygnału użytkownik może się zdezorientować, nie wiedzieć, jak wrócić do kategorii nadrzędnej lub nie rozumieć, jak bieżąca strona ma się do treści, które już widział. Według Światowej Organizacji Zdrowia ponad miliard ludzi na świecie żyje z jakąś formą niepełnosprawności, a zaburzenia funkcji poznawczych stanowią istotną i często niedostatecznie obsługiwaną część tej populacji.
Użytkownicy czytników ekranu — zazwyczaj osoby niewidome lub słabowidzące — w dużym stopniu polegają na strukturze programistycznej, aby zrozumieć kontekst strony. Osoba widząca może jednym rzutem oka spojrzeć na wyróżniony link nawigacyjny lub pogrubiony element ścieżki okruszków i natychmiast się zorientować. Użytkownik czytnika ekranu musi natomiast interpretować stronę poprzez sekwencyjny przekaz głosowy. Bez atrybutu aria-current="page" na aktywnym linku nawigacyjnym lub poprawnie zbudowanej ścieżki okruszków z dostępnymi etykietami nie otrzymuje równoważnego sygnału orientacyjnego i może być zmuszony do rozległej nawigacji tylko po to, by ustalić, gdzie się znajduje.
Osoby z niepełnosprawnościami ruchowymi, które nawigują za pomocą klawiatury, przełączników lub urządzeń śledzących ruch gałek ocznych, korzystają z wskaźników położenia, ponieważ zmniejszają one potrzebę powtarzalnej, wymagającej wysiłku nawigacji. Jeśli użytkownik wie już, że znajduje się w sekcji „Support” serwisu korporacyjnego, nie musi za każdym razem ponownie skanować całej struktury nawigacyjnej po załadowaniu nowej strony.
Rozważmy konkretny scenariusz: użytkownik z wczesnym stadium demencji przegląda portal internetowy tureckiego banku, aby znaleźć informacje o stopach procentowych kredytów hipotecznych. Klika kilka stron i nie jest pewien, czy nadal znajduje się w sekcji bankowości detalicznej, czy też przeszedł do obszaru bankowości firmowej. Bez ścieżki okruszków lub wyróżnionego elementu nawigacji wyraźnie oznaczającego bieżącą sekcję może zamknąć przeglądarkę z frustracji lub popełnić kosztowny błąd — na przykład złożyć wniosek o niewłaściwy produkt. Prosta, dobrze zaimplementowana ścieżka okruszków (np. Ana Sayfa > Bireysel Bankacılık > Krediler > Konut Kredisi) natychmiast rozwiązałaby to zamieszanie.
Poza dostępnością, wskaźniki położenia przynoszą mierzalne korzyści w zakresie użyteczności i SEO. Dane strukturalne dla ścieżek okruszków (z użyciem Schema.org BreadcrumbList) mogą pojawiać się bezpośrednio w wynikach wyszukiwania Google jako rozszerzone fragmenty, poprawiając współczynnik klikalności. Jasna struktura serwisu zmniejsza również współczynnik odrzuceń, ponieważ użytkownicy, którzy rozumieją, gdzie się znajdują, chętniej eksplorują powiązane treści zamiast porzucać stronę.
Powiązane Reguły Axe-core
WCAG 2.4.8 wymaga testów manualnych, ponieważ narzędzia automatyczne nie są w stanie wiarygodnie określić, czy mechanizm lokalizacji jest obecny, sensowny i dostępny we wszystkich kontekstach. Żadna reguła axe-core nie odwzorowuje bezpośrednio tego kryterium. Oto, dlaczego automatyzacja jest niewystarczająca i co musi objąć ocena manualna:
- Obecność mechanizmu lokalizacji (manualnie) — Automatyczny skaner może wykryć, czy w DOM istnieje element ścieżki okruszków, ale nie jest w stanie ustalić, czy ścieżka ta dokładnie odzwierciedla rzeczywistą architekturę informacji serwisu, czy jest umieszczona na każdej stronie w zestawie ani czy jest właściwym typem wskaźnika położenia dla modelu nawigacji serwisu. Narzędzie może znaleźć element
<nav aria-label="breadcrumb">i nie zgłosić problemu, nawet jeśli ścieżka okruszków pojawia się tylko na niektórych stronach lub zawiera nieprawidłowe informacje o hierarchii. - Dokładność i kompletność (manualnie) — Narzędzia automatyczne nie mogą zweryfikować, czy informacje o położeniu są poprawne. Ścieżka okruszków, która zawsze pokazuje „Home > Current Page” niezależnie od rzeczywistej hierarchii, przeszłaby skan automatyczny, ale nie spełniałaby tego kryterium, ponieważ nie odzwierciedla prawdziwego położenia użytkownika w zestawie stron.
- Programistyczne ujawnienie (częściowo automatyczne) — Choć axe-core może w niektórych konfiguracjach sygnalizować brak atrybutów
aria-currentna linkach nawigacyjnych, nie może jednoznacznie stwierdzić, czy brakaria-currentstanowi naruszenie 2.4.8 bez zrozumienia ogólnej struktury serwisu i roli każdego elementu nawigacyjnego. - Spójność w obrębie zestawu stron (manualnie) — Mechanizm lokalizacji musi być dostępny w całym odpowiednim zestawie stron, a nie tylko na wybranych stronach. Skanowanie automatyczne zazwyczaj ocenia jedną stronę naraz i nie jest w stanie sprawdzić, czy mechanizm jest konsekwentnie obecny w całym serwisie lub sekcji.
Jak Testować
- Identyfikacja zestawu stron: Ustal, czy strona poddawana testom należy do zestawu powiązanych stron z określoną hierarchią (np. wielopoziomowa struktura nawigacji, kreator krok po kroku lub skategoryzowana biblioteka treści). Jeśli strona jest samodzielnym dokumentem, to kryterium może nie mieć zastosowania.
- Uruchom skan automatyczny jako punkt odniesienia: Użyj axe DevTools (rozszerzenie przeglądarki) lub Lighthouse w Chrome DevTools, aby uruchomić audyt dostępności. Choć żadne z tych narzędzi nie audytuje bezpośrednio 2.4.8, sprawdź powiązane problemy, takie jak brak atrybutów
aria-currentna linkach nawigacyjnych, nieopisane regiony<nav>oraz brak struktury ścieżki okruszków. Te wyniki wspierają — ale nie zastępują — przeglądu manualnego. - Wizualnie sprawdź obecność mechanizmu lokalizacji: Poszukaj ścieżki okruszków, wyróżnionego lub wizualnie odróżnionego aktywnego linku w nawigacji, licznika kroków lub linku do mapy serwisu. Zweryfikuj, czy mechanizm dokładnie odzwierciedla pozycję bieżącej strony w hierarchii serwisu.
- Przetestuj z czytnikiem ekranu — NVDA + Firefox: Uruchom NVDA, przejdź na stronę i naciśnij
D, aby przełączać się między regionami. Zlokalizuj region(y) nawigacji i wsłuchaj się w wszelkie wskazówki dotyczące bieżącej strony lub sekcji. Sprawdź, czy aktywny element nawigacji jest ogłaszany inaczej (np. „current page” lub podobnie, zwykle dziękiaria-current="page"). Przejdź przez ścieżkę okruszków, jeśli jest obecna, i upewnij się, że każdy poziom jest ogłaszany z tekstem linku oraz że bieżące położenie jest wyraźnie zidentyfikowane. - Przetestuj z VoiceOver + Safari (macOS/iOS): Włącz VoiceOver (
Command + F5), przejdź do ścieżki okruszków lub głównej nawigacji, używającVO + U, aby otworzyć Rotor, i wybierz „Links” lub „Landmarks”. Posłuchaj, jak ogłaszany jest aktywny element nawigacji lub bieżący element ścieżki okruszków. Zweryfikuj, że bieżące położenie da się odróżnić od innych elementów nawigacji. - Przetestuj z JAWS + Chrome: Użyj
Insert + F7, aby otworzyć listę linków, orazInsert + F6, aby otworzyć listę nagłówków. Przejdź do obszaru ścieżki okruszków lub nawigacji i potwierdź, że bieżąca strona lub sekcja jest programistycznie identyfikowalna. Sprawdź, czyaria-currentjest odczytywane na głos (JAWS ogłasza to jako „current” dla odpowiedniego elementu). - Przetestuj na wielu stronach w zestawie: Przejdź przez co najmniej trzy do pięciu stron w tej samej sekcji lub hierarchii i potwierdź, że mechanizm lokalizacji jest poprawnie aktualizowany na każdej stronie oraz że jest konsekwentnie obecny w całym zestawie.
- Sprawdź DOM: Użyj narzędzi deweloperskich przeglądarki, aby upewnić się, że linki w ścieżce okruszków mają opisowe nazwy dostępne, że bieżący element używa
aria-current="page"(dla bieżącej strony) lubaria-current="true"(dla bieżącego kroku w procesie) oraz że ścieżka okruszków jest opakowana w element<nav>z dostępną etykietą, taką jakaria-label="Breadcrumb".
Jak Naprawić
Brak nawigacji breadcrumb — Niepoprawne
<!-- No breadcrumb or location indicator present.
Users have no way to determine their location in the site hierarchy. -->
<nav aria-label='Main navigation'>
<ul>
<li><a href='/'>Home</a></li>
<li><a href='/products'>Products</a></li>
<li><a href='/products/laptops'>Laptops</a></li>
</ul>
</nav>
<h1>15-inch Laptops</h1>
Brak nawigacji breadcrumb — Poprawne
<!-- A breadcrumb nav is added above the main content.
aria-label distinguishes it from main navigation.
aria-current="page" marks the current location for screen readers.
The list structure communicates hierarchy. -->
<nav aria-label='Breadcrumb'>
<ol>
<li><a href='/'>Home</a></li>
<li><a href='/products'>Products</a></li>
<li><a href='/products/laptops'>Laptops</a></li>
<li><a href='/products/laptops/15-inch' aria-current='page'>15-inch Laptops</a></li>
</ol>
</nav>
<nav aria-label='Main navigation'>
<ul>
<li><a href='/'>Home</a></li>
<li><a href='/products'>Products</a></li>
<li><a href='/products/laptops'>Laptops</a></li>
</ul>
</nav>
<h1>15-inch Laptops</h1>
Aktywny link nawigacyjny bez wskaźnika programistycznego — Niepoprawne
<!-- The active link is styled differently in CSS, but there is no
programmatic signal. Screen reader users cannot distinguish it
from the other navigation links. -->
<nav aria-label='Site navigation'>
<ul>
<li><a href='/about'>About</a></li>
<li><a href='/services' class='active'>Services</a></li>
<li><a href='/contact'>Contact</a></li>
</ul>
</nav>
Aktywny link nawigacyjny bez wskaźnika programistycznego — Poprawne
<!-- aria-current="page" is added to the active link.
Screen readers will announce this link as "current" or "current page"
depending on the assistive technology, giving users a clear
programmatic location signal in addition to the visual styling. -->
<nav aria-label='Site navigation'>
<ul>
<li><a href='/about'>About</a></li>
<li><a href='/services' class='active' aria-current='page'>Services</a></li>
<li><a href='/contact'>Contact</a></li>
</ul>
</nav>
Formularz wieloetapowy bez wskaźnika kroku — Niepoprawne
<!-- A multi-step checkout form with no indication of current step.
Users cannot determine how far they are through the process
or how many steps remain. -->
<form>
<h1>Shipping Information</h1>
<!-- form fields -->
<button type='submit'>Next</button>
</form>
Formularz wieloetapowy bez wskaźnika kroku — Poprawne
<!-- A progress indicator communicates the user's position in the sequence.
aria-label on the nav provides context.
aria-current="step" marks the active step for assistive technologies.
The visible text "Step 2 of 4" is also available for all users. -->
<nav aria-label='Checkout progress'>
<ol>
<li><a href='/checkout/cart'>Cart</a></li>
<li aria-current='step'><strong>Shipping</strong></li>
<li>Payment</li>
<li>Confirmation</li>
</ol>
</nav>
<form>
<h1>Shipping Information <span>(Step 2 of 4)</span></h1>
<!-- form fields -->
<button type='submit'>Next: Payment</button>
</form>
Typowe Błędy
- Umieszczanie ścieżki okruszków tylko na stronie głównej lub tylko na stronach liści: Ścieżka okruszków musi być konsekwentnie obecna na wszystkich stronach w zestawie. Wyświetlanie jej tylko na stronach szczegółów produktu, ale nie na stronach kategorii, tworzy luki w informacjach orientacyjnych.
- Używanie wizualnie wystylizowanego aktywnego linku bez dodania
aria-current="page": Pogrubiony lub podkreślony aktywny link nawigacyjny komunikuje położenie wizualnie, ale użytkownicy czytników ekranu nie odnoszą z tego korzyści, jeśli na tym elemencie nie jest obecnearia-current="page". - Opakowanie ścieżki okruszków w element
<div>zamiast<nav>: Użycie niesemantycznego kontenera oznacza, że ścieżka okruszków nie jest ujawniona jako region nawigacyjny, co utrudnia użytkownikom czytników ekranu jej odnalezienie i interpretację. - Pomijanie
aria-labelw elemencie<nav>ścieżki okruszków, gdy istnieje również główny region nawigacji: Dwa nieopisane elementy<nav>na tej samej stronie tworzą niejednoznaczność. Czytniki ekranu mogą ogłaszać oba po prostu jako „navigation”, przez co użytkownicy nie są w stanie ich rozróżnić. - Używanie
aria-current="true"na linku do strony zamiastaria-current="page": Wartośćpagejest semantycznie poprawną wartością do identyfikowania bieżącej strony w kontekście nawigacji. Użycietruejest mniej opisowe i może być ogłaszane inaczej lub mniej jasno przez technologie asystujące. - Poleganie wyłącznie na tytule strony jako wskaźniku położenia: Opisowy element
<title>(np. „Laptops — 15-inch Models | Acme Store”) jest pomocny i wymagany przez WCAG 2.4.2, ale sam w sobie nie spełnia 2.4.8, które wymaga mechanizmu przekazującego pozycję w strukturze zestawu stron, a nie tylko nazwę bieżącej strony. - Budowanie ścieżek okruszków odzwierciedlających strukturę URL zamiast hierarchii nawigacyjnej: Adresy URL i struktury nawigacji nie zawsze są zgodne. Ścieżki okruszków powinny odzwierciedlać logiczną architekturę informacji zrozumiałą dla użytkownika, a nie bazowy path URL, który może być techniczny lub nieprzejrzysty.
- Wyświetlanie ścieżki okruszków jako zwykłego tekstu bez linków do poziomów nadrzędnych: Jeśli pokazywana jest tylko bieżąca strona lub poziomy nadrzędne nie są linkami, ścieżka okruszków traci swoją użyteczność zarówno jako wskaźnik położenia, jak i pomoc nawigacyjna. Poziomy nadrzędne powinny być linkami, aby umożliwić użytkownikom przechodzenie w górę hierarchii.
- Oznaczanie bieżącego elementu ścieżki okruszków wyłącznie zmianą wizualnego separatora zamiast
aria-current: Zmiana koloru lub usunięcie podkreślenia z ostatniego elementu ścieżki okruszków nie komunikuje czytnikom ekranu, że reprezentuje on bieżącą stronę. Należy jawnie dodaćaria-current="page". - Zapominanie o aktualizacji wskaźnika położenia w aplikacjach jednostronicowych (SPA) po nawigacji po stronie klienta: W SPA zbudowanych z użyciem frameworków takich jak React czy Vue przejścia między „stronami” odbywają się bez pełnego przeładowania przeglądarki. Jeśli ścieżka okruszków lub aktywny wskaźnik nawigacji nie jest programistycznie aktualizowany przy zmianie trasy, będzie wyświetlał nieaktualne informacje o położeniu, co jest gorsze niż brak wskaźnika w ogóle.
Związek z Tureckimi Regulacjami Dotyczącymi Dostępności
Prezydenckie Okrężne Turcji 2025/10, opublikowane w Dzienniku Urzędowym nr 32933 w dniu 21 czerwca 2025 r., ustanawia wiążące wymagania dotyczące dostępności stron internetowych i aplikacji mobilnych dla szerokiego zakresu organizacji działających w Turcji. Okrężne nakazuje zgodność z międzynarodowo uznanymi standardami dostępności — w praktyce przyjmując ramy WCAG — i ma zastosowanie do określonych typów podmiotów, w tym instytucji i agencji publicznych, platform e‑commerce, banków i instytucji finansowych, szpitali i świadczeniodawców opieki zdrowotnej, firm telekomunikacyjnych z 200 000 lub większą liczbą abonentów, licencjonowanych biur podróży, prywatnych firm transportowych oraz szkół niepublicznych upoważnionych przez Ministerstwo Edukacji Narodowej (MoNE).
WCAG 2.4.8 Location jest sklasyfikowane jako kryterium poziomu AAA, co oznacza, że nie należy do podstawowych kryteriów prawnie wymaganych na mocy okrężnego, które jako minimalny próg odniesienia wskazuje zgodność na poziomie A i AA. Rozróżnienie to ma jednak istotne znaczenie dla organizacji objętych regulacją.
Po pierwsze, niektóre wyspecjalizowane usługi — szczególnie te obsługujące użytkowników z istotnymi trudnościami poznawczymi lub nawigacyjnymi, takie jak portale zdrowotne dla osób starszych czy platformy edukacyjne dla uczniów z trudnościami w uczeniu się — mogą być zobowiązane do wyjścia ponad bazowy poziom AA, aby rzeczywiście wypełnić ducha zobowiązań w zakresie dostępności wynikających z prawa tureckiego i powiązanych aktów, takich jak Ustawa o Osobach z Niepełnosprawnościami nr 5378. Wdrożenie 2.4.8 w tych kontekstach pokazuje realne, a nie tylko proceduralne, zaangażowanie w inkluzywność.
Po drugie, tureckie instytucje publiczne i regulowane podmioty prywatne są w coraz większym stopniu objęte mechanizmami audytu i skarg. Wykazanie zgodności na poziomie AAA — w tym z WCAG 2.4.8 — zapewnia możliwą do obrony dokumentację wdrożenia najlepszych praktyk i zmniejsza ryzyko regulacyjne w przypadku formalnej skargi dotyczącej dostępności.
Po trzecie, w szczególności dla platform e‑commerce i banków, wskaźniki położenia, takie jak ścieżki okruszków, mają bezpośrednią wartość komercyjną oprócz funkcji dostępności. Proces składania wniosku o kredyt hipoteczny w tureckim banku, który zawiera wyraźne wskaźniki kroków i nawigację breadcrumb, nie tylko skuteczniej obsłuży użytkowników z niepełnosprawnościami poznawczymi, ale także zmniejszy współczynnik porzuceń i wesprze konwersję — łącząc inwestycje w dostępność z mierzalnymi wynikami biznesowymi.
Organizacje korzystające z Accsible overlay SDK mogą wykorzystać jego wbudowane funkcje ulepszania ścieżek okruszków i wstrzykiwania aria-current, aby przybliżyć istniejące serwisy do zgodności z 2.4.8 bez konieczności pełnej refaktoryzacji bazy kodu. Jednak dla pełnej i solidnej zgodności — zwłaszcza w przypadku podmiotów objętych Prezydenckim Okrężnym 2025/10 — zalecanym podejściem pozostaje implementacja po stronie serwera lub na etapie budowania semantycznego kodu ścieżek okruszków i wskaźników nawigacji, ponieważ rozwiązania typu overlay uzupełniają, ale nie zastępują podstawowego, dostępnego kodu.
