WCAG i dostępność cyfrowa - wymogi dla stron internetowych

Wyobraź sobie, że próbujesz kupić bilet na stronie, na której nie działa myszka. Masz tylko klawiaturę, a przycisk "Kup teraz" nie daje się zaznaczyć tabulatorem. Albo że czytnik ekranu odczytuje Ci formularz zamówienia jako "pole edycji, pole edycji, pole edycji", bo nikt nie podpisał tych pól. Dla części użytkowników to nie jest ćwiczenie wyobraźni, tylko codzienność.

WCAG to zestaw wytycznych, które opisują, jak zbudować stronę, żeby dała się obsłużyć także w takich warunkach. Od kilku lat przestały być dobrą praktyką dla chętnych, a stały się obowiązkiem: najpierw dla instytucji publicznych, a od czerwca 2025 roku także dla wielu firm prywatnych, między innymi sklepów internetowych, banków i przewoźników.

W tym tekście tłumaczymy, czym jest WCAG i jak zbudowany jest ten standard, kogo dokładnie obowiązuje w Polsce, co trzeba zrobić na stronie w praktyce, jak sprawdzić stan swojego serwisu i ile to kosztuje. Zaznaczamy od razu: nie jesteśmy kancelarią prawną, więc przy ocenie konkretnych obowiązków Twojej firmy warto skonsultować się z prawnikiem specjalizującym się w tej dziedzinie.

Czym jest WCAG

WCAG to skrót od Web Content Accessibility Guidelines, czyli wytycznych dotyczących dostępności treści internetowych. Opracowuje je konsorcjum W3C, ta sama organizacja, która odpowiada za standardy HTML i CSS. Dokument nie jest ustawą ani normą techniczną w sensie prawnym, tylko zbiorem zaleceń, do którego przepisy w wielu krajach się odwołują.

Celem jest sprawienie, żeby treści w internecie były dostępne dla jak najszerszego grona odbiorców, w tym dla osób z niepełnosprawnością wzroku, słuchu, ruchu i z trudnościami poznawczymi. Warto od razu poszerzyć tę perspektywę: z dostępności korzysta też osoba starsza z gorszym wzrokiem, ktoś ze złamaną ręką, użytkownik oglądający film w komunikacji miejskiej bez słuchawek i każdy, kto próbuje kliknąć mały przycisk w tramwaju.

Stąd bierze się częste nieporozumienie. Dostępność bywa traktowana jako coś dla wąskiej grupy, tymczasem większość rozwiązań poprawia komfort korzystania dla wszystkich. Większy kontrast, czytelne etykiety pól, przewidywalna nawigacja i napisy w filmach to elementy, na których zyskuje każdy odwiedzający. To po prostu kolejna warstwa tego, co opisujemy w tekście o projektowaniu doświadczeń użytkownika.

Warto też rozróżnić dwa pojęcia, które bywają mylone. Dostępność cyfrowa dotyczy tego, czy da się z serwisu skorzystać przy określonych ograniczeniach. Użyteczność mówi o tym, czy korzystanie jest wygodne i efektywne dla przeciętnego użytkownika. Obszary te mocno się przenikają, ale wymagania dostępności są mierzalne i skodyfikowane, a użyteczność ocenia się badaniami.

Wersje standardu: 2.0, 2.1, 2.2

Pierwsza szeroko stosowana wersja, WCAG 2.0, powstała w 2008 roku i przez lata była podstawą przepisów w wielu krajach. WCAG 2.1 z 2018 roku dołożyła kryteria dotyczące urządzeń mobilnych, orientacji ekranu, obsługi dotykiem i osób słabowidzących. To ta wersja jest dziś najczęściej przywoływana w polskich i unijnych przepisach.

WCAG 2.2, opublikowana w 2023 roku, dokłada kilka kryteriów, między innymi dotyczących widoczności zaznaczenia, rozmiaru elementów klikalnych i ułatwień przy logowaniu. Jest rozszerzeniem, a nie zerwaniem z poprzednią wersją: strona zgodna z 2.2 spełnia też wymagania 2.1. Prace nad WCAG 3.0 trwają, ale to standard na przyszłość, o zupełnie innej konstrukcji.

Praktyczny wniosek: jeśli budujesz stronę dzisiaj, celuj w WCAG 2.2 na poziomie AA. Spełnisz w ten sposób wymagania przepisów odwołujących się do wersji 2.1, a przy okazji zabezpieczysz się na wypadek aktualizacji regulacji, które prędzej czy później przejdą na nowszą wersję.

Cztery zasady: POUR

