1.4.5 Obrazy tekstu - poziom AA

To kryterium mówi, że jeśli to możliwe, tekst powinien być prawdziwym tekstem, a nie obrazem treści. 

Jeśli technologie, w jakich używa się treści, mogą doprowadzić do wizualnej prezentacji, tekst jest używany do przekazywania informacji, a nie obrazy tekstu, z wyjątkiem sytuacji, gdy:

• obrazy tekstu można dostosować, albo
• prezentacja tekstu jest niezbędna.

O co tu chodzi w praktyce?

Jeśli wrzucasz na stronę baner, plakat albo grafikę z napisem (np. „Rekrutacja trwa”, „Zapisy do 15 maja”, „Uwaga! Zmiana terminu”), to dla wielu osób to będzie problem, bo:

• tekst na grafice nie skaluje się jak normalny tekst,
• często ma gorszy kontrast,
• nie da się go zaznaczyć, skopiować ani łatwo przetłumaczyć,
• a czytniki ekranu nie odczytają go tak, jak odczytują zwykły tekst (tu wraca temat alternatywy tekstowej z 1.1.1).

Kiedy obraz tekstu jest dopuszczalny?

WCAG wskazuje dwie sytuacje, kiedy obraz tekstu może się pojawić:

Obraz tekstu można dostosować

Czyli użytkownik może zmienić wygląd tego tekstu tak, jak zmienia normalny tekst (np. wielkość, kolory). To w praktyce jest rzadkie, bo większość grafik jest „płaska” i nie daje takich możliwości. 

Prezentacja tekstu jest niezbędna

To dotyczy sytuacji, gdy konkretny krój, wygląd albo układ liter jest częścią przekazu i nie da się tego sensownie oddać normalnym tekstem. Najbardziej typowy przykład to logo (które zresztą ma też swoje wyjątki w innych kryteriach).

W pozostałych przypadkach obraz tekstu bez transkrypcji nie ma prawa występować na stronie interentowej. 

Co powinien robić redaktor, żeby spełnić kryterium WCAG 1.4.5?

Najprościej: jeśli w grafice jest informacja, którą użytkownik ma przeczytać, to przenieś ją do tekstu strony.

Zamiast grafiki z napisem „Zapisy do 15 maja”: daj normalny nagłówek i akapit na stronie, a grafikę zostaw jako ilustrację.

Zamiast plakatu w JPG z całą treścią wydarzenia: daj treść wydarzenia w HTML, a plakat potraktuj jako dodatkowy materiał (z odpowiednim opisem alternatywnym).

To też najlepsza ochrona przed problemami z 1.4.3 (kontrast) i 1.4.4 (zmiana rozmiaru tekstu), bo normalny tekst da się powiększać i łatwiej utrzymać czytelność.

Jak zapewnić dostępność obrazu tekstu?

Jeśli zależy Ci na publikacji plakatu przepisz treść z plakatu pod plakatem - po prostu wpisz ”Transkrypcja: i słowo w słowo treść z plakatu włącznie z wymienieniem pojawiających się tam logotypów” a w opisie alternatywnym plakatu wpisz “Transkrypcja dostępna poniżej”. Jeśli treść z plakatu pokrywa się z treścią tekstową aktualności/podstrony nie trzeba jej już przepisywać po prostu dodaj tekst alternatywny: “Transkrypcja dostępna w treści” :)

Pełny tekst kryterium 1.4.5 Obrazy tekstu

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

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