WCAG – Zasada 2: Funkcjonalność

Dostępność cyfrowa to nie tylko kwestia wizualna, ale także funkcjonalna. Nawet najlepiej zaprojektowana strona internetowa traci swoją wartość, jeśli użytkownicy nie mogą jej wygodnie obsługiwać. Właśnie dlatego w wytycznych WCAG (Web Content Accessibility Guidelines) druga zasada nosi nazwę Funkcjonalność. Jej głównym celem jest zapewnienie, że każdy użytkownik – niezależnie od swoich ograniczeń – może skutecznie nawigować i korzystać z treści cyfrowych.

Zasada ta koncentruje się na dostępności interakcji użytkownika z witryną. Oznacza to, że serwis internetowy powinien być łatwy w obsłudze zarówno za pomocą klawiatury, jak i innych technologii asystujących. Nawigacja powinna być przewidywalna, a użytkownicy nie mogą utknąć w miejscu bez możliwości powrotu lub wykonania zamierzonej akcji.

Składa się z pięciu wytycznych, z których każda zawiera różne kryteria sukcesu o różnym poziomie zgodności (A, AA, AAA).

Ta wytyczna podkreśla fundamentalną zasadę dostępności: wszystkie funkcje treści powinny być dostępne za pomocą interfejsu klawiatury. Nie oznacza to zakazu stosowania innych metod wprowadzania danych, takich jak mysz, ale gwarantuje, że osoby, które nie mogą lub nie chcą korzystać z myszy, nadal będą w stanie w pełni korzystać ze strony.

Kryteria sukcesu powiązane z tą zasadą to:

Wszystkie funkcje na stronie powinny działać za pomocą samej klawiatury, bez konieczności naciskania klawiszy w określonym czasie. Wyjątkiem są sytuacje, gdy dana funkcja wymaga ruchu użytkownika, a nie tylko kliknięcia w określone miejsce.

Ważne jest, że wyjątek dotyczy samej funkcji, a nie sposobu jej obsługi. Na przykład pisanie odręczne wymaga ruchu ręką, ale jego głównym celem jest wprowadzenie tekstu – co można zrobić także na klawiaturze. Warto zapewnić inne sposoby obsługi, takie jak mysz, ale nie powinno to być konieczne do korzystania z treści.

Jeśli fokus klawiatury można przenieść do danego komponentu strony za pomocą interfejsu klawiatury, to musi istnieć możliwość przeniesienia fokusu z tego komponentu za pomocą wyłącznie interfejsu klawiatury. Jeśli do opuszczenia komponentu wymagane są inne metody niż standardowe klawisze strzałek lub tabulator, użytkownik musi zostać o tym poinformowany. Niespełnienie tego kryterium może uniemożliwić korzystanie z całej strony, dlatego dotyczy ono całej treści na stronie, niezależnie od tego, czy jest używana do spełnienia innych kryteriów sukcesu.

Wszystkie funkcje treści muszą być operatywne za pomocą interfejsu klawiatury bez konieczności stosowania określonych czasów na poszczególne naciśnięcia klawiszy. Jest to bardziej rygorystyczna wersja kryterium 2.1.1, eliminująca wszelkie wyjątki.

Jeśli w treści zaimplementowano skrót klawiszowy używający tylko liter (małych i wielkich), znaków interpunkcyjnych, cyfr lub symboli, to przynajmniej jedna z poniższych musi być prawdziwa:

• Wyłączenie: Dostępny jest mechanizm umożliwiający wyłączenie skrótu.
• Zmiana przypisania: Dostępny jest mechanizm umożliwiający zmianę przypisania skrótu tak, aby zawierał jeden lub więcej niedrukowalnych klawiszy (np. Ctrl, Alt).
• Aktywny tylko przy fokusie: Skrót klawiszowy dla komponentu interfejsu użytkownika jest aktywny tylko wtedy, gdy ten komponent ma fokus.

Ta wytyczna ma na celu zapewnienie, że użytkownicy mają wystarczająco dużo czasu na przeczytanie i skorzystanie z treści. Limity czasowe mogą stanowić barierę dla osób z niepełnosprawnościami poznawczymi, wolniejszym tempem pracy lub korzystających z technologii wspomagających.

Kryteria sukcesu powiązane z tą wytyczną to:

Gdy czas korzystania z treści jest ograniczony, przynajmniej jeden z poniższych warunków musi być spełniony:

• Wyłączenie: Użytkownik może wyłączyć limit czasu przed jego upływem.
• Regulacja: Użytkownik może dostosować limit czasu przed jego upływem w szerokim zakresie, co najmniej dziesięciokrotnie dłuższym od ustawienia domyślnego.
• Przedłużenie: Użytkownik jest ostrzegany przed upływem czasu i ma co najmniej 20 sekund na przedłużenie limitu prostą akcją (np. naciśnięcie spacji), a limit można przedłużyć co najmniej dziesięciokrotnie.
• Wyjątek czasu rzeczywistego: Limit czasu jest niezbędną częścią zdarzenia w czasie rzeczywistym (np. aukcja) i nie ma możliwości alternatywnej.
• Wyjątek niezbędny: Limit czasu jest niezbędny, a jego przedłużenie unieważniłoby działanie.
• Wyjątek 20 godzin: Limit czasu jest dłuższy niż 20 godzin.

To kryterium sukcesu pomaga zapewnić, że użytkownicy mogą wykonywać zadania bez nieoczekiwanych zmian treści lub kontekstu wynikających z limitu czasu. Należy je rozpatrywać łącznie z Kryterium sukcesu 3.2.1, które ogranicza zmiany treści lub kontekstu w wyniku działań użytkownika. 

Dla informacji ruchomych, migających, przewijanych lub automatycznie aktualizowanych, muszą być spełnione wszystkie poniższe warunki:

• Ruchome, migające, przewijane: Dla wszelkich informacji, które (1) uruchamiają się automatycznie, (2) trwają dłużej niż pięć sekund i (3) są prezentowane równolegle z inną treścią, musi istnieć mechanizm umożliwiający użytkownikowi wstrzymanie, zatrzymanie lub ukrycie ich, chyba że ruch, miganie lub przewijanie jest niezbędną częścią danej aktywności.
• Automatycznie aktualizowane: Dla wszelkich automatycznie aktualizowanych informacji, które (1) uruchamiają się automatycznie i (2) są prezentowane równolegle z inną treścią, musi istnieć mechanizm umożliwiający użytkownikowi wstrzymanie, zatrzymanie lub ukrycie ich, lub kontrolowanie częstotliwości aktualizacji, chyba że automatyczna aktualizacja jest niezbędną częścią danej aktywności.

Wymagania dotyczące migotania lub błyskania znajdują się w Wytycznej 2.3. Niespełnienie tego kryterium może utrudniać korzystanie z całej strony. Treści aktualizowane okresowo przez oprogramowanie lub przesyłane strumieniowo nie muszą zachowywać ani prezentować informacji wygenerowanych lub odebranych między wstrzymaniem a wznowieniem prezentacji. Animacja w fazie ładowania może być uznana za niezbędną, jeśli interakcja nie jest możliwa i brak wskazania postępu mógłby dezorientować użytkowników.

Czas nie powinien ograniczać użytkownika podczas korzystania z treści, chyba że chodzi o transmisję na żywo, nagranie wideo z dźwiękiem lub inne wydarzenie odbywające się w czasie rzeczywistym.

Przerwania mogą być odroczone lub pominięte przez użytkownika, z wyjątkiem sytuacji awaryjnych.

Po wygaśnięciu uwierzytelnionej sesji, użytkownik może kontynuować aktywność bez utraty danych po ponownym uwierzytelnieniu. Należy pamiętać o przepisach dotyczących prywatności dotyczących zgody użytkownika na przechowywanie danych.

Użytkownicy są ostrzegani o czasie trwania bezczynności, która może spowodować utratę danych, chyba że dane są przechowywane przez ponad 20 godzin bez żadnej akcji ze strony użytkownika.

Celem tej wytycznej jest unikanie projektowania treści w sposób, który może powodować napady lub inne reakcje fizyczne. Treści migoczące lub błyskające w określonych częstotliwościach mogą być niebezpieczne dla osób z epilepsją fotogenną.

Kryteria sukcesu powiązane z tą wytyczną to:

Strony internetowe nie mogą zawierać niczego, co błyska więcej niż trzy razy w ciągu jednej sekundy, lub błysk jest poniżej ogólnych i czerwonych progów błysku. Niespełnienie tego kryterium może uniemożliwić korzystanie z całej strony.

Strony internetowe nie mogą zawierać niczego, co błyska więcej niż trzy razy w ciągu jednej sekundy. Jest to bardziej rygorystyczna wersja kryterium 2.3.1.