Cała konstrukcja standardu opiera się na czterech zasadach, których pierwsze litery w angielskich nazwach tworzą skrót POUR. Po polsku mówimy o postrzegalności, funkcjonalności, zrozumiałości i solidności. Każda z nich rozwija się w wytyczne, a te w konkretne kryteria sukcesu, które da się sprawdzić.

Postrzegalność oznacza, że użytkownik musi być w stanie odebrać informację przynajmniej jednym zmysłem. Stąd biorą się teksty alternatywne dla obrazów, napisy do filmów, odpowiedni kontrast i możliwość powiększenia tekstu bez utraty treści. Funkcjonalność mówi, że interfejs musi dać się obsłużyć: klawiaturą, bez pułapek, z wystarczającym czasem na wykonanie zadania.

Zrozumiałość dotyczy treści i zachowania strony. Język ma być możliwie prosty, nawigacja przewidywalna, a komunikaty o błędach konkretne i pomocne. Solidność oznacza poprawny technicznie kod, który zadziała z różnymi przeglądarkami i technologiami wspomagającymi, w tym z czytnikami ekranu.

Poziomy zgodności: A, AA, AAA

Kryteria podzielone są na trzy poziomy. Poziom A to absolutne minimum, bez którego części użytkowników w ogóle nie da się obsłużyć serwisu. Poziom AA to standard praktyczny, do którego odwołują się przepisy. Poziom AAA to wymagania najwyższe, często niemożliwe do spełnienia w całym serwisie i sam standard tego nie zaleca jako celu ogólnego.

Różnicę dobrze widać na przykładzie kontrastu. Poziom AA wymaga stosunku 4,5 do 1 dla zwykłego tekstu i 3 do 1 dla dużego. Poziom AAA podnosi te wartości do 7 do 1 i 4,5 do 1, co drastycznie ogranicza dostępną paletę kolorystyczną i w wielu projektach oznaczałoby rezygnację z identyfikacji marki.

Dlatego celem operacyjnym jest zwykle poziom AA w całym serwisie, z wybranymi elementami na poziomie AAA tam, gdzie da się to osiągnąć bez szkody dla projektu. Taki zapis warto umieścić w wymaganiach dla wykonawcy strony, obok pozostałych ustaleń opisanych w tekście o procesie tworzenia strony internetowej.

Kogo obowiązuje dostępność cyfrowa

W Polsce funkcjonują dziś dwie równoległe ścieżki obowiązków: starsza, dotycząca sektora publicznego, i nowsza, obejmująca część firm prywatnych. Warto je rozdzielić, bo dotyczą innych podmiotów i mają inne konsekwencje.

Podmioty publiczne

Ustawa z 2019 roku o dostępności cyfrowej stron internetowych i aplikacji mobilnych podmiotów publicznych nakłada obowiązek na urzędy, szkoły, uczelnie, szpitale, jednostki samorządu i inne podmioty realizujące zadania publiczne. Wymagany poziom to zestaw kryteriów odpowiadający WCAG 2.1 na poziomie AA, opisany w załączniku do ustawy.

Do tego dochodzą obowiązki formalne. Każdy taki podmiot musi publikować deklarację dostępności: dokument opisujący stan zgodności serwisu, wskazujący elementy niedostępne wraz z uzasadnieniem, podający dane kontaktowe osoby odpowiedzialnej i informujący o procedurze zgłaszania problemów oraz skargi.

Użytkownik, który napotka barierę, może zażądać zapewnienia dostępności albo dostarczenia treści w alternatywnej formie. Podmiot ma na to określony czas, a w razie bezczynności sprawa może trafić do organu nadzorczego. To realny mechanizm egzekucji, nie tylko zapis w ustawie.

Firmy prywatne i Europejski Akt o Dostępności

Sytuacja biznesu zmieniła się 28 czerwca 2025 roku, gdy weszła w życie ustawa wdrażająca do polskiego prawa Europejski Akt o Dostępności. Objęła ona wybrane produkty i usługi: handel elektroniczny, usługi bankowe dla konsumentów, transport pasażerski, usługi telekomunikacyjne, dostęp do mediów audiowizualnych, książki elektroniczne oraz część urządzeń, takich jak terminale płatnicze czy bankomaty.

Dla właściciela sklepu internetowego oznacza to, że proces zakupowy, opisy produktów, formularze i płatności powinny być dostępne zgodnie z wymaganiami odwołującymi się do WCAG na poziomie AA. Podstawą technicznej oceny jest europejska norma zharmonizowana, która przenosi kryteria WCAG na język wymagań formalnych. Szerszy kontekst sprzedaży online porządkujemy w tekście o tym, czym jest e-commerce.

