Dyrektywa EAA, czyli dostępność cyfrowa w Comarch e-Sklep

Europejski Akt o Dostępności to dyrektywa Unii Europejskiej (2019/882), której celem jest zapewnienie, że produkty i usługi są dostępne dla osób z różnymi rodzajami niepełnosprawności. Dyrektywa ta została przyjęta 17 kwietnia 2019 roku i ma na celu ujednolicenie wymogów dostępności w całej Unii Europejskiej, eliminując bariery w dostępie do różnych towarów i usług na rynku wewnętrznym. W Polsce pełne wdrożenie EAA nastąpi 28 czerwca 2025 roku.

Wpływ EAA na właścicieli sklepów internetowych

EAA wprowadza konkretne obowiązki dla przedsiębiorców działających w e-commerce, mające na celu zapewnienie pełnej dostępności cyfrowej produktów i usług online. Regulacje te dotyczą zarówno technicznych aspektów stron internetowych i aplikacji mobilnych, jak i sposobu świadczenia usług. Oznacza to, że sklepy internetowe będą zobowiązane do wprowadzenia rozwiązań, które zapewnią dostępność ich stron oraz procesów zakupowych dla wszystkich użytkowników, w tym osób z niepełnosprawnościami. Sklep internetowy będzie musiał więc być zgodny ze standardem WCAG 2.2.

Dostosowanie sklepu internetowego do wymogów EAA nie tylko spełnia wymogi prawne, ale również pozytywnie wpływa na doświadczenie użytkownika (UX) i otwiera drzwi do nowej grupy klientów.

Warto zauważyć, że mikroprzedsiębiorcy, czyli firmy zatrudniające mniej niż 10 osób i osiągające roczny obrót nieprzekraczający 2 milionów euro, są zwolnieni z obowiązku dostosowania swoich produktów i usług do wymogów EAA.

Czym są standardy WCAG?

WCAG (Web Content Accessibility Guidelines) to międzynarodowe wytyczne, których celem jest zapewnienie, aby treści internetowe były dostępne dla wszystkich użytkowników, w tym osób z różnymi rodzajami niepełnosprawności – wzrokowymi, słuchowymi, motorycznymi, poznawczymi i innymi.

Standardy WCAG opierają się na czterech podstawowych zasadach – treść musi być:

1. Postrzegalna (Perceivable) – Użytkownicy muszą być w stanie odebrać informacje z interfejsu (np. tekst alternatywny dla obrazów, kontrast kolorów).
2. Funkcjonalna (Operable) – Interfejs musi być możliwy do obsługi (np. za pomocą klawiatury, bez zacinających się elementów).
3. Zrozumiała (Understandable) – Treści i elementy interaktywne muszą być zrozumiałe (czytelny język, przewidywalne zachowanie, jasne komunikaty błędów).
4. Solidna (Robust) – Strona powinna działać poprawnie w różnych przeglądarkach, na różnych urządzeniach i być zgodna z technologiami wspomagającymi (np. czytniki ekranowe).

Przygotowanie Comarch e-Sklep na wprowadzenie EAA

Comarch e-Sklep aktywnie przygotowuje się do spełnienia wymagań Europejski Akt o Dostępności i zapowiada, że platforma będzie zgodna z ustawą o zapewnianiu spełniania wymagań dostępności niektórych produktów i usług przez podmioty gospodarcze. Zanim jednak to nastąpi warto zapoznać się wytycznymi, szczególnie jeśli korzystasz z autorskiego lub modyfikowanego szablonu.

(Możesz też pobrać listę kontrolną w formie PDF i przejść do omówienia narzędzi testujących dostępność)

CHECKLISTA WCAG 2.2 – POZIOM AA dla sklepów internetowych

1. Struktura i nawigacja

• Strona ma logiczną strukturę nagłówków (<h1> → <h6>)
• Każda strona ma unikalny, zrozumiały tytuł (<title>)
• Linki i przyciski mają czytelne opisy (nie: „kliknij tutaj”)
• Istnieje możliwość nawigacji klawiaturą (Tab, Enter)
• Skupienie (focus) elementów jest widoczne i niezasłonięte

2. Treść wizualna i kolorystyka

• Tekst ma wystarczający kontrast względem tła (min. 4.5:1)
• Kolor nie jest jedynym środkiem przekazu (np. błędne pola mają ikonę/symbol)
• Treść może być powiększona do 200% bez utraty funkcjonalności

