Dostosowanie portalu bankowego do standardów WCAG 2.1 – jak osiągnęliśmy 86% dostępności cyfrowej

Dostosowanie portali bankowych do wymogów WCAG 2.1 to z jednej strony obowiązek wynikający z regulacji. Z drugiej natomiast jest to kluczowy element strategiczny. Współczesne instytucje finansowe obsługują miliony klientów, z których część ma ograniczenia w korzystaniu z technologii cyfrowych. Właśnie dlatego jedna z największych instytucji bankowych w Polsce podjęła decyzję o audycie i optymalizacji swojego portalu pod kątem dostępności. Efektem było zwiększenie dostępności cyfrowej do 86%, co znacząco wyróżniło bank na tle konkurencji.

Diagnoza problemu – gdzie leżały wyzwania?

Bankowy portal informacyjny, obejmujący rozbudowaną infrastrukturę cyfrową, zawierał liczne dedykowane komponenty, takie jak kalkulatory finansowe, dynamiczne tabele, systemy nawigacyjne i moduły interaktywne. 

Analiza pokazała, że największymi barierami dla użytkowników były:

 Brak jednolitej struktury nagłówków, co utrudniało nawigację osobom korzystającym z czytników ekranowych,

 Zbyt niski kontrast niektórych elementów, wpływający na czytelność treści dla osób z dysfunkcjami wzroku,

 Ograniczona możliwość nawigacji za pomocą klawiatury, co wykluczało część użytkowników,

 Problemy z dostępnością interaktywnych komponentów, takich jak przyciski, formularze czy karuzele, które nie były w pełni zgodne ze standardami dostępności.

Brak spójnej architektury dostępności utrudniał korzystanie z portalu i narażał bank na ryzyko niespełnienia wymogów prawnych oraz oczekiwań klientów. Niezbędne było kompleksowe podejście, które pomogłoby wyeliminować bariery i zapewniałoby trwałą zgodność z WCAG 2.1, poprawiając doświadczenia użytkowników.

Strategia wdrożenia – droga ku dostępności cyfrowej

Aby skutecznie dostosować portal do wymagań WCAG 2.1, wdrożyliśmy szczegółowy plan działań podzielony na dziewięć trzytygodniowych sprintów w metodyce Agile. 

W kluczowych etapach projektu wykonaliśmy:

1. Szczegółową analizę audytu dostępności przeprowadzoną przez niezależnych ekspertów oraz fundację specjalizującą się w dostępności cyfrowej.
2. Optymalizację struktury HTML – poprawiliśmy semantykę kodu, wprowadzając jednoznaczne oznaczenia nagłówków, sekcji oraz elementów interaktywnych.
3. Dostosowanie nawigacji klawiaturą – umożliwiliśmy użytkownikom pełną obsługę portalu bez konieczności użycia myszy.
4. Poprawę kontrastu i dostosowanie kolorystyki zgodnie z wymaganiami WCAG 2.1 AA.
5. Testy z udziałem użytkowników z różnymi ograniczeniami w korzystaniu z technologii cyfrowych oraz iteracyjne dostosowanie rozwiązań do ich potrzeb.

Dzięki systematycznemu podejściu i iteracyjnym testom udało się wyeliminować kluczowe bariery, które ograniczały dostępność portalu. Wprowadzane zmiany poprawiły zgodność z WCAG 2.1, usprawniły nawigację i zwiększyły komfort korzystania dla wszystkich użytkowników, niezależnie od ich indywidualnych potrzeb.

Namacalne efekty wdrożenia – wzrost dostępności cyfrowej

Aby ocenić skuteczność wdrożonych zmian, przeprowadziliśmy reaudyt dostępności. Wyniki potwierdziły, że poprawki przyniosły realne korzyści:

 Sekcja „Klient indywidualny” osiągnęła poziom 86% dostępności,

 Moduł „Kantor” uzyskał wynik 86,6%,

 Strona „Konta” spełnia standardy WCAG 2.1 na poziomie 84%.

Dla porównania, według raportu Kinaole z 2022 roku, dostępność cyfrowa wśród największych banków w Polsce wynosiła od 25 do 56%. Wdrożone przez nas zmiany pozwoliły więc znacząco wyprzedzić rynek w tym zakresie.