Obowiązki nie kończą się na samej stronie. Ustawa wymaga także informowania o dostępności produktu lub usługi, przechowywania dokumentacji potwierdzającej spełnienie wymagań oraz reagowania na zgłoszenia. Nadzór sprawują wyznaczone organy, które mogą prowadzić kontrole i nakładać kary, a konsument ma możliwość zgłoszenia braku zgodności.

Przepisy przewidują wyłączenia i okresy przejściowe. Z obowiązku dotyczącego usług zwolnione są mikroprzedsiębiorstwa, czyli firmy zatrudniające mniej niż dziesięć osób i o obrocie poniżej progu określonego w ustawie. Istnieje też możliwość powołania się na nieproporcjonalne obciążenie, ale wymaga to udokumentowanej oceny, a nie samego stwierdzenia, że zmiany są kosztowne.

Ponieważ zakres podmiotowy i wyłączenia bywają niejednoznaczne, ocena konkretnego przypadku to zadanie dla prawnika. Poniższa część tekstu koncentruje się na tym, co da się zrobić technicznie, niezależnie od tego, czy obowiązek dotyczy Cię wprost, czy traktujesz dostępność jako element jakości serwisu.

Co oznacza dostępność w praktyce

Standard liczy kilkadziesiąt kryteriów, ale w codziennej pracy nad stroną firmową powtarza się kilkanaście zagadnień, które odpowiadają za większość realnych barier. Poniżej najważniejsze z nich, uporządkowane tak, jak wychodzą podczas audytu.

Kontrast i kolory

Tekst musi odcinać się od tła na tyle, żeby dało się go przeczytać przy słabszym wzroku i w gorszych warunkach oświetleniowych. Minimalny stosunek dla zwykłego tekstu to 4,5 do 1, dla tekstu dużego, czyli od osiemnastu punktów albo czternastu pogrubionych, wystarczy 3 do 1. Ten sam próg 3 do 1 dotyczy elementów interfejsu: obramowań pól formularza, ikon niosących znaczenie, granic przycisków.

Najczęstsze potknięcia to jasnoszary tekst pomocniczy pod polami formularza, biały napis na jasnym zdjęciu w sekcji nagłówkowej oraz przyciski w firmowym kolorze, który świetnie wygląda w logo i katastrofalnie na białym tle. Rozwiązaniem nie jest rezygnacja z kolorów marki, tylko przygotowanie ich odcieni roboczych o odpowiednim kontraście.

Druga zasada dotyczy samego użycia koloru: informacja nie może być przekazywana wyłącznie barwą. Czerwona ramka wokół błędnie wypełnionego pola to za mało, potrzebny jest jeszcze komunikat tekstowy. Zielona kropka przy statusie zamówienia wymaga podpisu. Osoba nierozróżniająca barw zobaczy dwa identyczne odcienie szarości.

Obsługa klawiaturą

Wszystko, co da się kliknąć myszką, musi dać się obsłużyć klawiaturą. To kryterium brzmi banalnie, a wywraca dużą część nowoczesnych interfejsów: rozwijane menu otwierane najechaniem, karuzele obsługiwane przeciąganiem, okna modalne bez możliwości zamknięcia klawiszem ucieczki, własne komponenty zbudowane z elementów, które przeglądarka traktuje jak zwykły tekst.

Kluczowe są trzy rzeczy. Kolejność przechodzenia tabulatorem musi być logiczna i zgodna z układem wizualnym. Aktualnie zaznaczony element musi być wyraźnie widoczny, więc usuwanie domyślnej obwódki zaznaczenia bez zastąpienia jej własną jest błędem. Nie może istnieć pułapka klawiaturowa, czyli miejsce, z którego nie da się wyjść bez myszki.

Przydaje się także link pozwalający pominąć nawigację i przejść wprost do treści. Osoba korzystająca z klawiatury inaczej musi przy każdej podstronie przeklikać kilkadziesiąt pozycji menu, zanim dotrze do artykułu. Jeden ukryty link na początku dokumentu rozwiązuje ten problem.

Struktura treści i nagłówki

Czytniki ekranu pozwalają nawigować po nagłówkach, więc ich poprawna hierarchia zamienia stronę w spis treści, po którym da się skakać. Jeden nagłówek najwyższego poziomu, potem logicznie zagnieżdżone poziomy niższe, bez przeskoków i bez używania nagłówków wyłącznie po to, żeby powiększyć tekst. Zasady te opisujemy szczegółowo w tekście o nagłówkach H1-H6.

