Europejski akt o dostępności: jak samodzielnie sprawdzić stronę

Jeśli sprzedajesz online konsumentom w UE, wymagania, które europejski akt o dostępności (European Accessibility Act) stawia stronom internetowym, obowiązują Twój sklep od 28 czerwca 2025 roku, chyba że Twoja firma jest mikroprzedsiębiorstwem. Wiele poważnych problemów znajdziesz sam: złóż testowe zamówienie wyłącznie z klawiatury, powiększ stronę i wypróbuj każdy formularz. Samodzielna kontrola nie udowodni jednak, że cała strona spełnia normę.

Być może programista wspomniał o tych przepisach albo dostałeś e-mail z ofertą widżetu, który jedną linijką kodu czyni każdą stronę „zgodną”. Klient, który nie przejdzie przez Twoją ścieżkę zakupu z klawiaturą albo z czytnikiem ekranu (programem, który czyta stronę na głos), może bez słowa skargi pójść do innego sklepu.

Czy europejski akt o dostępności dotyczy Twojej strony?

Akt ma zastosowanie, jeśli Twoja strona sprzedaje konsumentom, czyli osobom kupującym dla siebie, a Twoja firma nie jest mikroprzedsiębiorstwem. Dyrektywa (UE) 2019/882 wymienia usługi handlu elektronicznego wśród usług, które obejmuje: usługi świadczone przez stronę internetową lub aplikację „w celu zawarcia umowy konsumenckiej”. Państwa musiały stosować jej przepisy od 28 czerwca 2025 roku. To nasza interpretacja dyrektywy; w sprawie opinii prawnej dotyczącej Twojej sytuacji zwróć się do prawnika.

• Mikroprzedsiębiorstwa świadczące usługi są zwolnione. Mówi o tym art. 4 ust. 5. Dyrektywa określa mikroprzedsiębiorstwo jako firmę zatrudniającą mniej niż 10 osób, której roczny obrót lub roczna suma bilansowa nie przekracza 2 mln EUR. Liczą się oba warunki: liczba osób i jeden z dwóch progów finansowych. Zespół dziesięcioosobowy nie korzysta ze zwolnienia, nawet przy bardzo małym obrocie.
• Sprzedaż wyłącznie firmom. Definicja dotyczy umów konsumenckich. Jeśli klienci prywatni mogą złożyć zamówienie w Twoim sklepie, traktuj stronę jako objętą przepisami.
• Strona, która nic nie sprzedaje. Strona firmowa bez zamówień, rezerwacji i płatności zasadniczo nie jest usługą handlu elektronicznego w rozumieniu dyrektywy. Rezerwacje i płatności to zmieniają.
• Termin 2030 dotyczy produktów i starych umów. Okres przejściowy do 28 czerwca 2030 roku z art. 32 obejmuje produkty używane do świadczenia usługi oraz umowy zawarte przed czerwcem 2025 roku.

Każde państwo UE egzekwuje akt przez własną ustawę i ustala własne kary; w Niemczech tą ustawą jest BFSG. Jeśli Twoja firma działa w Szwajcarii lub w Wielkiej Brytanii i sprzedaje konsumentom w UE, zapytaj prawnika, jak te przepisy mają do Ciebie zastosowanie.

Dlaczego strony sklepów nie przechodzą kontroli dostępności?

Opisane niżej błędy biorą się zwykle z decyzji projektowych i dotyczących formularzy, podjętych raz w szablonie i powtarzanych na każdej stronie. Dyrektywa (UE) 2019/882 wymaga stron, które są „postrzegalne, funkcjonalne, zrozumiałe i kompatybilne”. Norma europejska, która przekłada to na testy, EN 301 549, opiera się na WCAG, wytycznych dotyczących dostępności treści internetowych publikowanych przez W3C. WCAG dzieli kryteria na trzy poziomy: A (minimum), AA i AAA. Norma przyjmuje za cel poziom AA.

Obramowanie fokusu usunięto dla wyglądu. Gdy ktoś porusza się po stronie klawiszem Tab, przeglądarka rysuje ramkę wokół aktywnego linku lub przycisku. Niektóre szablony ją ukrywają, bo wygląda nieestetycznie, choć WCAG wymaga widocznego wskaźnika fokusu. Kryterium dodane w WCAG 2.2 mówi też, że element z fokusem nie może być całkowicie zasłonięty przez treść samej strony, na przykład przyklejony nagłówek albo baner cookies.

Tekst jest zbyt blady. WCAG wymaga współczynnika kontrastu, czyli tego, o ile tekst jest ciemniejszy lub jaśniejszy od tła, co najmniej 4,5:1 dla zwykłego tekstu i 3:1 dla dużego. Skan miliona stron głównych przeprowadzony przez WebAIM w 2026 roku wykazał tekst o niskim kontraście na 83,9% z nich. Typowe przypadki to jasnoszary tekst na białym tle i biały tekst na pastelowym przycisku.

