Kryteria dostępności standardu WCAG 2.1 AA
Poziom | Wersja | Kryterium sukcesu | Opis | Kategoria |
---|---|---|---|---|
A | 2.0 | 1.1.1 Treść nietekstowa | Sprawdzenie czy elementy <img> mają poprawny opis alternatywny. | Zawartość |
A | 2.0 | 1.1.1 Treść nietekstowa | Skomplikowane opisy opisowe elementów <img> są dostarczane obok obrazu lub na oddzielnej stronie. | Zawartość |
A | 2.0 | 1.1.1 Treść nietekstowa | Elementy kontrolne mają nazwę dostępną opisującą ich cel. | KontrolkiFormularze |
A | 2.0 | 1.1.1 Treść nietekstowa | Dostarcza się dwie różne modalności CAPTCHA lub dostęp do człowieka w celu pominięcia CAPTCHA lub nie wymaga się CAPTCHA dla użytkowników upoważnionych. | Zawartość |
A | 2.0 | 1.1.1 Treść nietekstowa | Tekstowa alternatywa jest dostarczana dla wykresów i grafik. | Zawartość |
A | 2.0 | 1.1.1 Treść nietekstowa | Nieprawidłowy test lub ćwiczenie przedstawione przez obraz ma identyfikację tekstową opisującą zawartość nietekstową. | Zawartość |
A | 2.0 | 1.2.1 Tylko audio lub tylko wideo | Film bez dialogu ma łatwo dostępny tekst lub opis audio tego, co dzieje się wizualnie. Sprawdzenie czy film posiada tekstową transkrypcję. | Audio i video |
A | 2.0 | 1.2.1 Tylko audio lub tylko wideo | Nagrania audio posiadaja tekstową transkrypcję. | Audio i video |
A | 2.0 | 1.2.2 Napisy rozszerzone | Wideo jest dostarczane z synchronizowanymi napisami dialogu oraz informacji niesłownych, w tym znaczących efektów dźwiękowych. | Audio i video |
A | 2.0 | 1.2.3 Audiodeskrypcja lub alternatywa dla mediów | Film zawierający kluczowe informacje przekazywane wizualnie jest dostarczany z łatwo dostępną pełną alternatywą tekstową opisującą ważne szczegóły wizualne lub jest dostarczana ścieżka opisu audio. | Audio i video |
AA | 2.0 | 1.2.4 Napisy (na żywo) | Treść na żywo ma synchronizowane napisy oparte na tekście. | Audio i video |
AA | 2.0 | 1.2.5 Audiodeskrypcja (nagranie) | Wideo zawierające kluczowe informacje przekazywane wizualnie ma synchronizowany opis audio. | Audio i video |
A | 2.0 | 1.3.1 Informacja i relacje | Elementy są używane zgodnie ze swoją semantyką, a nie wyglądem. | Zawartość |
A | 2.0 | 1.3.1 Informacja i relacje | Tabele danych mają komórki nagłówka utworzone przy użyciu elementu <th>. | Zawartość |
A | 2.0 | 1.3.1 Informacja i relacje | Tabele danych mają krótki opis zawartości. |
Zawartość |
A | 2.0 | 1.3.1 Informacja i relacje | Etykiety są programowo powiązane z elementami kontrolnymi za pomocą <label>, aria-labelledby, aria-label. | Formularze |
A | 2.0 | 1.3.1 Informacja i relacje | Dodatkowe informacje wejściowe są oznaczone programowo. | Formularze |
A | 2.0 | 1.3.1 Informacja i relacje | Dwa lub więcej przycisków radio lub kontrolki typu checkbox są grupowane przy użyciu <fieldset> i <fieldset> ma skrótowy element <legend>. | Zawartość |
A | 2.0 | 1.3.1 Informacja i relacje | Nagłówki są oznaczone przy użyciu elementów nagłówków. | Zawartość |
A | 2.0 | 1.3.1 Informacja i relacje | Listy są oznaczone programowo przy użyciu elementów <ul>, <ol>, <dl>. | Zawartość |
A | 2.0 | 1.3.1 Informacja i relacje | Sprawdzenie czy na stronie sią Landmarki i są prawidłowe
stosowane. |
Struktura |
A | 2.0 | 1.3.2 Zrozumiała kolejność | Kolejność czytania i nawigacji jest logiczna i intuicyjna. | Struktura |
A | 2.0 | 1.3.3 Właściwości zmysłowe | Sprawdzenie czy instrukcje na stronie nie zależą od
zmysłów (kształtu, dźwięku). |
Zawartość |
AA | 2.1 | 1.3.4 Orientacja | Sprawdzenie czy strona wyświetla się w układzie
pionowym i poziomym, chyba że jest to konieczne dla
funkcjonalności. |
Struktura |
AA | 2.1 | 1.3.5 Określenie pożądanej wartości | Sprawdzenie czy pola formularza takie jak Imię, Nazwisko, E-mail posiadają atrybut autocomplete. | Formularze |
A | 2.0 | 1.4.1 Użycie koloru | Sprawdzenie czy odnośniki w sekcji głównej są odpowiednio
wyróżnione. Powinny być za pomocą dwóch sposobów np. kolorem i
podkreśleniem. |
Kolor |
A | 2.0 | 1.4.1 Użycie koloru | Kontrast koloru linku jest co najmniej 3:1 i posiada dodatkowy efekt nie-koloru podczas najechania lub gdy jest w fokusie. | Kolor |
A | 2.0 | 1.4.2 Audio Control | Istnieje mechanizm do zatrzymania, wstrzymania, wyciszenia lub regulacji dźwięku, który trwa dłużej niż 3 sekundy | Audio i video |
AA | 2.0 | 1.4.3 Kontrast (minimalny) | Sprawdzeczenie, czy tekst mniejszy niż 24 piksele i niepogrubiony ma minimum współczynnik kontrastu 4,5:1 z kolorem tła | CzcionkaStrukturaKolor |
AA | 2.0 | 1.4.3 Kontrast (minimalny) | Sprawdzenie, czy tekst mniejszy niż 18,6 pikseli i pogrubiony ma minimum współczynnik kontrastu 4,5:1 z kolorem tła. | CzcionkaStrukturaKolor |
AA | 2.0 | 1.4.4 Zmiana rozmiaru tekstu | Wszystkie treści są dostępne przy powiększeniu widoku
przeglądarki do 200%. |
CzcionkaStruktura |
AA | 2.0 | 1.4.5 Obrazy zawierające tekst | Sprawdzenie czy na stronie znajdują się ilustracje przedstawiające tekst (nie posiadające opisu alternatywnego). | Zawartość |
AA | 2.1 | 1.4.10 Dopasowanie do ekranu | Brak pasków przewijania
poziomego wyświetlanych na urządzeniach mobilnych
o niskiej rozdzielczości. |
Struktura |
AA | 2.1 | 1.4.11 Kontrast elementów nietekstowych | Sprawdzenie czy elementy nietekstowe takie jak np. ikonki, obramowania formularzy mają odpowiedni kontrast. | KolorFormularze i UI |
AA | 2.1 | 1.4.11 Kontrast elementów nietekstowych | Wizualny stan aktywnego elementu sterującego musi mieć minimum 3:1 kontrastu z kolorem obok. | Kolor |
AA | 2.1 | 1.4.11 Kontrast elementów nietekstowych | Części grafiki wymagane do zrozumienia treści mają minimum 3:1 kontrastu z kolorem obok. | Kolor |
AA | 2.1 | 1.4.12 Odstępy w tekście | Brak utraty treści i funkcjonalności, w przypadku gdy
zostanie zastosowany atrybut text-spacing. |
Struktura |
AA | 2.1 | 1.4.13 Treść spod kursora lub fokusa | Dodatkowa zawartość wywołana po najechaniu myszką lub ustawieniu kursora na element może zostać zamknięta bez przesuwania myszki lub kursora i, jeśli dodatkowa zawartość jest wywołana po najechaniu myszką, wskaźnik myszy może być przesunięty na dodatkową zawartość bez jej zniknięcia i, dodatkowa zawartość pozostaje widoczna, dopóki nie zostanie usunięte najechanie lub kursor lub użytkownik ją zamknie. | Dynamiczne treściKlawiatura |
A | 2.0 | 2.1.1 Klawiatura | Każda funkcjonalność musi być dostępna z klawiatury i, skróty i klawisze dostępu nie kolidują ze skrótami przeglądarki lub technologii wspomagającej. | KontrolkiFormularzeKlawiatura |
A | 2.0 | 2.1.2 Brak pułapki na klawiaturę | Kursor nie jest uwięziony na elemencie strony i, możliwe jest nawigowanie do i od wszystkich interaktywnych elementów za pomocą tylko klawiatury. | Klawiatura |
A | 2.1 | 2.1.4 Skróty klawiaturowe | Skróty klawiszy znaków można wyłączyć lub, skróty klawiszy znaków można ponownie mapować lub, skróty klawiszy znaków są aktywne tylko wtedy, gdy odpowiedni element interfejsu użytkownika jest aktywny. | Klawiatura |
A | 2.0 | 2.2.1 Możliwość dostosowania czasu | Limity czasowe strony mają opcję wyłączenia, dostosowania lub przedłużenia limitu czasowego. | Dynamiczne treści |
A | 2.0 | 2.2.2 Wstrzymywanie, ukrywanie, zatrzymywanie | Treść, która porusza się, miga lub przewija automatycznie musi być możliwa do zatrzymania, zatrzymania lub ukrycia. | Dynamiczne treści |
A | 2.0 | 2.3.1 Trzy błyski lub wartości poniżej progu | Zawartość strony nie powinna migać więcej niż 3 razy na sekundę. | Dynamiczne treści |
A | 2.0 | 2.4.1 Możliwość pominięcia bloków | Są dostępne linki umożliwiające pominięcie elementów
(skiplinki), które powtarzają się na wielu stronach lub, dostarczona jest właściwa struktura nagłówków lub, są dostępne znaczniki aria/HTML5 |
Struktura |
A | 2.0 | 2.4.1 Możliwość pominięcia bloków | Ramki iframe mają opisywanie, informatywne lub unikalne tytuły. | Struktura |
A | 2.0 | 2.4.2 Tytuły stron | Strona posiada prawidłowy tytuł, adekwatny do
zawartości. |
Struktura |
A | 2.0 | 2.4.3 Kolejność fokusa | Kolejność nawigacji pomiędzy linkami, elementami formularza i interaktywnymi komponentami jest logiczna. | Struktura |
A | 2.0 | 2.4.4 Cel linku | Każdy link jest zrozumiały tylko z
wyświetlanego tekstu lub, każdy link jest zrozumiały z bezpośredniego otoczenia zawartości. Sprawdzenie czy odnośniki otwierajace się w nowej karcie przeglądarki posiadają etykietę informującą o tym fakcie. Sprawdzenie czy łącza do plików posiadaja informację o typi plików i rozmiarze np. PDF 2MB |
ZawartośćOdnośniki |
AA | 2.0 | 2.4.5 Wiele dróg | Sprawdzenie czy na stronie znajduje się mapa strony
lub/i wyszukiwarka. |
Zawartość |
AA | 2.0 | 2.4.6 Nagłówki i etykiety | Etykiety dla formularzy i kontrolek interaktywnych są poprawne. | KontrolkiFormularze |
AA | 2.0 | 2.4.6 Nagłówki i etykiety | Sprawdzenie czy na stronie są puste nagłówki oraz puste etykiety na stronie. | Struktura |
AA | 2.0 | 2.4.7 Widoczny fokus | Sprawdzenie czy fokus na stronie
jest widoczny i spełnia zasady minimalnego kontrastu. |
KontrolkiFormularze |
A | 2.1 | 2.5.1 Gesty wskazujące | Funkcjonalność oparta na ścieżce z wieloma punktami może być uruchamiana za pomocą pojedynczych działań. | Kontrolki |
A | 2.1 | 2.5.2 Anulowanie wskazania | Funkcjonalność uruchamiana pojedynczym kliknięciem myszy
nie używa zdarzenia w dół lub, funkcjonalność może zostać cofnięta lub, zdarzenie w górę cofa działanie zdarzenia w dół lub, zdarzenie w dół jest niezbędne dla funkcji (np. klawiatura na ekranie). |
Kontrolki |
A | 2.1 | 2.5.3 Etykieta w nazwie | Elementy interfejsu użytkownika, które zawierają widoczną etykietę, mają odpowiadające im pełne (lub częściowe) dostępne nazwy. | KontrolkiFormularze |
A | 2.1 | 2.5.4 Aktywowanie ruchem | Funkcjonalność wyzwalana przez ruch lub gest użytkownika
może być wyłączona i, funkcjonalność może być obsługiwana bez ruchu urządzenia lub gestów użytkownika |
Struktura |
A | 2.0 | 3.1.1 Język strony | Każda strona posiada atrybut <lang> |
Struktura |
AA | 2.0 | 3.1.2 Język części | Zawartość w języku innym niż domyślny dla strony jest
identyfikowana za pomocą atrybutu języka <lang> |
Struktura |
A | 2.0 | 3.2.1 Po oznaczeniu fokusem | Gdy element otrzymuje fokus, nie powoduje żadnej zmiany
po stronie. |
Formularze |
A | 2.0 | 3.2.2 Podczas wprowadzania danych | Wprowadzone dane przez użytkownika nie powoduje istotnej zmiany na stronie. | Formularze |
AA | 2.0 | 3.2.3 Konsekwentna nawigacja | Powtarzające się wzorce nawigacji stosowane są w tym samym względnym porządku na wszystkich stronach. | Struktura |
AA | 2.0 | 3.2.4 Konsekwetna identyfikacja | Elementy o tej samej funkcjonalności stosowane są jednolicie na wielu stronach. | Struktura |
A | 2.0 | 3.3.1 Identyfikacja błędu. | Intuicyjne powiadomienia tekstowe są udostępniane dla wskaźników walidacji formularzy i błędów. | Formularze |
A | 2.0 | 3.3.2 Etykiety lub instrukcje | Etykieta tekstowa (niekoniecznie element etykiety) jest dostarczana dla pól formularza. | Formularze |
A | 2.0 | 3.3.2 Sugestie korekty błędów | Dla pól formularza dostarczone są wystarczające instrukcje. | Formularze |
A | 2.0 | 3.3.2 Sugestie korekty błędów | Dla wymaganych pól formularza dostarczona jest etykieta tekstowa (niekoniecznie element etykiety), instrukcje lub komunikat błędu. | Formularze |
AA | 2.0 | 3.3.3 Sugestie korekty błędów | Wszystkie błędy wykryte po stronie klienta dostarczają sugestie dotyczące naprawy błędów. | Formularze |
AA | 2.0 | 3.3.3 Sugestie korekty błędów | Wszystkie błędy wykryte po stronie klienta są dostarczane w dostępny sposób. | Formularze |
AA | 2.0 | 3.3.4 Zapobieganie błędom (kontekst prawny, finansowy) | Istnieje mechanizm do cofania błędów prawnych, finansowych lub transakcji danych, lub istnieje mechanizm do przeglądania i poprawiania błędów prawnych, finansowych lub transakcji danych. | Zawartość |
A | 2.0 | 4.1.1 Parsowanie | W trakcie parsowania przez W3C validator i stosowania zakładki parsowania nie zidentyfikowano żadnych błędów | Struktura |
A | 2.0 | 4.1.2 Nazwa, rola, wartość | Elementy interfejsu użytkownika są używane zgodnie z ich specyfikacją lub niestandardowe kontrolki są zgodne z https://www.w3.org/TR/wai-aria-practices-1.1/ | KontrolkiFormularze |
A | 2.0 | 4.1.2 Nazwa, rola, wartość | Dla wszystkich składników interfejsu użytkownika istnieje programowa nazwa, rola i wartość. | KontrolkiFormularze |
AA | 2.1 | 4.1.3 Komunikaty o stanie | Wszystkie komunikaty o powodzeniu lub rezultacie działania aktualizowane po stronie klienta używają roli=status | KontrolkiDynamiczne treści |
AA | 2.1 | 4.1.3 Komunikaty o stanie | Wszystkie komunikaty o błędach lub ostrzeżeniach aktualizowane po stronie klienta używają roli=alert | KontrolkiDynamiczne treści |
AA | 2.1 | 4.1.3 Komunikaty o stanie | Wszystkie komunikaty dziennika lub postępu aktualizowane po stronie klienta używają roli=log | KontrolkiDynamiczne treści |