Podobnie z listami, tabelami i punktami orientacyjnymi strony. Lista zbudowana z akapitów zaczynających się myślnikiem wygląda jak lista, ale czytnik jej nie ogłosi. Tabela bez nagłówków kolumn zamienia się w ciąg oderwanych wartości. Nagłówek, stopka, nawigacja i główna treść powinny być oznaczone właściwymi elementami, bo dzięki temu użytkownik może przeskoczyć wprost do interesującej go części.

Trzeci element to język dokumentu. Deklaracja języka pozwala czytnikowi dobrać właściwą wymowę, a jej brak sprawia, że polski tekst bywa odczytywany z angielską fonetyką. To jedna linijka w kodzie i jedna z najczęściej pomijanych.

Obrazy i teksty alternatywne

Każdy obraz niosący treść potrzebuje opisu tekstowego, który przekazuje tę samą informację. Zdjęcie produktu opisujemy tak, jak opisalibyśmy je przez telefon. Wykres wymaga podsumowania wniosku, a nie nazwy pliku. Ikona przy przycisku zwykle nie potrzebuje opisu, jeśli obok stoi tekst.

Obrazy czysto dekoracyjne powinny mieć pusty opis, żeby czytnik je pominął. Nadgorliwość szkodzi tu tak samo jak zaniedbanie: strona, na której każdy element tła jest opisywany, staje się nie do przesłuchania. Zasada jest prosta: gdyby obraz zniknął, czy użytkownik straciłby informację? Jeśli tak, potrzebny jest opis.

Osobny przypadek to tekst zapisany w obrazku, na przykład hasło reklamowe na banerze. Czytnik go nie odczyta, wyszukiwarka nie zindeksuje, a przy powiększeniu rozmyje się. Lepszym rozwiązaniem jest tekst na warstwie nad grafiką albo grafika wektorowa z tekstem dostępnym w kodzie.

Formularze

Formularz to miejsce, w którym niedostępność najszybciej zamienia się w utraconą sprzedaż. Każde pole musi mieć etykietę powiązaną z nim w kodzie, a nie tylko wizualnie umieszczoną obok. Etykieta ukryta w podpowiedzi wewnątrz pola znika po rozpoczęciu pisania, więc nie zastępuje właściwego oznaczenia.

Błędy trzeba komunikować tekstem, wskazywać pole, którego dotyczą, i podpowiadać, jak je poprawić. Komunikat "wystąpił błąd" na górze strony nie pomaga nikomu, ani osobie korzystającej z czytnika, ani zwykłemu użytkownikowi. Pola obowiązkowe powinny być oznaczone w sposób odczytywalny, a nie tylko gwiazdką w kolorze.

Warto też zadbać o automatyczne uzupełnianie: prawidłowo oznaczone pola adresu czy telefonu pozwalają przeglądarce podpowiedzieć dane, co skraca wypełnianie i zmniejsza liczbę pomyłek. Efekt widać w statystykach porzuceń, o czym piszemy przy okazji optymalizacji konwersji.

Filmy, dźwięk i animacje

Materiały wideo z warstwą mówioną wymagają napisów. Nagrania samego dźwięku, na przykład podcastu, potrzebują transkrypcji. Filmy, w których istotna informacja przekazywana jest wyłącznie obrazem, powinny mieć audiodeskrypcję, choć to wymóg pojawiający się głównie w wyższych poziomach zgodności i w sektorze publicznym.

Dźwięk nie może włączać się automatycznie, a jeśli już się włącza i trwa dłużej niż kilka sekund, musi być możliwość jego zatrzymania. Podobnie z animacjami: karuzela przesuwająca się sama musi mieć przycisk pauzy, a wszystko, co miga częściej niż trzy razy na sekundę, jest po prostu zakazane ze względu na ryzyko napadów u osób z padaczką światłoczułą.

Warto też respektować systemowe ustawienie ograniczenia animacji. Użytkownik, który włączył je na swoim urządzeniu, sygnalizuje, że efekty przewijania i przejść sprawiają mu problem, a nowoczesne style pozwalają wykryć tę preferencję i wyłączyć ozdobniki.

Powiększanie i układ strony

Użytkownik musi móc powiększyć tekst do dwustu procent bez utraty treści i funkcji. W praktyce oznacza to układ, który się przelewa zamiast rozjeżdżać, brak stałych wysokości kontenerów odcinających tekst oraz brak poziomego przewijania. Strona zbudowana zgodnie z zasadami opisanymi w tekście o responsywności zwykle spełnia to kryterium niejako przy okazji.

Osobne kryterium dotyczy odstępów: gdy użytkownik wymusi większe odstępy między wierszami, literami i akapitami, treść nadal musi być czytelna. To test, który wykłada projekty z tekstem wtłoczonym w ciasne ramki o sztywnej wysokości.

