1.4.8 Prezentacja wizualna - poziom AAA

To kryterium dotyczy bloków tekstu i tego, czy użytkownik może ustawić taki wygląd tekstu, który pozwoli mu spokojnie czytać (bez gubienia miejsca, bez męczenia wzroku i bez walki z układem).

O co chodzi w kryterium 1.4.8?

WCAG wymaga, żeby dla wizualnego przedstawienia bloków tekstu istniał mechanizm, dzięki któremu da się osiągnąć wszystkie poniższe rzeczy:

• użytkownik może zmienić kolor tekstu i kolor tła
• szerokość wiersza nie przekracza 80 znaków (albo 40 dla alfabetów CJK)
• tekst nie jest wyjustowany (czyli nie jest wyrównany jednocześnie do lewego i prawego marginesu)
• odstępy między wierszami w akapitach wynoszą co najmniej 1,5, a odstęp między akapitami jest co najmniej 1,5 razy większy niż odstęp między wierszami
• tekst da się powiększyć do 200% bez technologii wspomagających i bez konieczności przewijania w poziomie, żeby przeczytać cały wiersz (przy zmaksymalizowanym oknie)

Co to znaczy w praktyce?

Najczęściej strony nie spełniają kryterium WCAG 1.4.8 „w tekście”, tylko w tym, jak działa układ strony:

• Jeśli ustawisz na stałe kolory tekstu i tła w treści głównej (np. wymusisz tło i kolor fontu), możesz odebrać użytkownikowi możliwość dobrania własnych ustawień.
• Jeśli robisz bardzo szerokie bloki tekstu (długie wiersze), część osób gubi linię i miejsce czytania, dlatego WCAG podaje limit szerokości.
• Justowanie tekstu potrafi utrudniać czytanie, bo tworzy nieregularne odstępy między wyrazami stąd w 1.4.8 widnieje warunek „tekst nie jest wyjustowany”.
• Przy powiększeniu 200% nie może być tak, że użytkownik musi przewijać w poziomie, żeby doczytać linijkę do końca.

Jak to szybko sprawdzić na stronie?

Weź stronę z dłuższym tekstem (np. artykuł, opis usługi) i zrób trzy proste testy:

1. Powiększ tekst do 200% i sprawdź, czy da się czytać bez przewijania w poziomie całych linijek.
2. Sprawdź, czy w treści głównej da się zastosować własne ustawienia kolorów (czy strona ich nie blokuje).
3. Sprawdź, czy akapity mają sensowną „oddechową” interlinię i odstępy, a tekst nie jest ustawiony jako justowany.

Pełny tekst kryterium 1.4.8 Prezentacja wizualna

Dla wizualnego przedstawienia bloków tekstu, istnieje mechanizm, za pomocą którego można osiągnąć, co następuje:

• Kolory na pierwszym planie oraz kolory tła mogą być zmienione przez użytkownika.
• Szerokość nie przekracza 80 znaków (40 w przypadku alfabetów: chińskiego, japońskiego i koreańskiego).
• Tekst nie jest wyjustowany (tzn. wyrównany do prawego i lewego marginesu).
• Odstępy między wierszami w akapitach wynoszą przynajmniej 1,5 wysokości linii, a odległość między akapitami jest przynajmniej 1,5 razy większa niż ta pomiędzy wierszami.
• Rozmiar tekstu może zostać powiększony do 200% bez użycia technologii wspomagających, nie wymagając od użytkownika, chcącego odczytać cały wiersz, przesuwania tekstu w poziomie przy zmaksymalizowanym oknie ekranu .

Źródło: https://www.w3.org/Translations/WCAG21-pl/#prezentacja-wizualna

Chcesz wiedzieć więcej?

• 1.1.1 Treść nietekstowa - poziom A
• 1.2.1 Tylko audio lub tylko wideo (nagranie) - poziom A
• 1.2.2 Napisy rozszerzone (nagranie) - poziom A
• 1.2.3 Audiodeskrypcja lub alternatywa tekstowa dla mediów (nagranie) - Poziom A
• 1.2.4 Napisy rozszerzone (na żywo) - poziom AA
• 1.2.5 Audiodeskrypcja (nagranie) - poziom AA
• 1.2.6 Język migowy (nagranie) - poziom AAA
• 1.2.7 Rozszerzona audiodeskrypcja (nagranie) - poziom AAA
• 1.2.8 Alternatywa dla mediów (nagranie) - poziom AAA
• 1.2.9 Tylko audio (na żywo) - poziom AAA
• 1.3.1 Informacje i relacje - poziom A
• 1.3.2 Zrozumiała kolejność - poziom A
• 1.3.3 Właściwości zmysłowe - poziom A
• 1.3.4 Orientacja - poziom AA
• 1.3.5 Określenie pożądanej wartości - poziom AA
• 1.3.6 Określenie przeznaczenia - poziom AAA
• 1.4.1 Użycie koloru - poziom A
• 1.4.2 Kontrola odtwarzania dźwięku - poziom A
• 1.4.3 Kontrast (minimalny) - poziom AA
• 1.4.4 Zmiana rozmiaru tekstu - poziom AA
• 1.4.5 Obrazy tekstu - poziom AA
• 1.4.6 Kontrast (wzmocniony) - poziom AAA
• 1.4.7 Niska głośność lub bez dźwięków w tle - poziom AAA
• 1.4.8 Prezentacja wizualna - poziom AAA
• 1.4.9 Obrazy tekstu (bez wyjątków) - poziom AAA
• 1.4.10 Dopasowanie do ekranu - poziom AA
• 1.4.11 Kontrast elementów nietekstowych - poziom AA
• 1.4.12 Odstępy w tekście - poziom AA
• 1.4.13 Treść spod kursora lub fokusu - poziom AA