Najważniejsze wnioski
- Użytkownik może sam wybrać zestaw funkcji odpowiadający jego potrzebom.
- Gotowe profile skracają drogę do sensownej konfiguracji.
- Zmiany prezentacji nie naprawiają wszystkich problemów semantycznych strony.
- Najlepiej demonstrować funkcje na realnym fragmencie treści lub formularzu.
Panel WCAGbot nie zmienia treści strony ani jej struktury. Zmienia sposób, w jaki ta treść jest prezentowana — a to dla części użytkowników różnica między „da się przeczytać” a „nie da się przeczytać”. Poniżej przechodzimy przez konkretne funkcje: co robią, komu pomagają i gdzie kończy się ich zasięg.
Typografia: rozmiar, odstępy, krój
Powiększenie tekstu jest najczęściej używaną funkcją i zwykle pierwszą, po którą sięga użytkownik. Panel pozwala skalować tekst stopniowo, bez powiększania całego układu — inaczej niż zoom przeglądarki, który skaluje wszystko naraz.
Obok rozmiaru liczą się odstępy. Zwiększenie odstępu między wierszami, literami i akapitami potrafi poprawić czytelność bardziej niż samo powiększenie kroju. Osobna opcja pozwala przełączyć się na krój bezszeryfowy o wyraźnie odróżnialnych znakach, co bywa istotne przy dysleksji.
Kontrast i kolor
Panel udostępnia kilka trybów kolorystycznych: ciemny, jasny, wysoki kontrast, wysokie i niskie nasycenie oraz odcienie szarości. Nie są to warianty tego samego — każdy odpowiada na inną potrzebę.
| Tryb | Komu pomaga | Typowe zastosowanie |
|---|---|---|
| Ciemny kontrast | Osobom wrażliwym na jasne tło | Długie czytanie, wieczorne korzystanie |
| Wysoki kontrast | Osobom słabowidzącym | Odczyt drobnych elementów interfejsu |
| Niskie nasycenie | Osobom wrażliwym na intensywne barwy | Strony z mocną kolorystyką marki |
| Odcienie szarości | Osobom rozpraszanym przez kolor | Skupienie na treści, nie na grafice |
Tryby kolorystyczne łagodzą skutki zbyt niskiego kontrastu, ale nie zwalniają z poprawienia palety w samym serwisie. Domyślny wygląd strony powinien spełniać wymagania kontrastu bez włączania czegokolwiek — użytkownik nie ma obowiązku szukać panelu, żeby przeczytać cenę produktu.
Czytanie treści i prowadzenie wzroku
Funkcja czytania odtwarza zaznaczony fragment tekstu syntezatorem mowy. Warto rozumieć jej charakter: to udogodnienie dla osoby, która widzi stronę i chce odsłuchać fragment. Nie jest to zamiennik czytnika ekranu, który pozwala poruszać się po całym interfejsie, odczytuje nagłówki, listy, tabele, nazwy przycisków i stan kontrolek.
Do tej samej grupy należą prowadnica czytania — pozioma linia podążająca za kursorem — oraz maska, która przyciemnia wszystko poza wybranym pasem. Obie pomagają utrzymać wzrok w linii przy długich tekstach.
Ruch, kursor i odnośniki
Zatrzymanie animacji wyłącza karuzele, przesuwające się banery i efekty pojawiania się przy przewijaniu. Dla osób z nadwrażliwością przedsionkową albo z zaburzeniami koncentracji jest to jedna z najbardziej odczuwalnych zmian. Warto zaznaczyć, że przeglądarki mają własną preferencję ograniczonego ruchu — dobrze zbudowany serwis powinien ją respektować niezależnie od panelu.
Powiększony kursor i podświetlenie odnośników pomagają nie zgubić się na gęstych stronach. Podświetlenie linków ma dodatkową zaletę: pokazuje, które elementy są klikalne, gdy projekt graficzny odróżnia je wyłącznie kolorem.
Dobre ustawienie dostępności to takie, o którym użytkownik zapomina po dwóch minutach, bo po prostu czyta.
Profile: skrót, nie wyrocznia
Profile ustawiają kilka funkcji naraz i skracają drogę do sensownej konfiguracji. Traktuj je jako punkt startu — użytkownik powinien móc dowolnie skorygować pojedyncze opcje, bo potrzeby nie układają się w gotowe kategorie. Preferencje zapisują się w przeglądarce, więc przy kolejnej wizycie ustawienia wracają.
Scenariusz: strona wydarzenia
Rozważmy scenariusz organizatora konferencji, który publikuje program w formie gęstej tabeli na tle zdjęcia. Uczestniczka o obniżonej ostrości widzenia włącza wysoki kontrast i większy tekst — tabela staje się czytelna. To realna wygrana.
Ta sama strona ma jednak przycisk zapisu na listę uczestników, który jest zwykłym elementem div bez nazwy dostępnej. Panel go nie naprawi, bo brakuje informacji, a nie kontrastu. Zapis wymaga poprawki w kodzie. Tę granicę opisujemy szerzej w tekście o widgecie a zgodności z WCAG.
Jak pokazywać funkcje klientowi
Najgorsza demonstracja to lista ikon. Najlepsza to jedna realna trudność rozwiązana na oczach klienta: otwórz jego stronę, znajdź najdrobniejszy tekst i powiększ go, albo włącz wysoki kontrast na sekcji z jasnoszarym opisem. Jedno konkretne „o, teraz widać” działa lepiej niż wyliczanka dwudziestu opcji.
Od potrzeby do ustawienia panelu
Jeżeli chcesz zacząć od strony technicznej, przejdź przez instalację panelu. Jeżeli prowadzisz sklep, warto zestawić funkcje z checklistą dostępności sklepu, a kontekst wymagań znajdziesz w tekstach o WCAG i EN 301 549 oraz o Polskim Akcie o Dostępności.
Czego panel nie zrobi za projektanta
Funkcje wspierające działają na tym, co już jest na stronie. Jeżeli czegoś brakuje w dokumencie, żadna zmiana prezentacji tego nie uzupełni. Warto znać tę listę, zanim widget trafi do planu zgodności.
- Nazwy dostępne kontrolek. Przycisk zbudowany z elementu bez nazwy pozostanie bezimienny dla technologii asystujących.
- Opisy alternatywne. Zdjęcie produktu bez opisu nie zyska go przez powiększenie ani zmianę kontrastu.
- Struktura nagłówków. Jeżeli strona nie ma hierarchii nagłówków, nawigacja po niej nadal będzie utrudniona.
- Kolejność fokusu. Panel nie przebuduje kolejności elementów w dokumencie ani nie uwolni fokusu z okna modalnego.
- Komunikaty błędów. Błąd sygnalizowany samym kolorem ramki pozostanie nieczytelny dla osoby, która tego koloru nie rozróżnia.
To nie jest zarzut wobec narzędzia, tylko opis jego zakresu. Warstwa prezentacji rozwiązuje problemy prezentacji. Braki informacyjne rozwiązuje się w kodzie i w treści — argumentację rozwijamy w tekście o widgecie a zgodności z WCAG.
Dobre praktyki po stronie serwisu
Panel działa najlepiej na stronie, która sama jest przyzwoicie zbudowana. Cztery rzeczy dają największy efekt i warto je mieć niezależnie od jakiegokolwiek widgetu.
Domyślna typografia powinna być czytelna bez powiększania: rozmiar tekstu podstawowego co najmniej szesnaście pikseli, odstęp między wierszami z zapasem, szerokość kolumny ograniczona do kilkudziesięciu znaków. Paleta kolorów powinna spełniać wymagania kontrastu w wersji domyślnej, a nie dopiero po włączeniu trybu kontrastowego.
Serwis powinien też respektować systemową preferencję ograniczonego ruchu, którą użytkownik ustawia raz w systemie operacyjnym i która działa na wszystkich stronach. Wreszcie układ musi znosić powiększenie do dwustu procent bez utraty treści i funkcji — to sprawdzisz w minutę, bez instalowania czegokolwiek.
Podsumowanie: warstwa wsparcia, nie zamiennik
Funkcje panelu mają jasno zarysowany zakres. Pomagają tam, gdzie problemem jest sposób pokazania treści: za mały tekst, zbyt niski kontrast, rozpraszający ruch, gubiący się kursor. Użytkownik dostaje kontrolę nad prezentacją, a jego ustawienia wracają przy kolejnej wizycie.
Nie pomagają tam, gdzie problemem jest brak informacji — nienazwanego przycisku, nieopisanego zdjęcia, komunikatu błędu sygnalizowanego samym kolorem. Najlepszy efekt daje więc połączenie obu warstw: przyzwoicie zbudowany serwis plus możliwość dopasowania go do własnych potrzeb.
Na koniec praktyczna wskazówka dla zespołu: przetestujcie panel na własnej stronie w tych ustawieniach, których naprawdę używają klienci, a nie w każdej możliwej kombinacji. Dwa najczęstsze tryby sprawdzone porządnie dają większą pewność niż dwadzieścia przeklikanych pobieżnie.
Najczęstsze pytania
Czy funkcja czytania zastępuje czytnik ekranu?
Nie. Odczytuje wskazany fragment tekstu, ale nie udostępnia nawigacji po nagłówkach, listach, tabelach i kontrolkach, z której korzysta osoba niewidoma.
Czy ustawienia zapamiętują się między wizytami?
Tak, preferencje zapisywane są w przeglądarce użytkownika i wracają przy kolejnym wejściu na tę samą stronę.
Czy panel zmienia wygląd strony dla wszystkich odwiedzających?
Nie. Zmiany dotyczą wyłącznie osoby, która je włączyła, i tylko w jej przeglądarce.
Czy powiększenie tekstu może zepsuć układ strony?
Może ujawnić istniejący problem z układem. Serwis powinien znosić powiększenie do 200% bez utraty treści i funkcji, niezależnie od tego, czy powiększenie pochodzi z panelu, czy z przeglądarki.
Czy tryb wysokiego kontrastu wystarczy zamiast poprawy palety?
Nie. Domyślny wygląd strony powinien spełniać wymagania kontrastu samodzielnie. Tryb kontrastowy jest udogodnieniem, nie obejściem.
Czy zatrzymanie animacji wyłącza filmy?
Dotyczy automatycznie odtwarzanych efektów i karuzel. Materiały uruchamiane świadomie przez użytkownika pozostają pod jego kontrolą.
Które funkcje są najczęściej używane?
Najczęściej powiększenie tekstu i tryby kontrastu. To także funkcje, które najszybciej pokazują wartość podczas demonstracji.
Czy panel działa na telefonie?
Tak, ale po instalacji trzeba sprawdzić, czy jego przycisk nie zasłania kluczowych elementów interfejsu, na przykład przycisku dodania do koszyka.
