WCAG – Zasada 1: Postrzegalność

Tym artykułem rozpoczynam serię wpisów dotyczących standardu WCAG (Web Content Accessibility Guidelines). ​

W Polsce aktualnie obowiązującym standardem dostępności cyfrowej jest WCAG 2.1 na poziomie AA. Został on wprowadzony na mocy ustawy z dnia 4 kwietnia 2019 roku o dostępności cyfrowej stron internetowych i aplikacji mobilnych podmiotów publicznych, która implementuje postanowienia unijnej Dyrektywy (UE) 2016/2102. Zgodnie z tymi przepisami, wszystkie strony internetowe i aplikacje mobilne podmiotów publicznych muszą spełniać wymagania WCAG 2.1 na poziomie AA. Należy jednak zauważyć, że WCAG 2.2 został opublikowany przez W3C 5 października 2023 roku. Obecnie trwają prace nad jego implementacją w różnych krajach, w tym w Polsce. Oczekuje się, że w przyszłości WCAG 2.2 zastąpi wersję 2.1 jako obowiązujący standard dostępności cyfrowej. WCAG 2.2 w stosunku do 2.1 dodaje 9 nowych kryteriów sukcesu i usuwa jedno (4.1.1. Poprawność kodu). Dlatego w moich artykułach skupię się na najnowszym standardzie WCAG 2.2., opisując wszystkie kryteria sukcesu z każdego poziomu zgodności: A (podstawowy), AA (średni), AAA (najwyższy).

Wytyczne dotyczące dostępności treści internetowych WCAG 2.2 określają, jak sprawić, aby treści internetowe były bardziej dostępne dla osób z niepełnosprawnościami. Dostępność obejmuje szeroki zakres niepełnosprawności, w tym wzrokowe, słuchowe, fizyczne, poznawcze, językowe oraz neurologiczne. Chociaż wytyczne te obejmują wiele zagadnień, nie są w stanie całkowicie uwzględnić potrzeb każdej osoby z niepełnosprawnością. WCAG 2.2 również poprawia użyteczność treści dla osób starszych oraz ogólnie zwiększa komfort korzystania z internetu.

WCAG 2.2 zostały opracowane przez W3C w ścisłej współpracy z organizacjami i ekspertami z całego świata. Celem było stworzenie wspólnego standardu dostępności internetowej, który spełni potrzeby użytkowników, organizacji i rządów na całym świecie. WCAG 2.2 bazuje na wcześniejszych wersjach: WCAG 2.0 i WCAG 2.1, jednocześnie dodając nowe wymagania i aktualizacje.

W tym artykule skupię się na pierwszej, fundamentalnej zasadzie: Postrzegalności.

Zasada postrzegalności mówi, że informacje i komponenty interfejsu użytkownika muszą być przedstawiane użytkownikom w sposób, który mogą oni postrzegać . Oznacza to, że użytkownicy muszą być w stanie odbierać prezentowaną treść za pomocą swoich zmysłów – wzroku, słuchu, dotyku, a także poprzez inne formy, które są im dostępne.

Pod tą nadrzędną zasadą kryją się cztery główne wytyczne.

Zapewnij tekstowe alternatywy dla wszelkich treści nietekstowych, tak aby mogły być one zmienione w inne formy, których ludzie potrzebują, takie jak duży druk, brajl, mowa, symbole lub prostszy język.

Ta wytyczna jest absolutnie kluczowa dla osób niewidomych lub słabowidzących, które korzystają z czytników ekranu. Treść nietekstowa, taka jak obrazy, grafiki, audio czy wideo, musi posiadać tekstowy odpowiednik, który opisuje jej zawartość i funkcję.

Kryteria sukcesu powiązane z tą zasadą to:

Wszelkie treści nietekstowe prezentowane użytkownikowi muszą mieć tekstową alternatywę służącą równoważnemu celowi, z wyjątkiem określonych sytuacji. Wyjątki te obejmują m.in.:

• Kontrolki i wejścia użytkownika: Jeśli treść nietekstowa jest kontrolką lub akceptuje wejście użytkownika, musi mieć nazwę opisującą jej cel.
• Media oparte na czasie: Jeśli treść nietekstowa jest medium opartym na czasie, alternatywy tekstowe powinny przynajmniej zawierać opisową identyfikację tej treści.
• Testy: Jeśli treść nietekstowa jest testem, który stałby się nieważny po przekształceniu w tekst, alternatywy tekstowe powinny przynajmniej zawierać opisową identyfikację.
• Sensoryczne: Jeśli treść nietekstowa ma przede wszystkim na celu wywołanie określonego wrażenia sensorycznego, alternatywy tekstowe powinny przynajmniej ją opisowo zidentyfikować.
• CAPTCHA: Jeśli celem treści nietekstowej jest potwierdzenie, że dostęp uzyskuje człowiek, a nie komputer, należy zapewnić tekstowe alternatywy identyfikujące i opisujące cel tej treści oraz alternatywne formy CAPTCHA wykorzystujące różne modalności sensoryczne.
• Dekoracja, formatowanie, niewidoczne: Jeśli treść nietekstowa służy wyłącznie do dekoracji, formatowania wizualnego lub nie jest prezentowana użytkownikom, powinna być zaimplementowana tak, aby mogła być ignorowana przez technologie wspomagające.

