Czym jest WCAG?
WCAG, czyli Web Content Accessibility Guidelines, to międzynarodowy standard opracowany przez W3C (World Wide Web Consortium). Jego celem jest zapewnienie, że strony internetowe i treści cyfrowe są dostępne dla wszystkich użytkowników, w tym osób niepełnosprawnych.
Obecna wersja, WCAG 2.1, opiera się na poprzednich wersjach i zawiera dodatkowe zalecenia dotyczące urządzeń mobilnych oraz użytkowników z zaburzeniami poznawczymi lub słabowidzących.
Cztery zasady WCAG
WCAG opiera się na czterech podstawowych zasadach, często zapamiętywanych za pomocą akronimu POUR (Perceivable, Operable, Understandable, Robust):
Postrzegalność
Informacje muszą być prezentowane w sposób, który użytkownicy mogą postrzegać, niezależnie od ich zdolności sensorycznych. Obejmuje to zapewnienie alternatywnego tekstu dla obrazów i zapewnienie dostępności treści za pomocą czytników ekranu.
Przykłady:
- Zapewnij alternatywy tekstowe dla wszelkich treści nietekstowych;
- Zapewnij alternatywną formę CAPTCHA, która wyświetla kod CAPTCHA jako dźwięk;
- Zapewnij napisy i transkrypcje, które mogą być odczytane przez czytnik ekranu, czytnik Braille’a dla audio i wideo;
- Zapewnij dodatkowe opisy audio, gdy dźwięk wideo jest niewystarczający do opisania tego, co dzieje się na ekranie;
- Używaj znaczników nagłówków, aby ustalić hierarchię treści;
- Twórz responsywne treści: użytkownicy nie powinni być zablokowani w określonym widoku, powinni mieć możliwość obracania urządzenia między orientacją poziomą i pionową;
- Zapewnij wystarczający kontrast między kolorem tekstu a tłem;
- Używaj zarówno kolorów, jak i ikon do wyświetlania komunikatów o błędach i powodzeniu;
- Dźwięk w tle powinien być o 20 decybeli cichszy niż głos mówiącego, aby nie zakłócać dialogu;
Funkcjonalność
Elementy interfejsu użytkownika i nawigacja muszą być użyteczne. Na przykład wszystkie funkcje powinny być dostępne za pomocą klawiatury, a treść powinna unikać projektów, które mogą wywoływać drgawki.
Przykłady:
- Spraw, by wszystkie funkcje były dostępne z klawiatury;
- Użytkownicy mogą otwierać i zamykać modale i wyskakujące okienka bez użycia myszy lub touchpada;
- Wszyscy odwiedzający witrynę muszą mieć wystarczająco dużo czasu na przeczytanie i wykorzystanie zawartości strony;
- Podaj komunikat ostrzegawczy, zanim użytkownik zostanie wylogowany z powodu braku aktywności;
- Daj możliwość dodania więcej czasu podczas wykonywania czynności zależnych od czasu;
- Dodaj ikony pauzy/zatrzymania do automatycznie odtwarzanej karuzeli;
- Nie projektuj treści w sposób, o którym wiadomo, że może powodować drgawki, unikaj animacji, które migają więcej niż 3 razy na sekundę;
- Zapewnij użytkownikom sposoby nawigacji, znajdowania treści i określania, kiedy się znajdują;
- Wszystkie strony powinny mieć tytuł odnoszący się do treści na stronie;
- Używaj nawigacji okruszkowej, gdy istnieje wiele poziomów zagnieżdżonych stron;
- Unikaj dwuznacznych tekstów linków, takich jak “kliknij tutaj” lub “dowiedz się więcej”;
Zrozumiałość
Treść i zachowanie interfejsu muszą być jasne i przewidywalne. Oznacza to używanie prostego języka i zapewnienie użytkownikom łatwego zrozumienia i korzystania z witryny.
Przykłady:
- Spraw, aby treść tekstowa była czytelna i zrozumiała;
- Unikaj technicznego żargonu;
- Ustaw atrybut lang na znaczniku html ( <html lang=”en”>);
- Elementy globalne, takie jak nagłówek, nawigacja i stopka są takie same na każdej stronie;
- Linki nawigacyjne są takie same na każdej stronie i zawsze w tej samej kolejności;
- Używaj spójnego języka podczas etykietowania rzeczy;
- Zapewnij etykiety dla wszystkich danych wejściowych i przykłady (symbole zastępcze), jeśli dane muszą być sformatowane w określony sposób;
- Gdy formularz zostanie wypełniony nieprawidłowo, podaj instrukcje, jak naprawić błąd;
- Podaj komunikaty o powodzeniu/błędzie po przesłaniu formularza;
- Daj użytkownikom drugą szansę na potwierdzenie lub anulowanie działania, zwłaszcza gdy jest ono nieodwracalne;
Solidność
Treść musi być niezawodnie interpretowana przez szeroką gamę urządzeń i technologii wspomagających, zarówno teraz, jak i w przyszłości.
Przykłady:
- Maksymalizuj kompatybilność z obecnymi i przyszłymi agentami użytkownika, w tym technologiami wspomagającymi;
- Pisz semantyczny, poprawny HTML;
- Użyj ARIA, aby rozszerzyć swój HTML w razie potrzeby;
- Włącz testowanie dostępności do procesu kompilacji;
13 wytycznych i 78 kryteriów sukcesu
Każda z czterech zasad zawiera kilka wytycznych – łącznie 13. Wytyczne te są wspierane przez kryteria sukcesu – konkretne, testowalne wymagania, które pomagają określić, czy strona internetowa spełnia standardy dostępności.
WCAG 2.1 zawiera 78 kryteriów sukcesu, podzielonych na trzy poziomy zgodności:
Poziom A – Podstawowe wymagania, muszą być dostosowane
Poziom AA – zalecany dla większości stron internetowych
Poziom AAA – najwyższy poziom, trudny do spełnienia dla wszystkich treści
W przypadku większości stron internetowych dążenie do zgodności z WCAG 2.1 na poziomie AA jest mocnym i realistycznym celem.
Dlaczego WCAG ma znaczenie
WCAG zapewnia ustrukturyzowane, uznane na całym świecie ramy tworzenia dostępnych treści cyfrowych. W oparciu o cztery zasady – Perceivable, Operable, Understandable i Robust – zawiera 13 wytycznych i 78 kryteriów sukcesu, które pomagają zapewnić, że Twoja witryna jest użyteczna dla wszystkich.
Przestrzeganie WCAG pomaga
- Sprawić, by strony internetowe były użyteczne dla osób z różnymi niepełnosprawnościami (wzrokowymi, ruchowymi, poznawczymi itp.)
- Poprawić ogólne wrażenia użytkownika
- Zgodność z przepisami dotyczącymi dostępności w wielu krajach
- Ulepsz SEO i przygotuj swoje treści na nowe technologie