Animacja ruchu wywołana interakcją może zostać wyłączona, chyba że animacja jest niezbędna dla funkcjonalności lub przekazywanych informacji.

Ta wytyczna koncentruje się na zapewnieniu użytkownikom sposobów na nawigowanie, znajdowanie treści i orientowanie się, gdzie się znajdują. Jasna i spójna nawigacja jest kluczowa dla wszystkich użytkowników, a w szczególności dla osób korzystających z technologii wspomagających.

Kryteria sukcesu powiązane z tą wytyczną to:

Dostępny jest mechanizm umożliwiający pomijanie bloków treści powtarzających się na wielu stronach internetowych. Może to obejmować linki „Przejdź do treści głównej”.

Każda strona internetowa posiada tytuł opisujący jej temat lub cel.

Jeśli użytkownik przechodzi przez stronę krok po kroku, a kolejność jest ważna dla jej działania lub zrozumienia, elementy powinny być aktywowane w logicznej i przewidywalnej kolejności.

Każdy link powinien jasno wskazywać, dokąd prowadzi – albo samym tekstem, albo razem z otaczającą go treścią, chyba że jego znaczenie jest oczywiste dla wszystkich użytkowników.

Użytkownicy powinni mieć więcej niż jeden sposób na znalezienie danej strony na stronie internetowej, na przykład przez menu, wyszukiwarkę lub mapę witryny. Wyjątkiem są strony, które są częścią konkretnego procesu, np. formularz zamówienia.

Nagłówki i etykiety opisują temat lub cel. Powinny być jasne i przekazywać informacje.

Jeśli użytkownik korzysta z klawiatury do obsługi strony, powinien widzieć, który element jest aktualnie zaznaczony (czyli ma fokus).

Dostępne są informacje o lokalizacji użytkownika w obrębie zestawu stron internetowych. Może to obejmować ścieżkę nawigacji (breadcrumb).

Każdy link powinien jasno wskazywać, dokąd prowadzi, na podstawie samego tekstu. Wyjątkiem są sytuacje, gdy cel linku jest oczywisty dla wszystkich użytkowników.

Treści na stronie powinny być uporządkowane za pomocą nagłówków. Mogą to być tytuły lub inne elementy, które pomagają podzielić tekst na czytelne sekcje. Dotyczy to głównie treści tekstowych, a nie elementów interfejsu użytkownika, które są objęte Kryterium sukcesu 4.1.2.

Jeśli jakiś element na stronie zostaje zaznaczony klawiaturą (np. przycisk lub pole formularza), nie może być całkowicie zasłonięty przez inne treści. Jeśli jednak użytkownik sam otworzy okno, które chwilowo zakryje ten element, ale może je łatwo zamknąć bez utraty zaznaczenia, to nie jest to problem. W przypadku interfejsów, które można dostosować, liczy się ich początkowy układ.

Jeśli jakiś element na stronie zostanie zaznaczony klawiaturą, nie może być zasłonięty przez inne treści dodane na stronie.

Gdy element na stronie zostaje zaznaczony klawiaturą (np. poprzez naciśnięcie klawisza Tab), jego obramowanie musi być:

• Dobrze widoczne – powinno mieć grubość co najmniej 2 pikseli.
• Kontrastowe – różnica między kolorem obramowania w stanie zaznaczonym i niezaznaczonym musi wynosić co najmniej 3:1, aby łatwo było je zauważyć.

Jeśli przeglądarka sama określa wygląd wskaźnika fokusu i nie pozwala go zmienić, te zasady nie obowiązują.

Celem tej wytycznej jest ułatwienie użytkownikom obsługiwania funkcjonalności za pomocą różnych metod wprowadzania danych, poza klawiaturą.

Kryteria sukcesu powiązane z tą wytyczną to:

Jeśli na stronie internetowej są funkcje wymagające gestów wielopunktowych (np. uszczypnięcie dwoma palcami do powiększenia) lub rysowania określonej ścieżki, powinny one również działać za pomocą prostego kliknięcia, dotknięcia lub innej pojedynczej akcji. Wyjątek stanowią sytuacje, gdy taki gest jest naprawdę niezbędny do działania funkcji.

Jeśli jakaś funkcja na stronie działa po kliknięciu, dotknięciu lub innym pojedynczym wskaźniku, musi spełniać przynajmniej jeden z tych warunków:

• Nie używa akcji „down” – czyli nie wykonuje żadnej części funkcji od razu po naciśnięciu, ale dopiero po puszczeniu.
• Można ją zatrzymać lub cofnąć – użytkownik może anulować akcję przed jej zakończeniem lub cofnąć ją po wykonaniu.
• Odwraca działanie – jeśli coś zmienia się po naciśnięciu, to po puszczeniu wszystko wraca do poprzedniego stanu.
• Jest niezbędna – jeśli funkcja musi działać od razu po naciśnięciu (np. klikanie klawisza klawiatury), to ten warunek nie obowiązuje.

To zasada dotycząca stron internetowych, które interpretują kliknięcia i dotknięcia użytkownika.

Jeśli przycisk, pole formularza lub inny element interfejsu ma etykietę z tekstem lub obrazem zawierającym tekst, to jego nazwa powinna zawierać ten sam tekst, który widzi użytkownik. Najlepiej, aby nazwa zaczynała się od tego samego tekstu, co etykieta widoczna na ekranie.

Funkcjonalność, która może być obsługiwana przez ruch urządzenia lub ruch użytkownika, może być również obsługiwana przez komponenty interfejsu użytkownika, a reagowanie na ruch można wyłączyć, aby zapobiec przypadkowej aktywacji, z wyjątkiem sytuacji, gdy:

• Obsługiwany interfejs: Ruch jest używany do obsługi funkcjonalności za pomocą interfejsu wspieranego przez ułatwienia dostępu.
• Niezbędne: Ruch jest niezbędny do funkcji, a jego pominięcie unieważniłoby działanie.

Rozmiar docelowy dla danych wprowadzanych za pomocą wskaźnika wynosi co najmniej 44 na 44 piksele CSS, z wyjątkiem sytuacji, gdy:

• Równoważne: Docelowy element jest dostępny za pomocą równoważnego łącza lub kontrolki na tej samej stronie, która ma co najmniej 44 na 44 piksele CSS.
• Wbudowane: Docelowy element znajduje się w zdaniu lub bloku tekstu.
• Kontrola przeglądarki: Rozmiar docelowego elementu jest określany przez przeglądarkę i nie jest modyfikowany przez autora.
• Niezbędne: Szczególna prezentacja docelowego elementu jest niezbędna do przekazywanej informacji

Treści internetowe nie ograniczają użycia metod wprowadzania danych dostępnych na platformie, z wyjątkiem sytuacji, gdy ograniczenie jest niezbędne, wymagane w celu zapewnienia bezpieczeństwa treści lub wymagane w celu poszanowania ustawień użytkownika

Cała funkcjonalność, która wykorzystuje ruch przeciągania do działania, może być osiągnięta za pomocą pojedynczego wskaźnika bez przeciągania, chyba że przeciąganie jest niezbędne lub funkcjonalność jest określana przez przeglądarkę i nie jest modyfikowana przez autora. Notatka wyjaśnia, że to wymaganie dotyczy treści internetowych, które interpretują działania wskaźnika

Elementy, na które użytkownik klika lub dotyka (np. przyciski, linki), powinny mieć co najmniej 24×24 piksele, aby były łatwe do trafienia. Są jednak wyjątki:

• Odstępy – jeśli mniejsze elementy są odpowiednio oddalone od siebie, żeby nie nakładały się na inne, mogą być mniejsze.
• Równoważne opcje – jeśli ta sama funkcja jest dostępna przez większy przycisk w innym miejscu na stronie, mniejszy może pozostać.
• Wbudowane w tekst – jeśli przycisk lub link znajduje się w zdaniu, może mieć mniejszy rozmiar.
• Decyzja przeglądarki – jeśli przeglądarka sama ustala rozmiar elementu, autor strony nie musi go zmieniać.
• Konieczność – jeśli element musi być mniejszy ze względu na prawo lub specyficzny sposób działania, może pozostać w takiej formie.

Funkcjonalność to kluczowy element dostępności cyfrowej, który gwarantuje, że każdy użytkownik może skutecznie korzystać z interaktywnych elementów strony. Poprzez zadbanie o dostępność klawiaturową, odpowiednią nawigację, brak migających elementów i wystarczający czas na reakcję, można stworzyć środowisko cyfrowe przyjazne dla wszystkich.

Przestrzeganie wyżej wymienionych kryteriów sukcesu przyczynia się do tworzenia bardziej inkluzywnych i użytecznych stron internetowych. W przyszłym tygodniu opiszę kolejną zasadę WCAG – Zrozumiałości.