Trzecia sprawa to orientacja ekranu. Nie wolno wymuszać trybu poziomego ani pionowego, chyba że jest to niezbędne dla działania funkcji. Osoba z telefonem zamocowanym na wózku nie ma jak go obrócić.

Jak sprawdzić dostępność swojej strony

Weryfikacja składa się z trzech warstw i żadna nie zastępuje pozostałych. Narzędzia automatyczne wychwytują część problemów szybko i tanio. Testy ręczne wyłapują to, czego maszyna nie oceni. Testy z udziałem użytkowników pokazują realne bariery, których nie widać w żadnym raporcie.

Narzędzia automatyczne

Najpopularniejsze to rozszerzenia przeglądarkowe pokazujące błędy bezpośrednio na stronie, silniki testujące wbudowane w narzędzia deweloperskie oraz audyt dostępności dostępny w narzędziu do badania wydajności stron Google. Do tego dochodzą samodzielne aplikacje skanujące cały serwis i raportujące zbiorczo.

Ich zaletą jest szybkość: w kilka minut dostajesz listę brakujących opisów obrazów, zbyt niskich kontrastów, pól bez etykiet i błędów w strukturze nagłówków. Wadą jest zasięg. Przyjmuje się, że automat wykrywa jedynie część kryteriów, orientacyjnie od jednej czwartej do jednej trzeciej, bo reszta wymaga oceny sensu, a nie samej składni.

Automat sprawdzi, czy obraz ma opis, ale nie oceni, czy opis jest trafny. Zobaczy, że pole ma etykietę, ale nie stwierdzi, czy etykieta jest zrozumiała. Dlatego zielony wynik w skanerze nie oznacza zgodności, tylko brak błędów najprostszej kategorii.

Testy ręczne

Podstawowy zestaw da się wykonać samodzielnie w kilkanaście minut. Odłóż myszkę i przejdź całą ścieżkę zakupową samym tabulatorem, sprawdzając, czy widzisz, gdzie jesteś, i czy dotrzesz do każdego przycisku. Powiększ stronę do dwustu procent i zobacz, czy nic nie znika. Wyłącz obrazy i sprawdź, czy strona nadal ma sens.

Kolejny krok to test z czytnikiem ekranu. Na Windowsie dostępny jest bezpłatny czytnik open source, w systemach Apple wbudowane narzędzie systemowe. Pierwsze minuty bywają dezorientujące, ale już po kwadransie słychać, które elementy strony są opisane, a które ogłaszane jako "link, link, przycisk".

Warto też przejrzeć stronę w trybie wysokiego kontrastu i sprawdzić ją na telefonie z włączonym powiększeniem systemowym. Te dwa scenariusze wyłapują błędy, których nie widać na komputerze projektanta z dużym monitorem.

Audyt profesjonalny i testy z użytkownikami

Pełny audyt wykonuje specjalista, który przechodzi przez wszystkie kryteria na wybranym poziomie zgodności i opisuje każde odstępstwo wraz z rekomendacją naprawy. Efektem jest raport, który da się przekazać wykonawcy strony jako listę zadań, a nie ogólne "poprawcie dostępność".

Najwięcej wnoszą jednak testy z udziałem osób faktycznie korzystających z technologii wspomagających. Pokazują rzeczy, których nie widać w żadnej liście kontrolnej: że opis obrazu jest formalnie poprawny, ale bezużyteczny, że kolejność treści jest logiczna wizualnie i nielogiczna po odsłuchaniu, że proces zakupowy da się przejść, ale zajmuje dziesięć minut zamiast jednej.

Dla podmiotów publicznych efektem audytu jest też treść deklaracji dostępności. Dokument ten wymaga rzetelnego wskazania elementów niedostępnych, więc jego przygotowanie bez wcześniejszego badania sprowadza się do zgadywania.

Warto połączyć badanie dostępności z innymi przeglądami technicznymi serwisu. Znaczna część ustaleń pokrywa się z tym, co i tak sprawdza się podczas audytu SEO: struktura nagłówków, opisy obrazów, poprawność kodu, czytelność treści. Jedno zlecenie zamiast dwóch oszczędza czas i pieniądze.

Dlaczego nakładki nie rozwiązują problemu

Na rynku funkcjonują widżety obiecujące zgodność z WCAG po wklejeniu jednej linijki kodu. Zwykle dodają pływającą ikonę z panelem: powiększ tekst, zwiększ kontrast, podkreśl linki, włącz tryb dla dysleksji. Wyglądają jak rozwiązanie i kosztują ułamek tego, co realna praca nad serwisem.

