Kryterium 1.4.12 – Odstępy w tekście to jedno z nowych wymagań wprowadzonych w WCAG 2.1 (Poziom AA). Ma ono na celu zapewnienie, że tekst na stronie internetowej pozostaje czytelny i zrozumiały, nawet gdy użytkownik zmieni odstępy między liniami, akapitami, wyrazami i literami.
W tym artykule pokażemy, jak łatwo sprawdzić, czy strona spełnia to kryterium — bez potrzeby zaglądania do kodu czy znajomości CSS.
Co oznacza „odstępy w tekście”?
To nic innego jak sposób, w jaki tekst jest rozmieszczony — zarówno między wierszami i akapitami, jak i pomiędzy literami i wyrazami.
WCAG wymaga, aby po zmianie domyślnych odstępów do poniższych wartości treść pozostała czytelna i funkcjonalna:
-
Wysokość linii (line-height): co najmniej 1,5x wielkości czcionki
-
Odstęp między akapitami: co najmniej 2x wielkość czcionki
-
Odstęp między literami (letter-spacing): co najmniej 0,12x
-
Odstęp między wyrazami (word-spacing): co najmniej 0,16x
Użytkownicy z dysleksją lub problemami poznawczymi często dostosowują te parametry, aby łatwiej czytać treść. Strona powinna się do tego dostosować — bez błędów w układzie tekstu.
Jak sprawdzić zgodność z kryterium 1.4.12 bez wiedzy technicznej?
1. Zainstaluj rozszerzenie do testowania stylów tekstu
Co zrobić?
Skorzystaj z darmowych rozszerzeń do przeglądarek, które pozwalają na szybkie modyfikowanie odstępów w tekście, np.:
-
Stylus (Chrome, Firefox) – umożliwia wprowadzenie własnych stylów CSS.
-
Reader Mode – niektóre przeglądarki mają wbudowany tryb czytania, który pozwala regulować odstępy.
Na co zwrócić uwagę?
-
Czy po zmianie odstępów tekst nie nachodzi na inne elementy?
-
Czy linie się nie nakładają?
-
Czy interlinie i marginesy nie „psują” układu strony?
Przykład błędu:
Po zwiększeniu odstępu między akapitami tekst wychodzi poza ekran lub zasłania inne elementy (np. zdjęcia lub przyciski).
2. Skopiuj tekst do edytora i sprawdź jego zachowanie
Co zrobić?
Skopiuj fragment tekstu z witryny i wklej go np. do Worda, Google Docs lub innego edytora tekstu.
Zmień:
-
interlinię (na 1,5),
-
odstępy między literami i wyrazami (np. 0,2 lub 0,3 pt).
Na co zwrócić uwagę?
-
Czy tekst nadal jest czytelny?
-
Czy zmiany sprawiają, że treść jest bardziej przejrzysta?
To nie jest test strony, ale pozwala lepiej zrozumieć, dlaczego odpowiednie odstępy mają znaczenie.
Dlaczego to ważne?
Osoby z trudnościami w przetwarzaniu języka (np. dysleksją), z zaburzeniami koncentracji lub wzroku, często dostosowują sposób wyświetlania tekstu, by lepiej go odbierać. Jeśli strona tego nie umożliwia — np. z powodu „sztywnego” stylu CSS — mogą mieć problem ze zrozumieniem treści lub nawet całkowicie zrezygnować z jej czytania.
Podsumowanie
Kryterium 1.4.12 – Odstępy w tekście pomaga uczynić treści bardziej przystępne dla wszystkich użytkowników, niezależnie od ich potrzeb poznawczych i preferencji czytania. Strona powinna pozwalać na zmianę odstępów między liniami, akapitami, literami i wyrazami bez utraty czytelności i funkcjonalności.
Dobre praktyki:
-
Projektuj teksty z wystarczającymi odstępami już na starcie.
-
Unikaj „na sztywno” zdefiniowanych stylów w pikselach.
-
Testuj treści przy różnych wartościach interlinii i odstępów.
-
Upewnij się, że tekst nie koliduje z innymi elementami po modyfikacjach.
Dbając o odpowiednie odstępy w tekście, zwiększasz komfort czytania i wspierasz użytkowników z różnymi potrzebami – bez kompromisów dla estetyki strony.