Formularze opierają się na podpowiedziach i kolorze. Szara podpowiedź w polu znika, gdy tylko zaczniesz pisać, a sama czerwona ramka nie mówi, co jest nie tak. WCAG wymaga etykiet lub instrukcji wszędzie tam, gdzie trzeba coś wpisać, oraz opisu błędów słowami.

Ścieżkę zakupu zbudowano pod mysz. Niestandardowe listy rozwijane, CAPTCHA z łamigłówkami i logowanie, przy którym trzeba zapamiętać lub przepisać kod, zatrzymują osoby korzystające z klawiatury lub czytnika ekranu. Dyrektywa wymienia osobno identyfikację, bezpieczeństwo i płatności w handlu elektronicznym. W marcu 2026 roku holenderski urząd ochrony konsumentów ACM poinformował, że w 61% skontrolowanych dużych holenderskich sklepów internetowych i innych dużych stron dla konsumentów nie dało się złożyć zamówienia przy użyciu technologii wspomagających, takich jak czytnik ekranu.

Widżet lub wynik zastępuje poprawki. Nakładki dodają nad stroną pasek narzędzi dostępności. Komisja Europejska stwierdza, że nakładki i podobne narzędzia, które nie sprawiają, że sama strona spełnia normę, „nie są właściwym rozwiązaniem”. Test automatyczny pomaga, ale jak ujmuje to W3C, „żadne narzędzie samo nie jest w stanie określić, czy strona spełnia standardy dostępności”.

Jak samodzielnie sprawdzić stronę pod kątem dostępności

Pierwszy przegląd zrobisz w przeglądarce i z klawiaturą, bez płatnych narzędzi. W3C, organizacja stojąca za WCAG, publikuje na tej zasadzie zestaw prostych testów Easy Checks. Wybierz trzy strony: stronę główną, stronę produktu lub usługi oraz koszyk z płatnością albo formularz kontaktowy. Idź po kolei i zapisuj każde miejsce, w którym utkniesz.

1. Odłóż mysz. Poruszaj się po każdej stronie klawiszami Tab i Shift+Tab, używaj Enter, spacji i strzałek. Powinieneś dotrzeć do menu, filtrów, przycisku dodawania do koszyka, każdego pola formularza i przycisku płatności. W każdej chwili musisz widzieć, gdzie jesteś. Zanotuj, gdzie ramka znika pod przyklejonym nagłówkiem lub banerem cookies i czy da się wyjść z menu albo okna czatu.
2. Powiększ stronę. Ustaw w przeglądarce 200%. WCAG oczekuje, że tekst pozostanie czytelny, a treść nie zostanie ucięta ani nie będzie na siebie nachodzić. Potem zmniejsz okno do szerokości około 1280 pikseli i powiększ do 400%: treść powinna zmieścić się na szerokość bez przewijania w bok, z wyjątkiem takich elementów jak mapy i tabele danych.
3. Sprawdź blady tekst. Narzędzia deweloperskie w Chrome, Edge i Firefox pokazują współczynnik kontrastu wybranego koloru tekstu. Sprawdź tekst główny, ceny, przyciski i drobny szary tekst pod polami formularzy.
4. Wyślij każdy formularz pusty, a potem z błędem. Każde pole potrzebuje widocznej etykiety, która nie znika podczas pisania. Wyślij pusty formularz: komunikat o błędzie powinien słowami mówić, czego brakuje, stać przy polu i zachować to, co już wpisałeś. Nowe kryterium WCAG 2.2 wymaga też, by informacje wpisane już w tym samym procesie, na przykład adres, były uzupełniane automatycznie lub dostępne do wyboru. O innych sposobach, w jakie formularz kosztuje Cię zamówienia, piszemy w tekście ruch na stronie jest, a zapytań brak.
5. Zaloguj się i przejdź zabezpieczenie przed spamem. WCAG 2.2 mówi, że logowanie nie może zależeć od testu funkcji poznawczych, takiego jak zapamiętanie hasła czy rozwiązanie łamigłówki, chyba że istnieje alternatywa lub pomoc, na przykład menedżer haseł albo wklejanie. CAPTCHA z łamigłówką bez innej opcji tu nie przechodzi.
6. Obejrzyj zdjęcia produktów. Kliknij zdjęcie prawym przyciskiem i wybierz Zbadaj. Tekst alternatywny, czyli krótki opis odczytywany przez czytnik ekranu, powinien mówić, czym jest produkt; obrazy czysto dekoracyjne mogą mieć pusty.
7. Powtórz kluczowe kroki na telefonie. Małe ikony ułożone blisko siebie trudno trafić palcem. WCAG 2.2 ustala minimalny rozmiar celu 24 na 24 piksele CSS (jednostka rozmiaru samej strony internetowej), z wyjątkami, na przykład gdy wokół celu jest dość miejsca.

W3C zaznacza, że strona „może pozornie przejść te testy, a mimo to mieć istotne bariery dostępności”. Następnym krokiem jest test przeprowadzony przez kogoś, kto na co dzień korzysta z czytnika ekranu.

Co naprawić najpierw?

Zacznij od poprawek w szablonie i komponentach formularzy, od najtańszych do najdroższych. Jedna zmiana w szablonie poprawia każdą stronę, która na nim powstała. Publikację informacji o dostępności zostaw na moment, gdy będziesz wiedzieć, co strona robi, a czego nie.

1. Nie instaluj nakładki. Komisja Europejska radzi naprawiać problemy z dostępnością „u źródła”, co w przypadku sklepu oznacza szablon, formularze i ścieżkę zakupu.
2. Przywróć ramkę fokusu i przyciemnij tekst. Oba ustawienia zwykle są w kolorach i stylach szablonu. Zaczynamy od ustawienia kontrastu raz w palecie projektu i sprawdzenia go w jasnej i ciemnej wersji strony, tak by każda nowa strona startowała z kolorów, które już spełniają wymagania.
3. Przebuduj formularze. Widoczne etykiety, błędy opisane słowami przy polu, wpisane dane zachowane po błędzie, fokus przeniesiony na pierwsze pole do poprawy i autouzupełnianie przeglądarki dla imienia, e-maila i adresu. W naszych projektach stron internetowych zaczynamy od samego komponentu formularza, więc każdy nowy formularz od razu ma te poprawki.
4. Dodaj teksty alternatywne i język strony. Opisz zdjęcia produktów i obrazy w treści oraz upewnij się, że każda strona deklaruje swój język, by czytnik ekranu wymawiał ją poprawnie. Wyszukiwarki czytają ten sam tekst alternatywny i atrybut języka, dlatego należą one także do technicznego SEO.
5. Napraw ścieżkę zakupu, logowanie i widżety zewnętrzne. Zastąp CAPTCHA z łamigłówkami zabezpieczeniami, które nie wymagają od klienta niczego rozwiązywać, i zaoferuj sposób logowania niezależny od pamięci. Widżety płatności i czatu pochodzą od dostawców: poproś każdego dostawcę o informacje o dostępności i wymień te, do których nie da się dotrzeć klawiaturą.
6. Opublikuj informacje o dostępności. Załącznik V do dyrektywy wymaga od usługodawców opisania, w jaki sposób usługa spełnia wymagania, w ogólnych warunkach lub równoważnym dokumencie. Szczegóły określa prawo krajowe.
7. Dąż do WCAG 2.2 na poziomie AA. EN 301 549 w wersji 4.1.1, opublikowana we wrześniu 2026 roku, dodaje sześć wymagań z WCAG 2.2, informuje AccessibleEU. To samo źródło zaznacza, że dopóki Komisja nie przywoła jej w Dzienniku Urzędowym Unii Europejskiej, punktem odniesienia pozostaje wersja 3.2.1, oparta na WCAG 2.1 na poziomie AA. Irlandzki National Disability Authority spodziewa się przywołania 16 grudnia 2026 roku. Poprawki pod WCAG 2.2 już teraz oznaczają, że nowe wymagania będą spełnione, gdy to nastąpi.

Dyrektywa dopuszcza wyjątek, gdy zgodność stanowiłaby nieproporcjonalne obciążenie, ale wymaga oceny, a jej motywy stwierdzają, że „brak priorytetu, czasu lub wiedzy” nie jest uzasadnionym powodem.

Co mierzyć po wprowadzeniu poprawek?

Mierz, czy człowiek może wykonać główne zadania z klawiaturą i przy powiększonej stronie. Powtórz tę samą kontrolę dostępności na tych samych trzech stronach i porównaj, gdzie utknąłeś przed zmianami i po nich. Sprawdzaj ponownie przy każdej zmianie szablonu, wtyczki lub operatora płatności.

1. Testowe zamówienie wyłącznie z klawiatury, od strony produktu do potwierdzenia, bez dotykania myszy.
2. Lista wyników z bezpłatnego testu automatycznego, na przykład Lighthouse w Chrome, uruchomionego na tych samych trzech typach stron. Przejrzyj wyniki i sprawdź, które z nich pozostały.
3. Formularze wysłane z błędami, by upewnić się, że każdy błąd jest opisany słowami i nic z wpisanych danych nie ginie.
4. Opublikowane informacje o dostępności, aktualizowane po każdej zmianie, która wpływa na to, jak klienci składają zamówienia.

Jak możemy pomóc

Gdy oglądamy ścieżkę zakupu w sklepie, idziemy drogą klienta: strona produktu, koszyk, formularze i płatność, najpierw z klawiaturą, potem na telefonie. Problemy, które siedzą w szablonie lub komponentach formularzy, najtaniej naprawić właśnie tam; czego samodzielna kontrola nie rozstrzygnie, zostawiamy na test z czytnikiem ekranu. Jeśli chcesz, by ktoś jeszcze raz spojrzał na Twoją ścieżkę zakupu, opowiedz nam o swojej stronie.

← Wszystkie artykuły