Zapewnij alternatywy dla mediów opartych na czasie. Ta wytyczna dotyczy treści audio i wideo. Aby były one dostępne dla osób z wadami słuchu i wzroku, konieczne jest zapewnienie odpowiednich alternatyw.

Kryteria sukcesu powiązane z tą wytyczną to:

Dla nagranych treści tylko audio i tylko wideo muszą być spełnione określone warunki, chyba że audio lub wideo jest alternatywą tekstową i jest wyraźnie tak oznaczone. Do nagrań tylko audio należy zapewnić alternatywę prezentującą równoważne informacje. Dla nagrań tylko wideo należy zapewnić alternatywę lub ścieżkę dźwiękową prezentującą równoważne informacje.

Należy zapewnić napisy do wszystkich nagranych treści audio w zsynchronizowanych mediach, z wyjątkiem sytuacji, gdy media te są alternatywą tekstową i są wyraźnie tak oznaczone.

Należy zapewnić alternatywę dla mediów opartych na czasie lub audiodeskrypcję nagranej treści wideo w zsynchronizowanych mediach, chyba że media te są alternatywą tekstową i są wyraźnie tak oznaczone.

Należy zapewnić napisy do wszystkich treści audio na żywo w zsynchronizowanych mediach.

Należy zapewnić audiodeskrypcję dla wszystkich nagranych treści wideo w zsynchronizowanych mediach.

Należy zapewnić tłumaczenie na język migowy wszystkich nagranych treści audio w zsynchronizowanych mediach.

Tam, gdzie przerwy w dźwięku pierwszoplanowym są niewystarczające, aby audiodeskrypcje przekazały sens wideo, należy zapewnić rozszerzoną audiodeskrypcję dla wszystkich nagranych treści wideo w zsynchronizowanych mediach.

Należy zapewnić alternatywę dla mediów opartych na czasie dla wszystkich nagranych zsynchronizowanych mediów i wszystkich nagranych treści tylko wideo.

Należy zapewnić alternatywę dla mediów opartych na czasie, która prezentuje równoważne informacje dla treści tylko audio na żywo.

Twórz treści, które mogą być prezentowane na różne sposoby (na przykład w prostszym układzie) bez utraty informacji lub struktury. Ta wytyczna koncentruje się na tym, aby informacje i relacje zawarte w treści były dostępne nie tylko wizualnie, ale także programowo, co umożliwia technologiom wspomagającym interpretację i prezentację treści w dogodny dla użytkownika sposób.

Kryteria sukcesu powiązane z tą wytyczną to:

Informacje, struktura i relacje przekazywane poprzez prezentację mogą być określane programowo lub są dostępne w tekście. Oznacza to m.in. poprawne używanie znaczników HTML do oznaczania nagłówków, list, tabel itp.

Gdy kolejność, w jakiej prezentowana jest treść, ma wpływ na jej znaczenie, programowo można określić prawidłową kolejność odczytu. Jest to ważne dla czytników ekranu, które odczytują treść w określonej kolejności.

Instrukcje dotyczące rozumienia i obsługi treści nie mogą opierać się wyłącznie na charakterystykach sensorycznych komponentów, takich jak kształt, kolor, rozmiar, położenie wizualne, orientacja lub dźwięk. Nie należy np. instruować „kliknij niebieski kwadrat”, ponieważ osoby niedowidzące mogą nie być w stanie rozróżnić koloru.

Treść nie ogranicza swojego widoku i działania do jednej orientacji wyświetlania, takiej jak pionowa lub pozioma, chyba że określona orientacja jest niezbędna. Wyjątki mogą obejmować np. aplikacje do gry na pianinie.

Każde pole formularza, które zbiera dane o użytkowniku, powinno mieć jasno określony cel, jeśli dotyczy standardowych informacji (np. imię, e-mail, adres). Jeśli strona internetowa korzysta z technologii umożliwiających identyfikację tych danych, użytkownicy mogą łatwiej wypełniać formularze dzięki funkcji autouzupełniania.

W stronach internetowych tworzonych za pomocą kodu (np. HTML) można określić, do czego służą przyciski, ikony i sekcje strony, tak aby programy wspierające, np. czytniki ekranu, mogły je poprawnie rozpoznawać i pomagać użytkownikom w nawigacji.

Ułatw użytkownikom widzenie i słyszenie treści, w tym oddzielenie pierwszego planu od tła. Ta wytyczna dotyczy aspektów wizualnych i dźwiękowych treści, które mogą utrudniać ich percepcję niektórym użytkownikom.

Kryteria sukcesu powiązane z tą wytyczną to:

Kolor nie może być jedynym wizualnym środkiem przekazywania informacji, wskazywania akcji, sugerowania odpowiedzi lub rozróżniania elementu wizualnego. Należy zawsze zapewnić dodatkowe sposoby przekazywania tych informacji, np. tekst, kształt czy wzór.

Jeśli jakikolwiek dźwięk na stronie internetowej odtwarza się automatycznie przez ponad 3 sekundy, musi być dostępny mechanizm do zatrzymania lub wstrzymania dźwięku, albo mechanizm do niezależnej kontroli głośności.

Wizualna prezentacja tekstu i obrazów tekstu musi mieć współczynnik kontrastu co najmniej 4.5:1, z pewnymi wyjątkami dla dużego tekstu (co najmniej 3:1), tekstu incydentalnego i logotypów.

Z wyjątkiem napisów i obrazów tekstu, tekst można powiększyć bez technologii wspomagających do 200 procent bez utraty treści lub funkcjonalności.

Jeśli używane technologie pozwalają na wizualną prezentację, do przekazywania informacji należy używać tekstu zamiast obrazów tekstu, z wyjątkiem sytuacji, gdy dostosowanie wizualne obrazu tekstu do wymagań użytkownika jest możliwe lub gdy określona prezentacja tekstu jest niezbędna do przekazania informacji (np. logotypy).

Wizualna prezentacja tekstu i obrazów tekstu musi mieć współczynnik kontrastu co najmniej 7:1, z pewnymi wyjątkami dla dużego tekstu (co najmniej 4.5:1), tekstu incydentalnego i logotypów. Jest to wyższy standard kontrastu.

Dla nagranych treści tylko audio, które zawierają głównie mowę na pierwszym planie, a nie są audio CAPTCHA ani logo audio, i nie są wokalizacją o charakterze muzycznym, musi być spełniony co najmniej jeden z warunków: brak dźwięków w tle, możliwość wyłączenia dźwięków w tle lub dźwięki w tle co najmniej o 20 decybeli cichsze od mowy na pierwszym planie.

Dla bloków tekstu musi być dostępny mechanizm umożliwiający użytkownikowi dostosowanie kolorów pierwszego planu i tła, ustawienie szerokości linii na maksymalnie 80 znaków (40 dla CJK – oznacza języki używające znaków chińskich lub ich pochodnych), wyłączenie justowania tekstu oraz ustawienie odpowiedniego odstępu między liniami i akapitami. Treść musi również umożliwiać powiększenie tekstu do 200% bez konieczności przewijania w poziomie.

Obrazy tekstu mogą być używane tylko do czystej dekoracji lub gdy określona prezentacja tekstu jest niezbędna do przekazania informacji (np. logotypy).

Treść może być prezentowana bez utraty informacji lub funkcjonalności i bez konieczności przewijania w dwóch wymiarach przy szerokości 320 pikseli CSS dla treści przewijanej w pionie i wysokości 256 pikseli CSS dla treści przewijanej w poziomie, z wyjątkiem części treści wymagających układu dwuwymiarowego ze względu na użycie lub znaczenie (np. mapy, tabele danych).

Wizualna prezentacja elementów interfejsu użytkownika (wymaganych do ich identyfikacji i stanu) oraz części grafiki niezbędnych do zrozumienia treści musi mieć współczynnik kontrastu co najmniej 3:1 w stosunku do sąsiednich kolorów, z pewnymi wyjątkami.

W treści zaimplementowanej przy użyciu języków znaczników obsługujących właściwości stylu tekstu, żadna utrata treści lub funkcjonalności nie występuje po ustawieniu minimalnych wartości odstępów między liniami, akapitami, literami i słowami, bez zmiany innych właściwości stylu.

Jeśli najechaniu kursorem lub uzyskaniu fokusu klawiatury towarzyszy pojawienie się i zniknięcie dodatkowej treści, muszą być spełnione określone warunki dotyczące możliwości zamknięcia, utrzymania widoczności i braku zasłaniania innej treści. Wyjątek stanowią wbudowane podpowiedzi przeglądarki (tzw. tooltipy), które działają automatycznie.

Zasada postrzegalności to podstawa dostępności stron internetowych. Oznacza, że treści muszą być przedstawione w sposób, który każdy użytkownik może zobaczyć, usłyszeć lub odczytać za pomocą technologii wspierających.

Aby strona była dostępna dla wszystkich, warto pamiętać o kilku kluczowych zasadach:

• Alternatywne opisy dla obrazów – pomagają osobom niewidomym korzystającym z czytników ekranu.
• Napisy do filmów i audiodeskrypcja – ułatwiają odbiór treści osobom niesłyszącym i niewidomym.
• Możliwość dostosowania wyglądu strony – np. powiększanie tekstu czy zmiana kolorów dla lepszej czytelności.
• Dobry kontrast tekstu i tła – pomaga osobom z wadami wzroku czy dysleksją.

Dostępność to nie tylko wymogi techniczne, ale przede wszystkim sposób na zapewnienie równego dostępu do informacji i usług dla wszystkich.

Za tydzień opowiem o kolejnej zasadzie – Funkcjonalności!