Dostępność cyfrowa w NGO: WCAG 2.2 w praktyce i lista rzeczy do sprawdzenia

Dostępna strona internetowa to taka, z której mogą skorzystać wszyscy: osoby niewidome korzystające z czytników ekranu, osoby słabowidzące, osoby z niepełnosprawnością ruchową obsługujące komputer wyłącznie klawiaturą, osoby z trudnościami poznawczymi, a także seniorzy i każdy, kto akurat ma słaby internet albo złamaną rękę. Dla organizacji społecznych dostępność to nie tylko kwestia przepisów, ale przede wszystkim spójności z misją: trudno mówić o włączaniu, jeśli formularz zgłoszeniowy jest nie do wypełnienia dla części odbiorców.

Czym jest WCAG i co zmieniła wersja 2.2

WCAG (Web Content Accessibility Guidelines) to międzynarodowe wytyczne dostępności treści internetowych opracowane przez W3C. Opierają się na czterech zasadach: treść ma być postrzegalna, funkcjonalna, zrozumiała i solidna. Wymagania mają trzy poziomy, a w praktyce za standard uznaje się poziom AA.

Wersja WCAG 2.2, opublikowana w październiku 2023 roku, dodała nowe kryteria. Najważniejsze z nich dla typowej strony organizacji:

• widoczny fokus – element, na którym znajduje się kursor klawiatury, nie może być zasłonięty np. przez przyklejony nagłówek czy baner cookies,
• minimalny rozmiar celu – przyciski i linki muszą być na tyle duże (co najmniej 24 × 24 piksele lub mieć odpowiedni odstęp), by dało się w nie trafić,
• alternatywa dla przeciągania – jeśli coś działa przez przeciąganie, musi dać się to zrobić także kliknięciem,
• spójna pomoc – kontakt lub pomoc powinny być w tym samym miejscu na wszystkich podstronach,
• bez ponownego wpisywania – formularz nie powinien prosić drugi raz o dane, które użytkownik już podał,
• dostępne logowanie – logowanie nie może wymagać rozwiązywania zagadek czy przepisywania kodów z pamięci bez alternatywy.

Czy organizację obowiązują przepisy?

To zależy od rodzaju organizacji i źródeł finansowania. Część podmiotów jest objęta ustawą o dostępności cyfrowej stron internetowych podmiotów publicznych, a od 2025 roku obowiązują też przepisy wdrażające Europejski Akt o Dostępności dla wybranych produktów i usług. W praktyce coraz więcej grantodawców i programów finansowanych ze środków publicznych wymaga dostępności materiałów i stron powstających w projekcie. Jeśli nie masz pewności, jak jest w Waszym przypadku, sprawdź warunki umowy grantowej lub zapytaj prawnika. A niezależnie od przepisów: dostępna strona po prostu dociera do większej liczby ludzi.

Strona internetowa: co sprawdzić w pierwszej kolejności

1. Obsługa klawiaturą – przejdź całą stronę klawiszem Tab. Czy widzisz, gdzie jesteś? Czy da się otworzyć menu, wysłać formularz i zamknąć okienka?
2. Kontrast – tekst musi wyraźnie odcinać się od tła. Jasnoszary tekst na białym tle to najczęstszy problem.
3. Teksty alternatywne – każde zdjęcie niosące informację potrzebuje opisu (atrybut alt). Zdjęcia czysto dekoracyjne mogą mieć pusty opis.
4. Nagłówki – jeden nagłówek H1 na stronie i logiczna struktura H2, H3. Czytniki ekranu pozwalają po nich nawigować.
5. Linki – zamiast „kliknij tutaj” pisz, dokąd prowadzi link, np. „regulamin zbiórki”.
6. Formularze – każde pole ma widoczną etykietę, a komunikaty o błędach mówią, co poprawić.
7. Powiększenie – strona powinna działać po powiększeniu do 200% bez ucinania treści.
8. Multimedia – filmy z napisami, nagrania z transkrypcją.
9. Deklaracja dostępności – jeśli obowiązuje Was ustawa, opublikuj ją na stronie.

Dokumenty, newslettery i media społecznościowe

Dostępność nie kończy się na stronie:

• PDF-y – twórz je z dokumentów z poprawnymi nagłówkami, a nie ze skanów; skan to dla czytnika ekranu obrazek bez treści.
• Newsletter – czytelna czcionka, kontrast, opisy obrazków i treść, która nie znika, gdy obrazki się nie wczytają. Więcej w poradniku o newsletterze w NGO.
• Social media – opisy alternatywne zdjęć (większość serwisów ma na to pole), napisy w filmach, emoji z umiarem (czytnik odczytuje każde), hashtagi zapisane WielkimiLiterami.
• Język – proste zdania i wyjaśnione skróty pomagają wszystkim, a szczególnie osobom z trudnościami poznawczymi.

Narzędzia, które pomogą w sprawdzeniu

• WAVE i axe DevTools – rozszerzenia przeglądarki wskazujące typowe błędy,
• Lighthouse w przeglądarce Chrome – raport z dostępności i wydajności,
• sprawdzanie kontrastu (np. WebAIM Contrast Checker),
• czytnik ekranu – NVDA na Windows lub VoiceOver wbudowany w urządzenia Apple; nawet krótki test bardzo dużo uczy.

Automatyczne narzędzia wyłapują tylko część problemów. Najlepiej połączyć je z testem klawiaturą i, jeśli to możliwe, z opinią osób z niepełnosprawnościami.

Najczęstsze pytania

Czy wtyczka „dostępnościowa” z ikonką wystarczy?

Nie. Nakładki zmieniające kontrast czy rozmiar czcionki nie naprawiają błędów w kodzie strony i bywają krytykowane przez samych użytkowników technologii asystujących. Dostępność trzeba zapewnić w projekcie i treści.

Ile kosztuje dostosowanie strony do WCAG?

Zależy od stanu strony. Często największe problemy (kontrast, opisy zdjęć, etykiety formularzy, nagłówki) można poprawić w ramach zwykłej pracy redakcyjnej. Przy starych, rozbudowanych stronach czasem taniej jest zbudować nową, od początku dostępną.

Od czego zacząć, jeśli mamy mało czasu?

Od testu klawiaturą, kontrastu i opisów zdjęć na stronie głównej oraz w formularzu kontaktowym lub zgłoszeniowym. To miejsca, w których najczęściej tracicie ludzi.

Fundacja Inicjatywy Cyfrowe projektuje strony zgodne z WCAG dla organizacji pozarządowych. Zgłoście organizację, jeśli chcecie sprawdzić swoją stronę albo zbudować nową.