WCAG 2.2 na stronie firmowej: co musisz poprawić?

Co dokładnie trzeba poprawić na stronie pod kątem WCAG 2.2 i ile to kosztuje?

Dostosowanie strony firmowej do standardu WCAG 2.2 na poziomie AA wymaga usunięcia błędów w 6 głównych obszarach: kontrastach kolorów, obsłudze pełnej nawigacji samą klawiaturą, wielkości pól dotykowych (minimum 24×24 piksele), czytelności formularzy, etykietach dla czytników ekranowych oraz braku pułapek fokusowych. Koszt audytu i poprawek na istniejącej stronie wynosi zazwyczaj od 1 500 zł do 6 000 zł netto, a jeśli kod ma ponad 5 lat, bardziej opłaca się nowe tworzenie stron internetowych zgodnych z normami od zera, co w SISL wyceniamy od 4 900 zł netto.

Przez lata wymogi dostępności cyfrowej dotyczyły wyłącznie urzędów gmin, szpitali i szkół. 28 czerwca 2025 roku wchodzi w życie Europejski Akt o Dostępności (EAA), wdrożony do polskiego prawa ustawą o zapewnianiu spełniania wymagań dostępności niektórych produktów i usług przez podmioty gospodarcze. Oznacza to koniec ery, w której małe i średnie firmy mogły ignorować niewidomych, niedowidzących czy osoby z ograniczeniami motorycznymi.

Czy Europejski Akt o Dostępności (EAA) dotyczy mojej małej firmy?

Odpowiedź brzmi: to zależy od Twojej formy działalności i skali przychodów, ale granica jest bardzo precyzyjna.

Ustawa wyłącza tzw. mikroprzedsiębiorstwa, czyli firmy, które zatrudniają mniej niż 10 pracowników ORAZ mają roczny obrót lub sumę bilansową poniżej 2 milionów euro (ok. 8,6 mln zł). Jeśli prowadzisz jednoosobową działalność gospodarczą, lokalny warsztat samochodowy, biuro rachunkowe albo małą agencję doradczą i sprzedajesz usługi wyłącznie B2B, obowiązek prawny bezpośrednio Cię nie dotyczy. Nikt z urzędu nie nałoży na Ciebie kary za brak opisu alternatywnego przy zdjęciu w portfolio.

Sytuacja zmienia się całkowicie, jeśli prowadzisz:

• Sklep internetowy (e-commerce B2C) — handel elektroniczny jest bezpośrednio objęty ustawą bez względu na branżę, jeśli przekraczasz progi mikroprzedsiębiorstwa.
• Usługi transportowe, bankowe, telekomunikacyjne lub medyczne oferowane konsumentom przez serwisy cyfrowe.
• Firmę startującą w przetargach publicznych — urzędy, uczelnie i spółki skarbu państwa coraz częściej wymagają deklaracji dostępności od podwykonawców, niezależnie od ich wielkości.

Jeśli sprzedajesz przez internet i przyjmujesz płatności przez BLIK, Przelewy24 czy karty płatnicze, Twój proces zakupowy – od koszyka po bramkę płatności – staje się pod lupą ustawy. Kary finansowe nakładane przez organy nadzorcze (np. PFRON, UKE, UOKiK) mogą sięgać do 10-krotności przeciętnego wynagrodzenia lub procentu rocznego obrotu.

Co konkretnie w WCAG 2.2 psuje się na 90% polskich stron firmowych?

Wytyczne WCAG 2.2 (Web Content Accessibility Guidelines) nie są abstrakcyjną filozofią – to zestaw twardych reguł technicznych. Oto 5 błędów, które eliminujemy w pierwszej kolejności podczas audytów:

1. Brak widocznego wskaźnika fokusu (Kryterium 2.4.7 i 2.4.11)

Gdy użytkownik porusza się po stronie za pomocą klawisza Tab (zamiast myszki), element aktywny (link, przycisk, pole formularza) musi być wyraźnie zaznaczony ramką o odpowiednim kontraście. Wielu grafików wyłącza obramowanie regułą CSS outline: none, bo „brzydko wygląda”. W WCAG 2.2 to dyskwalifikacja witryny.

2. Za małe cele dotykowe (Target Size – Kryterium 2.5.8)

Nowość w standardzie 2.2: każdy klikalny element na smartfonie (ikona menu, przycisk „dodaj do koszyka”, miniatura produktu) musi mieć minimalny obszar dotyku wynoszący 24×24 piksele CSS lub zachowywać odpowiedni odstęp od sąsiadujących linków. Koniec z mikro-krzyżykami do zamykania wyskakujących okienek.

3. Nieczytelny tekst i zbyt niski kontrast (Kryterium 1.4.3)

