Praca z dostępnością / WCAG
Domyślnie warstwa zgody jest przygotowana tak, aby była dostępna dla czytników ekranu i podobnych narzędzi, ale w niektórych przypadkach może być konieczne dostosowanie ustawień projektu.
Włącz obsługę WCAG dla banerów plików cookie
Aby włączyć obsługę WCAG (Web Content Accessibility Guidelines 2.2), zaloguj się na swoje konto i przejdź do Menu > Projekty i edytuj odpowiedni projekt. Rozwiń ustawienia w „Box Settings” i włącz WCAG:
Zmiany WCAG w wynikach warstwy zgody
Jeśli dla projektu włączono ustawienie WCAG, do warstwy zgody zostaną zastosowane następujące zmiany:
- Warstwa zgody zostanie umieszczona w elemencie shadowRoot
- Nagłówki w warstwie zgody będą używać elementu I zamiast
- Teksty przełączające będą używać elementu zamiast
- Menu na warstwie ustawień niestandardowych będzie używać elementu zamiast
- Elementy weryfikacji wieku zostaną oznaczone etykietą
- Tabele będą opatrzone podpisami
- Elementy otrzymają atrybuty aria-label, aria-checked, aria-modal, role i podobne
- Dostępna jest opcja Gatekeeper (patrz poniżej)
Opcja Gatekeepera
Gdy WCAG jest włączone, można również włączyć opcję Gatekeeper. Zapobiega to utracie fokusu przez warstwę zgody: jeśli użytkownik naciśnie klawisz TAB (lub podobny element nawigacyjny na klawiaturze), fokus zawsze pozostanie w warstwie zgody i nie przeskoczy do pozycji w witrynie.
Uwagi dotyczące projektu
Należy pamiętać, że zmiany techniczne mogą również wymagać dodatkowych zmian w samym projekcie, aby w pełni spełnić wymogi WCAG. Przykłady obejmują:
- Używanie odpowiedniego rozmiaru czcionki (np. em lub pt zamiast px)
- Stosowanie powszechnie dostępnego kroju czcionki bezszeryfowej (np. Times New Roman, Verdana, Arial, ...)
- Używanie kolorów i współczynnika kontrastu, które można łatwo rozróżnić (np. współczynnik kontrastu 3:1 między tekstem a tłem)
- Użyj odstępu w tekście, który umożliwia łatwe czytanie treści (np. wysokość wiersza 1.5 em)
Oprócz czysto graficznych zmian, niektóre wymagania WCAG mogą wymagać użycia pewnych ustawień w projekcie. Na przykład, aby spełnić wymagania WCAG, może być konieczne włączenie menu w projekcie warstwy zgody.
Dalsze czytanie
- Wytyczne WCAG na w3.org: https://www.w3.org/TR/WCAG22/
