Grzegorz Kalmus
Autor
Dostępność stron internetowych to temat, który przez lata był traktowany jako „miły dodatek” – coś, o czym duże korporacje wiedziały, ale małe i średnie firmy rzadko brały pod uwagę. Rok 2026 zmienia tę sytuację radykalnie. Europejska ustawa o dostępności (European Accessibility Act) weszła w życie, nakładając konkretne obowiązki na właścicieli serwisów internetowych. W tym artykule wyjaśniamy wszystko, co powinieneś wiedzieć – bez technicznego żargonu.
Czym jest dostępność stron internetowych?
Dostępność stron internetowych (ang. web accessibility) oznacza projektowanie i tworzenie witryn w taki sposób, aby mogły z nich korzystać wszystkie osoby – niezależnie od swoich możliwości fizycznych, poznawczych czy technologicznych. Chodzi o to, żeby strona była użyteczna zarówno dla kogoś, kto widzi ekran i używa myszki, jak i dla osoby niewidomej, korzystającej z czytnika ekranu, osoby głuchej, użytkownika z drżeniem rąk, czy kogoś, kto po prostu ma słabe połączenie internetowe i używa starego telefonu.
Dostępność to nie kwestia wygody – to kwestia równego dostępu do informacji i usług. A w kontekście biznesowym – to kwestia dotarcia do znacznie szerszego grona klientów.
Standardy WCAG 2.2 – cztery filary dostępności
WCAG (Web Content Accessibility Guidelines) to międzynarodowy standard opracowany przez konsorcjum W3C, które tworzy standardy dla całego internetu. Aktualna wersja to WCAG 2.2, opublikowana w październiku 2023 roku. Cały standard opiera się na czterech zasadach, tworzących skrót POUR:
1. Postrzegalność (Perceivable)
Wszystkie treści muszą być dostępne dla zmysłów użytkownika. Jeśli ktoś nie może zobaczyć obrazka, musi mieć dostęp do jego tekstowego opisu. Jeśli nie słyszy, potrzebuje napisów do filmów. Kluczowe wymagania:
- Alternatywy tekstowe (alt text) – każdy obrazek niosący informację musi mieć opis tekstowy. Zdjęcie produktu bez opisu to problem dla osoby niewidomej.
- Napisy i transkrypcje – filmy i nagrania audio powinny mieć napisy (dla głuchych) oraz transkrypcje tekstowe.
- Kontrast kolorów – tekst musi mieć odpowiedni kontrast względem tła. WCAG 2.2 wymaga minimum 4.5:1 dla normalnego tekstu i 3:1 dla dużego tekstu.
- Elastyczność układu – treść musi być czytelna po powiększeniu do 200% bez utraty funkcjonalności.
2. Funkcjonalność (Operable)
Strona musi działać nie tylko za pomocą myszy. Wiele osób korzysta wyłącznie z klawiatury – osoby z drżeniem rąk, z ograniczoną sprawnością motoryczną, a także wielu doświadczonych użytkowników biznesowych. Kluczowe wymagania:
- Nawigacja klawiaturą – każda funkcja strony powinna być dostępna za pomocą klawisza Tab, Shift+Tab, Enter i strzałek.
- Wskaźnik focusu – widoczne podświetlenie aktualnie zaznaczonego elementu. Wiesz, ta niebieska ramka wokół przycisku? Nie wolno jej ukrywać.
- Wystarczający czas – jeśli strona ma sesje z limitem czasu, użytkownik musi mieć możliwość przedłużenia lub wyłączenia tego limitu.
- Brak migotania – treści migające częściej niż 3 razy na sekundę mogą wywoływać ataki epilepsji.
- Tytuły stron i nagłówki – każda podstrona powinna mieć unikalny, opisowy tytuł, a treść powinna być zorganizowana hierarchią nagłówków (H1, H2, H3…).
3. Zrozumiałość (Understandable)
Treść i interfejs muszą być zrozumiałe. Kluczowe wymagania:
- Język strony – w kodzie HTML musi być określony język strony (
lang="pl"), żeby czytniki ekranu wymawiały tekst poprawnie. - Czytelny język – tekst powinien być napisany możliwie prostym językiem.
- Etykiety formularzy – każde pole formularza musi mieć wyraźną etykietę (label). „Wpisz tutaj” bez opisu, co wpisać, to błąd dostępności.
- Komunikaty o błędach – gdy użytkownik popełni błąd w formularzu, komunikat musi być jasny i podpowiadać, jak go poprawić.
- Spójne nawigowanie – menu i inne elementy nawigacyjne powinny być spójne na wszystkich podstronach.
4. Solidność (Robust)
Strona musi działać z różnymi technologiami wspomagającymi – czytnikami ekranu, programami do rozpoznawania mowy, specjalnymi klawiaturami. Kluczowe wymagania:
- Poprawny HTML – kod musi być zgodny ze standardami. Błędy w kodzie mogą powodować, że czytniki ekranu źle interpretują treść.
- Role ARIA – atrybuty ARIA (Accessible Rich Internet Applications) pomagają technologiom wspomagającym zrozumieć funkcję elementów na stronie (np. że dany element to menu, dialog czy pasek postępu).
- Stany i właściwości – komponenty interaktywne (np. rozwijane menu) muszą komunikować swój stan (otwarte/zamknięte) do technologii wspomagających.
European Accessibility Act – nowe prawo, realne obowiązki
28 czerwca 2025 roku minął termin wdrożenia European Accessibility Act (EAA) – dyrektywy unijnej, która nakłada obowiązki dostępności cyfrowej na szerokie grono firm. Polska jest zobowiązana do jej stosowania jako kraj członkowski UE.
Kogo dotyczy EAA?
Ustawa obejmuje przede wszystkim:
- Sklepy internetowe i usługi e-commerce oferowane konsumentom
- Usługi bankowe i finansowe online
- Usługi transportowe (bilety, rozkłady jazdy)
- Usługi streamingowe i audiowizualne
- Urządzenia elektroniczne (smartfony, tablety, telewizory)
Wyłączone z obowiązku są mikroprzedsiębiorstwa zatrudniające mniej niż 10 osób i osiągające roczny obrót poniżej 2 mln euro – ale to nie znaczy, że dostępność ich nie dotyczy. Warto wdrażać dobre praktyki niezależnie od obowiązku prawnego.
Jakie kary grożą za niedostępność?
Każde państwo UE samo ustala kary w swoim systemie prawnym. W Polsce kwestie te reguluje ustawa o dostępności cyfrowej podmiotów publicznych – dla firm prywatnych mechanizmy egzekwowania są wciąż dopracowywane, ale presja rynkowa i ryzyko skargi konsumenckiej są realne.
Kto zyskuje na dostępnej stronie?
Wbrew pozorom, dostępność nie jest sprawą tylko osób z niepełnosprawnościami. Oto kto zyskuje na dostępnej stronie:
- Osoby niewidome i słabowidzące – korzystają z czytników ekranu (np. NVDA, JAWS, VoiceOver) lub powiększają ekran.
- Osoby niesłyszące i niedosłyszące – potrzebują napisów do filmów i treści tekstowych zamiast audio.
- Osoby z ograniczeniami motorycznymi – używają specjalnych klawiatur, eye-trackerów, przełączników.
- Seniorzy – często mają słabszy wzrok, wolniejszy czas reakcji, mniejsze doświadczenie z technologią.
- Użytkownicy mobilni – ekrany dotykowe wymagają dobrze zaprojektowanych przycisków i odpowiednich rozmiarów obszarów klikalnych.
- Osoby z czasowymi ograniczeniami – złamana ręka, infekcja oka, zmęczenie – każdy może potrzebować dostępności tymczasowo.
- Użytkownicy w trudnych warunkach – jasne słońce utrudniające odczytanie ekranu, hałaśliwe środowisko uniemożliwiające odsłuchanie treści.
Szacuje się, że ok. 15-20% populacji ma jakąś formę niepełnosprawności. W Polsce to kilka milionów potencjalnych klientów.
Kluczowe wymagania dostępności – praktyczna lista
Obrazki i media
- Każdy informatywny obrazek ma atrybut
altz opisem zawartości - Dekoracyjne obrazki mają pusty
alt=""(czytnik je pomija) - Filmy mają napisy i/lub transkrypcję
- Infografiki są opisane tekstem
Formularze
- Każde pole ma etykietę (
<label>) - Wymagane pola są oznaczone i wyjaśnione
- Komunikaty błędów są jasne i pomocne
- Formularz jest obsługiwalny klawiaturą
Nawigacja
- Strona ma link „Przejdź do treści” (skip navigation) dla użytkowników klawiatury
- Menu jest obsługiwalne klawiaturą
- Każda strona ma unikalny, opisowy tytuł
- Breadcrumbs lub inna wskazówka lokalizacji na stronie
Treść
- Nagłówki są używane hierarchicznie (jeden H1, H2 dla sekcji, H3 dla podsekcji)
- Linki mają opisowy tekst (nie „kliknij tutaj”, ale „pobierz cennik usług”)
- Kontrast kolorów spełnia minimum 4.5:1 dla tekstu normalnego
- Język strony jest określony w kodzie HTML
Komponenty interaktywne
- Wszystkie przyciski i linki są widocznie oznaczone jako aktywne (wskaźnik focusu)
- Modale/dialogi są dostępne klawiaturą i zamykają się klawiszem Escape
- Karuzele/slidery można zatrzymać i obsługiwać klawiaturą
- Role ARIA są używane poprawnie do niestandardowych komponentów
Narzędzia do testowania dostępności
Dobrą wiadomością jest to, że nie trzeba zatrudniać specjalisty, żeby zacząć sprawdzać dostępność swojej strony. Oto narzędzia, z których warto korzystać:
WAVE (Web Accessibility Evaluation Tool)
Rozszerzenie do przeglądarki lub serwis dostępny pod adresem wave.webaim.org. Analizuje stronę i wizualnie zaznacza błędy bezpośrednio na niej – widać dokładnie, gdzie jest problem. Idealne na start.
axe DevTools
Rozszerzenie do Chrome i Firefox, które można znaleźć w narzędziach deweloperskich przeglądarki. Wykrywa automatycznie większość błędów WCAG i wskazuje, jak je naprawić. Wersja podstawowa jest darmowa.
Google Lighthouse
Wbudowany w Chrome DevTools (F12 → Lighthouse). Generuje raport z oceną dostępności w skali 0-100. Nie wykrywa wszystkich problemów, ale jest szybkim punktem startowym i szczególnie przydatny, bo sprawdza też wydajność i SEO przy okazji.
Testy manualne
Automatyczne narzędzia wykrywają ok. 30-40% błędów dostępności. Resztę trzeba sprawdzić ręcznie:
- Odłącz mysz i spróbuj nawigować po stronie wyłącznie klawiaturą (Tab, Enter, strzałki)
- Włącz czytnik ekranu (NVDA na Windows – darmowy, VoiceOver na Mac – wbudowany) i sprawdź, jak strona brzmi
- Powiększ stronę do 200% i sprawdź, czy nic się nie psuje
Dostępność a SEO – nieoczekiwane korzyści
Wdrożenie dostępności przynosi niezamierzoną, ale bardzo cenną korzyść: poprawę pozycji w wyszukiwarkach. Googlebot zachowuje się podobnie do czytnika ekranu – analizuje tekst, strukturę nagłówków, opisy obrazków i linki.
Konkretne zależności:
- Alt text obrazków = dodatkowe słowa kluczowe dla Google Images
- Hierarchia nagłówków (H1-H3) = lepsza struktura treści dla robotów indeksujących
- Opisowe linki = lepsza nawigacja wewnętrzna i anchor text
- Szybkość i responsywność = czynniki rankingowe w Google
- Poprawny HTML = lepsza indeksowalność
Innymi słowy: strona dostępna dla osób niepełnosprawnych jest jednocześnie lepiej zindeksowana przez Google. To nie jest zbieg okoliczności – obie rzeczy wymagają dobrze napisanego, sensownie zorganizowanego kodu i treści.
Jak zacząć – plan wdrożenia dostępności
Jeśli Twoja strona do tej pory nie była projektowana z myślą o dostępności, nie musisz wszystkiego robić od razu. Oto realistyczny plan:
Krok 1: Audyt (tydzień 1)
Uruchom WAVE i Lighthouse na kluczowych podstronach (strona główna, kontakt, oferta, blog). Zapisz listę błędów – zazwyczaj jest ich dużo, ale wiele powtarza się.
Krok 2: Szybkie poprawki (tydzień 2-3)
Napraw problemy, które możesz rozwiązać sam lub z pomocą osoby zarządzającej treścią:
- Dodaj brakujące opisy alt do obrazków
- Sprawdź i popraw etykiety formularzy
- Ustaw język strony w kodzie
- Popraw tytuły podstron
Krok 3: Głębsze zmiany techniczne (miesiąc 1-2)
Zlecaj developerowi:
- Naprawę kontrastu kolorów
- Dodanie wskaźników focusu
- Zapewnienie nawigacji klawiaturą
- Dodanie ról ARIA do komponentów
Krok 4: Testy i dokumentacja
Przetestuj manualnie, szczególnie formularz kontaktowy i koszyk (jeśli masz sklep). Napisz deklarację dostępności – jest to wymagane dla wielu podmiotów.
Podsumowanie
Dostępność stron internetowych w 2026 roku to już nie opcja – to obowiązek prawny, etyczny i biznesowy. WCAG 2.2 daje jasne wytyczne, narzędzia testujące są bezpłatne, a korzyści – zarówno dla użytkowników, jak i dla SEO – są wymierne.
Jeśli nie wiesz, od czego zacząć, lub chcesz mieć pewność, że Twoja nowa strona zostanie zbudowana zgodnie ze standardami dostępności od samego początku, sprawdź naszą ofertę tworzenia stron internetowych. Budujemy strony dostępne, szybkie i skuteczne w pozycjonowaniu.
Masz pytania lub potrzebujesz audytu dostępności swojej obecnej strony? Napisz do nas – chętnie pomożemy.