Jasnoszary tekst (#999999) na białym tle to zmora nowoczesnego web designu. WCAG wymaga minimalnego współczynnika kontrastu 4.5:1 dla standardowego tekstu oraz 3:1 dla nagłówków i elementów interfejsu (np. obramowań pól input).

4. Fatalnie wdrożone formularze kontaktowe

Formularze na stronach to często koszmar dostępności. Typowe błędy to:

• Brak powiązania etykiety tekstowej <label> z polem <input> za pomocą atrybutu for="id".
• Polegający wyłącznie na placeholderze (szarym tekście znikającym po kliknięciu).
• Komunikaty o błędach oznaczone jedynie czerwonym kolorem ramki (osoba nierozróżniająca barw nie wie, które pole wypełniła źle).
• Brak wsparcia dla autouzupełniania danych (np. imię, telefon, adres) z poziomu przeglądarki.

5. Puste linki i brakujące opisy alternatywne (Alt text)

Przyciski społecznościowe zawierające wyłącznie samą ikonę SVG (bez tekstu ukrytego dla czytników) są dla niewidomego odczytywane jako „link, pusty”. Każdy element graficzny niosący treść musi mieć zrozumiały atrybut alt, a ikony czysto dekoracyjne powinny posiadać atrybut aria-hidden="true".

Ile kosztuje dostosowanie strony do WCAG 2.2?

Na rynku panuje duży rozstrzał cenowy. Wycena zależy od technologii, na której stoi witryna (czysty kod, customowy WordPress, gotowy szablon z ThemeForest czy platforma SaaS) oraz liczby unikalnych szablonów podstron.

W SISL zawsze zaczynamy od bezwzględnej kalkulacji: jeśli naprawa starego, zaśmieconego szablonu na WordPressie ma zająć 40 roboczogodzin programisty (co przy rynkowej stawce 120-180 zł/h daje 4 800 – 7 200 zł), wprost rekomendujemy postawienie witryny od nowa za 4 900 zł netto. Otrzymujesz wtedy nowoczesny, lekki kod, pełną zgodność z normami i platformę gotową na kolejne 5 lat.

Czy wtyczka typu „pasek dostępności” załatwia problem z prawem?

Krótka odpowiedź: nie, to strata pieniędzy i wizerunkowa pułapka.

Wielu właścicieli firm instaluje nakładki javascriptowe (tzw. accessibility overlays) – widżety z ikonką ludzika w kółku, które oferują zmianę kontrastu, powiększenie czcionki czy czytanie tekstu na głos. Kosztują od kilkudziesięciu do kilkuset złotych rocznie i obiecują „zgodność z WCAG jednym kliknięciem”.

Prawda techniczna jest brutalna:

1. Nie naprawiają struktury kodu: Wtyczka nie doda logicznej hierarchii nagłówków (H1-H4), nie naprawi braku etykiet w formularzach backendowych ani nie usunie błędów w skryptach blokujących nawigację klawiaturą.
2. Przeszkadzają użytkownikom: Osoby niewidome korzystają z własnego oprogramowania (np. NVDA, JAWS). Nakładki często wchodzą w konflikt z tymi programami, paraliżując przeglądanie.
3. Nie chronią przed karami: Zarówno międzynarodowe organizacje zrzeszające osoby z niepełnosprawnościami, jak i prawnicy specjalizujący się w prawie cyfrowym wskazują jednoznacznie: nakładka nie czyni serwisu dostępnym w świetle prawa. Dostępność musi być zaszyta w kodzie HTML/CSS/JS.

Kiedy NIE warto inwestować w pełne wdrożenie WCAG?

Nie każda firma potrzebuje certyfikowanego poziomu WCAG 2.2 AAA (najwyższego, rygorystycznego stopnia dostępności). Uczciwe podejście do budżetu wymaga chłodnej kalkulacji:

• Gdy prowadzisz mikro-firmę B2B: Jeśli masz stronę-wizytówkę dla 3-osobowej firmy montującej pompy ciepła, nikt nie nałoży na Ciebie sankcji z EAA. Zamiast wydawać 5 000 zł na pełną certyfikację, wystarczy poprawić podstawy: kontrast tekstu, czytelny formularz i rozmiar fontu na telefonie.
• Gdy za 3 miesiące zamykasz lub zmieniasz system: Przerabianie obecnego sklepu pod EAA, jeśli w planach na IV kwartał masz migrację na nową platformę, to wyrzucanie budżetu w błoto. Lepiej uwzględnić wymagania dostępności w specyfikacji nowego wdrożenia.
• Gdy brakuje Ci sprzedaży, a nie zgodności prawnej: Dostępność cyfrowa poprawia SEO i konwersję, ale jeśli Twój produkt nie ma popytu, a strona ma 50 odwiedzin miesięcznie, Twoim priorytetem powinno być pozycjonowanie (od 1 500 zł/mc) lub płatne kampanie, a nie kosztowny audyt laboratoryjny.

Jak wdrożyć zmiany krok po kroku bez paraliżu budżetu?

Zamiast panikować przed czerwcowym terminem EAA, podziel proces na 3 logiczne etapy:

1. Szybki skan automatyczny: Skorzystaj z darmowych narzędzi (Google Lighthouse, WAVE Accessibility Extension, axe DevTools). Pozwolą Ci wychwycić 30-40% rażących błędów, takich jak brakujące kontrasty czy niepodpisane pola formularzy.
2. Test klawiatury: Odłącz myszkę i spróbuj przejść całą ścieżkę klawiszem Tab, Enter i spacją. Czy jesteś w stanie otworzyć menu, wypełnić formularz, zaakceptować baner RODO i kliknąć „Wyślij”? Jeśli kursor znika lub blokuje się w pętli – to są Twoje priorytety do naprawy przez programistę.
3. Weryfikacja koszyka (dla e-commerce): Upewnij się, że integracje zewnętrzne (np. widget Paczkomatów InPost, okno wyboru banku w Przelewy24, moduł zgód marketingowych) posiadają etykiety ARIA i są w pełni responsywne.

Jeśli nie wiesz, w jakim stanie technicznym jest Twoja witryna, napisz do nas. Przeanalizujemy Twój kod, powiemy bez owijania w bawełnę, czy EAA bezpośrednio Cię dotyczy, i zaproponujemy wariant naprawy dopasowany do realnych zysków Twojej firmy.