Problem polega na tym, że taka nakładka nie zmienia kodu strony. Nie doda sensownego opisu do obrazu, nie naprawi kolejności tabulatora, nie podpisze pól formularza, nie zbuduje poprawnej struktury nagłówków. Może natomiast wejść w konflikt z ustawieniami czytnika ekranu, który użytkownik ma już skonfigurowany po swojemu, i pogorszyć sytuację.

Środowisko osób z niepełnosprawnościami wypowiada się o takich narzędziach krytycznie, a w kilku krajach pojawiły się już postępowania i pozwy dotyczące stron, które mimo zainstalowanej nakładki pozostawały niedostępne. Wniosek praktyczny: widżet może być dodatkiem ułatwiającym drobne regulacje, ale nigdy substytutem poprawek w samym serwisie.

Dostępność a pozycjonowanie

Dużą część wymagań WCAG spełnia się tymi samymi działaniami, które zaleca się w optymalizacji pod wyszukiwarki. Poprawna hierarchia nagłówków porządkuje treść dla czytnika ekranu i dla robota indeksującego. Opisy alternatywne obrazów pomagają obu. Semantyczny, uporządkowany kod ułatwia analizę treści jednym i drugim.

Podobnie z transkrypcjami filmów: dają tekst, który wyszukiwarka może zindeksować, i jednocześnie udostępniają materiał osobom niesłyszącym. Czytelny język, krótkie akapity i logiczna nawigacja poprawiają zrozumiałość i zmniejszają liczbę powrotów do wyników wyszukiwania. Zależności te opisujemy szerzej w tekście o SXO, czyli połączeniu SEO i UX.

Nie oznacza to, że dostępność jest czynnikiem rankingowym w prostym sensie. Oznacza natomiast, że praca nad nią rzadko bywa zmarnowana: poprawia wyniki wyszukiwania pośrednio, przez jakość kodu i treści, a przy okazji zwiększa liczbę osób, które mogą z serwisu skorzystać.

Jak wdrożyć dostępność w firmie

Najtaniej wychodzi uwzględnienie wymagań na etapie projektu. Zmiana palety kolorów w makiecie kosztuje kilka godzin, zmiana jej w gotowym serwisie oznacza przejrzenie wszystkich podstron, komponentów i materiałów marketingowych. Ta sama zasada dotyczy struktury nawigacji i sposobu budowania formularzy.

Przy nowym projekcie

Wpisz poziom zgodności do wymagań, najlepiej jako WCAG 2.2 AA, i zaznacz, że odbiór obejmuje weryfikację dostępności. Poproś, żeby projekt graficzny zawierał sprawdzone kontrasty i stany zaznaczenia dla wszystkich elementów interaktywnych, a nie tylko wygląd domyślny.

Ustal, czy wykonawca ma doświadczenie w tym obszarze, i poproś o przykład wcześniejszej realizacji. Zapytaj wprost, jak testuje dostępność: sama odpowiedź "używamy narzędzia automatycznego" jest sygnałem, że warto dopytać o resztę procesu.

Zaplanuj też szkolenie dla osób, które będą dodawać treści. Najlepiej zbudowany serwis traci dostępność po kilku miesiącach, jeśli redakcja wkleja obrazy bez opisów, buduje nagłówki pogrubieniem i wstawia linki z tekstem "kliknij tutaj". To najtańsza inwestycja w całym procesie.

Przy istniejącym serwisie

Zacznij od inwentaryzacji: przeskanuj serwis narzędziem automatycznym, przejdź ręcznie najważniejsze ścieżki i spisz problemy. Potem uporządkuj listę według dwóch kryteriów: jak bardzo dana bariera blokuje korzystanie i ile kosztuje jej usunięcie.

Najpierw naprawiaj rzeczy blokujące i tanie: opisy obrazów, etykiety pól, widoczność zaznaczenia, kontrast tekstu, deklaracja języka, link pomijający nawigację. Potem elementy blokujące i kosztowne: przebudowa komponentów obsługiwanych wyłącznie myszką, poprawa struktury nagłówków w całym serwisie, napisy do materiałów wideo.

Na koniec zostaw drobiazgi kosmetyczne. Taki porządek sprawia, że po pierwszym tygodniu prac serwis jest już realnie użyteczny dla większości osób, nawet jeśli formalna zgodność wymaga jeszcze kilku tygodni. Przy serwisach na popularnych systemach wiele poprawek dotyczy szablonu, o czym wspominamy w tekście o WordPressie.

Utrzymanie dostępności

Dostępność nie jest stanem, tylko procesem. Każdy nowy wpis, produkt czy kampania może wprowadzić nową barierę. Dlatego warto wpisać podstawowe sprawdzenie do listy zadań przy publikacji: czy obrazy mają opisy, czy nagłówki są prawidłowe, czy linki mają sensowne nazwy, czy film ma napisy.

Raz na kwartał opłaca się przejść ścieżkę kluczową, na przykład zakup albo wysłanie formularza kontaktowego, samą klawiaturą. To piętnaście minut, które wychwytuje regresje po aktualizacjach wtyczek i zmianach w szablonie.

Raz w roku warto powtórzyć pełniejsze badanie, zwłaszcza jeśli serwis mocno się rozwinął. Dla podmiotów publicznych ten rytm wyznacza zresztą obowiązek aktualizacji deklaracji dostępności.

Pomaga też ustawienie kilku zabezpieczeń w samym systemie zarządzania treścią: wymuszenie pola opisu przy wgrywaniu obrazu, ograniczenie dostępnych poziomów nagłówków w edytorze, gotowe komponenty zamiast dowolnego formatowania. Możliwości zależą od platformy, a przegląd rozwiązań znajdziesz w tekście o systemach zarządzania treścią.

Ile kosztuje dostępność

Przy nowym projekcie koszt dodatkowy jest niewielki, bo sprowadza się głównie do świadomych decyzji projektowych i nieco dłuższych testów. Zwykle mieści się w kilku procentach budżetu wdrożenia i w dużej mierze pokrywa się z pracą, którą i tak trzeba wykonać, żeby serwis działał poprawnie.

Przy dostosowaniu istniejącego serwisu widełki są szerokie i zależą od jego wielkości oraz stanu wyjściowego. Prosta strona wizytówkowa z kilkoma podstronami to zwykle kilka dni pracy. Rozbudowany sklep z setkami produktów, filtrami i konfiguratorem może wymagać przebudowy komponentów, więc rachunek rośnie proporcjonalnie do złożoności.

Po drugiej stronie stoją korzyści, które łatwo pominąć. Grupa osób z jakąś formą ograniczenia sprawności to znacząca część populacji, a doliczając osoby starsze i sytuacyjne ograniczenia, mówimy o dużym fragmencie rynku. Do tego dochodzą lepsze wyniki w wyszukiwarce, mniejsza liczba zgłoszeń do obsługi klienta i brak ryzyka postępowania w razie kontroli.

Jest też argument, który rzadko pada w rozmowach o budżecie: dostępność wymusza porządek. Serwis, w którym każde pole ma etykietę, każdy obraz opis, a nawigacja przewidywalną strukturę, jest po prostu lepiej zrobiony. Łatwiej się go utrzymuje, szybciej wdraża się w nim zmiany i rzadziej pojawiają się w nim błędy, których nikt nie potrafi odtworzyć.

Najczęstsze błędy przy wdrażaniu WCAG

Błąd pierwszy to traktowanie dostępności jako zadania dla programisty. Duża część barier powstaje wcześniej: w projekcie graficznym, w doborze kolorów, w decyzji o karuzeli na stronie głównej. Programista może to naprawić, ale drożej i gorzej niż projektant, który uwzględnił wymagania od razu.

Błąd drugi to zaufanie wyłącznie narzędziom automatycznym i uznanie zielonego wyniku za koniec pracy. Błąd trzeci to instalacja nakładki zamiast poprawek. Błąd czwarty to jednorazowa akcja bez procesu, po której serwis wraca do stanu wyjściowego w ciągu kilku miesięcy.

Błąd piąty jest treściowy: opisy alternatywne wypełniane słowami kluczowymi zamiast realnym opisem, linki nazwane "czytaj więcej" bez kontekstu, nagłówki użyte do formatowania. Błąd szósty to pomijanie dokumentów: strona bywa dostępna, a najważniejszy formularz do pobrania jest skanem, którego nie da się odczytać.

Szybka lista kontrolna

Do samodzielnego sprawdzenia w kilkanaście minut: przejdź stronę tabulatorem i sprawdź widoczność zaznaczenia, powiększ do dwustu procent, wyłącz obrazy, sprawdź kontrast najważniejszych tekstów i przycisków, przejrzyj strukturę nagłówków, sprawdź etykiety pól w formularzu kontaktowym.

Do zlecenia wykonawcy: deklaracja języka dokumentu, link pomijający nawigację, poprawne oznaczenie obszarów strony, obsługa klawiaturą wszystkich komponentów, komunikaty błędów powiązane z polami, pauza dla animacji i karuzel, napisy do materiałów wideo.

Do wpisania w procedury: instrukcja dodawania treści dla redakcji, kwartalny test klawiaturą kluczowej ścieżki, roczny przegląd całości, a w przypadku podmiotów publicznych aktualna deklaracja dostępności z działającym kanałem zgłoszeń.