Nowe standardy dostępności cyfrowej – co powinien zrobić Twój bank?

Europejski Akt o Dostępności (Dyrektywa 2019/882) zacznie obowiązywać w czerwcu 2025 roku, co oznacza, że banki muszą dostosować swoje portale i aplikacje do standardów WCAG 2.1 AA. Wdrożenie tych zmian pozwoli uniknąć ryzyka kar finansowych, ale przede wszystkim zapewni lepsze doświadczenia dla wszystkich użytkowników, w tym osób z ograniczeniami w korzystaniu z technologii cyfrowych. 

Jakie kroki warto podjąć, aby przygotować się na nadchodzące regulacje?

Działania techniczne – co możesz wdrożyć już teraz?

Aby zapewnić pełną zgodność z WCAG 2.1, banki powinny skupić się na kilku kluczowych aspektach technicznych:

• Dostępność nawigacji klawiaturą – użytkownicy powinni móc poruszać się po stronie bez konieczności użycia myszki, a stan „focus” na elementach interaktywnych musi być widoczny.
• Struktura HTML i semantyka kodu – warto zastąpić niesemantyczne elementy HTML (<div>, <span>) ich właściwymi odpowiednikami (<form>, <table>, <article>) w celu lepszej współpracy z technologiami asystującymi.
• Obsługa czytników ekranowych – konieczne jest dodanie atrybutów aria, atrybutów „lang” oraz poprawne stosowanie znaczników <abbr> i innych elementów ułatwiających interpretację treści przez osoby niewidome i niedowidzące.
• Odpowiedni kontrast i typografia – treści muszą być czytelne, a ich kontrast powinien spełniać normy WCAG (min. 4,5:1 dla tekstu oraz 3:1 dla interaktywnych elementów).
• Spójność interfejsu – elementy nawigacyjne i globalne funkcjonalności powinny znajdować się w tych samych miejscach na każdej podstronie, aby zapewnić intuicyjną obsługę.
• Dostosowanie do różnych urządzeń – strona musi być w pełni responsywna, a treści powinny zachowywać swoją strukturę na urządzeniach mobilnych i w czytnikach ekranowych.

Działania operacyjne – co ułatwi Ci utrzymanie dostępności?

Dostosowanie serwisów do WCAG 2.1 to proces ciągły, dlatego warto zadbać o:

• Regularne audyty dostępności – testowanie serwisu przy użyciu narzędzi takich jak NVDA (dla Windows) czy natywne czytniki w iOS i Androidzie.
• Szkolenia dla zespołów IT i UX – projektanci i deweloperzy powinni znać najlepsze praktyki dostępnościowe i stosować je na etapie tworzenia i wdrażania nowych funkcji.
• Testy z użytkownikami z ograniczeniami w korzystaniu z technologii cyfrowych – zapewnienie realnej użyteczności systemu poprzez współpracę z osobami niewidomymi, słabowidzącymi czy z ograniczeniami ruchowymi.
• Przejrzystość formularzy i komunikatów błędów – użytkownicy powinni otrzymywać jednoznaczne instrukcje i komunikaty zwrotne, np. poprzez czytelne podpowiedzi i oznaczenie błędnie wypełnionych pól.

Powyższe przykłady to jedynie podstawowe wymagania, które instytucje finansowe muszą spełnić, aby dostosować się do regulacji. Aby jednak realnie zwiększyć dostępność usług i wyjść naprzeciw potrzebom wszystkich klientów, konieczne jest opracowanie długoterminowej strategii, przeprowadzenie audytów, wdrożenie zaawansowanych rozwiązań i zapewnienie ich ciągłego monitorowania oraz optymalizacji.

Sprawdź, czy Twój serwis spełnia wymagania WCAG 2.1

Przygotowanie bankowego portalu zgodnie z nowymi regulacjami wymaga zarówno działań technicznych, jak i organizacyjnych. Aby ułatwić ten proces, przygotowaliśmy szczegółową checklistę zawierającą wszystkie kluczowe aspekty dostępności cyfrowej. Pobierz ją i sprawdź, czy Twój serwis jest gotowy na nowe standardy: