(ang.) WAVE Evaluation Tool

WAVE (Web Accessibility Evaluation Tool), opracowane przez WebAIM.org, jest popularnym i darmowym narzędziem do wstępnej i automatycznej oceny dostępności cyfrowej. Wersja w formie rozszerzenia przeglądarki (dostępna dla Chrome, Firefox, i Edge) integruje się bezpośrednio z interfejsem użytkownika, umożliwiając szybkie i prywatne testowanie.

Narzędzie działa poprzez wstrzyknięcie ikon i wskaźników bezpośrednio na badaną stronę internetową, wizualizując błędy, potencjalne problemy (ostrzeżenia), oraz kluczowe elementy strukturalne i cechy dostępności. Jest to idealne rozwiązanie do sprawdzania stron chronionych hasłem, dynamicznie generowanych lub przechowywanych lokalnie.

Skąd pobrać?

WAVE Evaluation Tool jest dostępne jako darmowy dodatek (rozszerzenie/wtyczka) dla najpopularniejszych przeglądarek i nie wymaga instalacji żadnego dodatkowego oprogramowania na komputerze.

• Google Chrome: Dostępne w Chrome Web Store
  • https://chromewebstore.google.com/detail/wave-evaluation-tool/jbbplnpkjmmeebjpijfedlgcdilocofh
• Mozilla Firefox: Dostępne w Mozilla Add-ons.
  • https://addons.mozilla.org/pl/firefox/addon/wave-accessibility-tool/?utm_source=addons.mozilla.org&utm_medium=referral&utm_content=search
• Microsoft Edge: Dostępne w Edge Add-ons
  • https://microsoftedge.microsoft.com/addons/detail/wave-evaluation-tool/khapceneeednkiopkkbgkibbdoajpkoj?hl=pl

Do konkretnie jakich podpunktów WCAG 2.2 na poziomie AA przydaje się to narzędzie w testowaniu?

WAVE jest narzędziem hybrydowym – wykrywa automatycznie błędy (około 30-40% wszystkich problemów dostępności), ale jego główną siłą jest ułatwianie weryfikacji manualnej. Pomaga w testowaniu następujących, mierzalnych kryteriów WCAG 2.2 na poziomie AA:

Nazwa Kryterium	Co weryfikuje WAVE (sekcje Raportu)
1.1.1 Treść nietekstowa (Non-text Content)	Błędy (Errors): Wykrywa brak atrybutu alt dla elementów <img>.
1.3.1 Informacje i relacje (Info and Relationships)	Elementy Strukturalne (Structural Elements): Analizuje poprawność hierarchii nagłówków (<h1> do <h6>) oraz obecność i poprawne użycie Landmarków (role ARIA/HTML5).
1.4.3 Kontrast (minimalny) (Contrast (Minimum))	Kontrast (Contrast): Automatycznie sprawdza współczynnik kontrastu tekstu względem tła (4.5:1) i graficznych komponentów interfejsu (3:1). Posiada wbudowany Contrast Checker, który pozwala na ręczne korygowanie kolorów.
2.1.1 Klawiatura (Keyboard)	Kolejność tabulatora (Order): Wizualizuje i wyświetla w bocznym panelu logiczną kolejność, w jakiej elementy interaktywne są focusowane przy użyciu klawisza TAB, co jest kluczowe dla nawigacji klawiaturą.
2.4.7 Widoczny Fokus (Focus Visible)	Focus: Wskazuje elementy, które nie mają widocznego focusu po przejściu tabulatorem (choć część weryfikacji musi być manualna).
4.1.2 Nazwa, rola, wartość (Name, Role, Value)	ARIA: Weryfikuje błędy i potencjalne problemy związane z implementacją atrybutów ARIA, które są kluczowe dla nadania roli, nazwy i wartości elementom.

Jak testować?

Korzystanie z rozszerzenia WAVE jest bardzo intuicyjne i odbywa się bezpośrednio na badanej stronie:

1. Instalacja: Zainstaluj rozszerzenie dla swojej przeglądarki (Chrome, Firefox lub Edge).
2. Uruchomienie: Przejdź na stronę, którą chcesz przetestować. Kliknij ikonę WAVE (zazwyczaj falę) po prawej stronie paska adresu przeglądarki lub użyj skrótu klawiszowego Ctrl + Shift + U (lub Command + Shift + U na Macu).
3. Wizualizacja: Na stronie natychmiast pojawią się kolorowe ikony, które wskazują problemy i cechy dostępności w miejscu ich występowania. Po lewej stronie ekranu otworzy się boczny panel kontrolny.
4. Analiza Panelu (Lewa Strona): W panelu kontrolnym skup się na kluczowych sekcjach:
   • Errors (Czerwone ikony): Błędy, które są pewnym naruszeniem WCAG (np. brak atrybutu alt). Wymagają natychmiastowej poprawy.
   • Alerts (Żółte ikony): Ostrzeżenia wskazujące na potencjalny problem, który musi zostać zweryfikowany manualnie (np. podejrzany tekst alternatywny, pominięty poziom nagłówka).
   • Contrast (Zakładka): Przejdź do tej zakładki, aby sprawdzić listę wszystkich problemów z kontrastem i użyć wbudowanego narzędzia do symulacji i korekty kolorów.
   • Order (Zakładka): Sprawdź poprawność kolejności nawigacji klawiaturowej.
5. Działania korygujące: Kliknij dowolną ikonę na stronie lub element na liście w panelu, aby uzyskać szczegółowy opis kryterium WCAG oraz wskazówki, jak naprawić błąd.
6. Wyłączenie: Aby usunąć interfejs WAVE i powrócić do normalnego widoku, po prostu kliknij ponownie ikonę rozszerzenia lub odśwież stronę.

Pamiętaj: WAVE identyfikuje techniczne problemy, ale nie zastąpi manualnego testowania z czytnikiem ekranu (np. NVDA) w celu oceny zrozumiałości kontekstu, logiczności i ogólnego doświadczenia użytkownika.