3. Tekst alternatywny i multimedia

• Wszystkie obrazy mają poprawne opisy alternatywne (alt)
• Multimedia (wideo, audio) mają napisy lub transkrypcję
• Automatyczne multimedia (np. slajdery) można zatrzymać/pauzować

4. Formularze i interakcje

• Formularze mają poprawne etykiety (label) i instrukcje
• Komunikaty błędów są zrozumiałe i powiązane z polem
• Formularze umożliwiają korektę bez utraty danych
• Brak wymogu rozwiązywania trudnych CAPTCHA – lub jest alternatywa

5. Elementy interaktywne

• Linki i przyciski mają minimalny rozmiar 24x24 px
• Istnieje spójny sposób obsługi nawigacji i funkcji na każdej podstronie
• Nie ma przeszkadzających animacji, które mogą powodować rozproszenie lub dyskomfort

6. Uwierzytelnianie i dostęp

• Użytkownicy nie muszą zapamiętywać informacji przy logowaniu (np. możliwość logowania kodem jednorazowym, integracja z menedżerem haseł)
• Nie ma barier w dostępności (np. skomplikowane pytania zabezpieczające bez alternatywy)

7. Responsywność i kompatybilność

• Sklep działa poprawnie na urządzeniach mobilnych
• Testowany z czytnikami ekranu (np. NVDA, VoiceOver)
• Kompatybilny z różnymi przeglądarkami (Firefox, Chrome, Safari itp.)

Jak samodzielnie sprawdzić dostępność sklepu internetowego?

Powyższa lista może wydawać się długa, a tematy do sprawdzenia skomplikowane, szczególnie dla firm bez własnego działu IT. Na szczęście większość wymienionych tematów powinna zostać opracowana przez dostawcę silnika sklepowego tak, żeby sprzedawcy mogli skupić się wyłącznie na kwestiach związanych z treściami (jak na przykład opisy linków i opisy alternatywne dla zdjęć).

Ponadto istnieje szereg darmowych narzędzi ułatwiających samodzielne testowanie strony www (nie tylko sklepu).

Darmowe narzędzia do testowania dostępności stron (zgodne z WCAG 2.2)

1. WAVE – Web Accessibility Evaluation Tool

WAVE analizuje stronę i wizualnie oznacza błędy dostępności (np. brakujące opisy alternatywne, problemy z kontrastem). Jest szczególnie przydatne dla osób nietechnicznych.

2. axe DevTools (by Deque Systems)

Profesjonalne narzędzie do testowania dostępności w formie rozszerzenia przeglądarki, wykrywające wiele problemów zgodnych z WCAG. Integruje się z procesem developerskim i jest używane przez wiele dużych organizacji.

3. Lighthouse (Google Chrome DevTools)

Lighthouse generuje raporty dotyczące wydajności, SEO i dostępności strony. Jest to narzędzie wbudowane w Chrome, nie wymaga instalacji dodatkowych rozszerzeń.

4. Pa11y

Pa11y to narzędzie wiersza poleceń do automatycznego testowania dostępności stron internetowych. Może być zintegrowane z procesami CI/CD, co pozwala na ciągłe monitorowanie dostępności podczas rozwoju projektu.

5. WebAIM Contrast Checker

To narzędzie umożliwia sprawdzenie kontrastu kolorów tekstu względem tła, zgodnie z wymaganiami WCAG. Pomaga zapewnić czytelność treści dla osób z wadami wzroku.

Porównanie narzędzi do testowania dostępności sklepów internetowych:

Jak widać narzędzia te mają różne zastosowanie i stopień skomplikowania. Właścicielom sklepów chcącym szybko wykonać ogólną analizę polecamy skorzystanie z WAVE + Lighthouse.

Podsumowanie

Europejski Akt o Dostępności wprowadza istotne zmiany dla właścicieli sklepów internetowych, nakładając obowiązek zapewnienia dostępności cyfrowej dla osób z niepełnosprawnościami. Comarch e-Sklep, jako platforma e-commerce, aktywnie przygotowuje się do spełnienia tych wymagań, co pozwoli jego klientom na zgodność z nowymi przepisami i poprawę dostępności swoich sklepów internetowych.

O samej implementacji wytycznych EAA w Comarch e-Sklep napiszemy w oddzielnym artykule, gdy pojawi się zaktualizowana wersja silnika sklepowego.