Najczęściej zadawane pytania

Co to jest WCAG?

WCAG to skrót od Web Content Accessibility Guidelines, czyli międzynarodowych wytycznych dotyczących dostępności treści internetowych, opracowywanych przez konsorcjum W3C. Opisują one, jak budować strony i aplikacje, żeby mogły z nich korzystać także osoby z niepełnosprawnościami: wzroku, słuchu, ruchu oraz z trudnościami poznawczymi. Same wytyczne nie są przepisem prawa, ale polskie i unijne regulacje odwołują się do nich jako do standardu odniesienia.

Jakie są cztery zasady WCAG?

Postrzegalność, funkcjonalność, zrozumiałość i solidność, w skrócie POUR od angielskich nazw. Postrzegalność oznacza, że informacja musi być odbieralna przynajmniej jednym zmysłem, stąd opisy obrazów, napisy do filmów i odpowiedni kontrast. Funkcjonalność to możliwość obsługi interfejsu, przede wszystkim klawiaturą. Zrozumiałość dotyczy prostego języka i przewidywalnego zachowania strony. Solidność oznacza poprawny kod współpracujący z technologiami wspomagającymi.

Jaki poziom zgodności trzeba osiągnąć?

Standardem wymaganym przez przepisy jest poziom AA. Poziom A to minimum, przy którym część użytkowników wciąż napotyka poważne bariery, a poziom AAA zawiera wymagania tak restrykcyjne, że sam standard nie zaleca stosowania go do całego serwisu. W praktyce cel brzmi: cały serwis na poziomie AA, wybrane elementy wyżej, jeśli da się to osiągnąć bez szkody dla projektu i identyfikacji marki.

Czy moja firma musi spełniać WCAG?

Podmioty publiczne mają ten obowiązek od 2019 roku na podstawie ustawy o dostępności cyfrowej. Firmy prywatne objęła ustawa wdrażająca Europejski Akt o Dostępności, obowiązująca od 28 czerwca 2025 roku, która dotyczy między innymi handlu elektronicznego, bankowości dla konsumentów, transportu pasażerskiego, telekomunikacji i książek elektronicznych. Przewidziano wyłączenia, w tym dla mikroprzedsiębiorstw świadczących usługi. Ocena konkretnego przypadku wymaga konsultacji z prawnikiem.

Która wersja WCAG obowiązuje?

Przepisy w Polsce odwołują się obecnie do zestawu wymagań odpowiadającego WCAG 2.1 na poziomie AA. Najnowszą opublikowaną wersją jest jednak WCAG 2.2 z 2023 roku, która dokłada kilka kryteriów i jest rozszerzeniem poprzedniej, a nie zerwaniem z nią. Przy nowych wdrożeniach warto celować w 2.2, bo spełnia się wtedy wymagania obowiązujących przepisów i zabezpiecza na wypadek ich aktualizacji.

Jak sprawdzić, czy strona spełnia WCAG?

Zacznij od narzędzia automatycznego, na przykład rozszerzenia przeglądarkowego albo audytu dostępności w narzędziu deweloperskim. Pamiętaj jednak, że automat wykrywa tylko część kryteriów, orientacyjnie od jednej czwartej do jednej trzeciej. Uzupełnij badanie testami ręcznymi: przejściem strony samą klawiaturą, powiększeniem do dwustu procent i odsłuchaniem serwisu czytnikiem ekranu. Pełną ocenę zgodności wykonuje audytor, a najwięcej wnoszą testy z udziałem realnych użytkowników technologii wspomagających.

Czy wystarczy zainstalować widżet dostępności?

Nie. Nakładki dodają panel z opcjami powiększania tekstu czy zwiększania kontrastu, ale nie zmieniają kodu strony, więc nie naprawią brakujących opisów obrazów, niepodpisanych pól formularza, złej kolejności tabulatora ani komponentów nieobsługiwanych klawiaturą. Bywa też, że wchodzą w konflikt z ustawieniami czytnika ekranu i utrudniają korzystanie. Widżet może być dodatkiem, ale nie zastępuje poprawek w samym serwisie.

Czym jest deklaracja dostępności?

To dokument publikowany przez podmioty publiczne, opisujący stan zgodności serwisu z wymaganiami dostępności cyfrowej. Zawiera informację o poziomie zgodności, wykaz elementów niedostępnych wraz z uzasadnieniem, dane kontaktowe osoby odpowiedzialnej oraz opis procedury zgłaszania problemów i składania skargi. Musi być aktualizowana, a jej rzetelne przygotowanie wymaga wcześniejszego przebadania serwisu, bo wskazanie elementów niedostępnych bez audytu sprowadza się do zgadywania.