Artykuł o WCAG 2.1

WCAG to skrótowiec od Web Content Accessibility Guidelines czyli wytycznych dotyczących dostępności treści internetowych.

Źródło z gov.pl

Wymagania dostępności cyfrowej dla podmiotów publicznych

Wszystkie strony internetowe i aplikacje mobilne podmiotów publicznych muszą być dostępne cyfrowo. Wynika to z Ustawa z 4 kwietnia 2019r. o dostępności cyfrowej stron internetowych i aplikacji mobilnych podmiotów publicznych (pdf).

Szczegóły znajdziesz w omówieniu tych wymogów dla podmiotów publicznych.

Struktura WCAG 2.1

WCAG 2.1 opiera się na 4 zasadach:

  • postrzegalność,
  • funkcjonalność,
  • zrozumiałość,
  • solidność (w polskim i unijnym prawie określana jako kompatybilność).

Wbrew pozorom zasady te nie są techniczne, a raczej zmuszające do myślenia o różnych użytkownikach, którzy np.:

  • chcą wiedzieć co jest na zdjęciu choć nie widzą,
  • nie mogą korzystać z myszy, a jedynie z klawiatury,
  • powiększają sobie widok stron lub zmienią jej kolory, żeby móc lepiej widzieć treści,
  • zmienić ustawienia przeglądarki, aby treść była bardziej czytelna

Zasady te dotyczą wszystkich elementów strony i aplikacji – kodu, treści i sposobu ich działania. Żeby je wdrożyć muszą zaangażować się wszyscy odpowiedzialni za te obszary na stronie lub w aplikacji.

Zasady WCAG 2.1 są podzielone na 13 wytycznych. Każdy wytyczna jest z kolei podzielony na określone wymagania („kryteria sukcesu”).

Zasada 1: Postrzegalność

Spraw by użytkownicy mogli korzystać ze strony internetowej lub aplikacji za pomocą dostępnych dla nich zmysłów.

Możesz to osiągnąć między innymi przez:

  • alternatywy tekstowe dla treści nietekstowych (np. opis alternatywny do zdjęć i grafik, z których skorzystają osoby niewidome),
  • transkrypcje tekstowe materiałów audio i filmów,
  • napisy i audiodeskrypcje do filmów,
  • logiczną strukturę treści (nagłówki, listy itp.),
  • odpowiednie znaczniki dla każdej funkcji (formularzy i tabel danych), aby relacje między treścią były poprawnie zdefiniowane
  • wyróżnienia, które nie opierają się jedynie na kolorze,
  • kolory tekstu, które są wyraźnie widoczne na kolorze tła,
  • czytelność i widoczność treści i funkcji gdy rozmiar tekstu zostanie zwiększony o 200%,
  • niepublikowanie obrazów tekstu,
  • responsywność – automatyczne dostosowywanie się widoku do szerokości ekranu urządzenia użytkownikami.

Zasada 2: Funkcjonalność

Spraw by użytkownicy mogli znajdować i używać treści oraz funkcji, niezależnie od tego, jak nawigują (np. za pomocą samej klawiatury, samej myszy).

Możesz to osiągnąć między innymi przez:

  • możliwość obsłużenia wszystkiego za pomocą samej klawiatury,
  • opcję odtwarzania, wstrzymywać i zatrzymywać poruszające się treści
  • brak migających treści i możliwość wyłączania ruchomych elementów przez użytkownika,
  • link pozwalający przeskoczyć szybko do treści („przejdź do treści”)
  • zrozumiałe i pasujące do treści tytuły stron,
  • zrozumiałe linki, których treść wyraźnie mówi dokąd prowadzą
  • nagłówki, które jasno opisują treści i etykiety jasno opisujące co wpisać w dane pole formularza,
  • dobrą widoczność elementu, który jest w danym momencie wybrany za pomocą klawiatury (fokus),
  • unikanie złożonych gestów na ekranach dotykowych lub zapewnienie dla nich prostszej alternatywy,
  • możliwość wyłączania i zmiany skrótów klawiaturowych.

Zasada 3: Zrozumiałość

Spraw by użytkownicy rozumieli treści i sposób działania strony lub aplikacji.

Możesz to osiągnąć między innymi przez:

  • prosty język (bez zbędnych słów i urzędniczego żargonu),
  • unikanie trudnych dla użytkowników słów i wyrażeń lub ich wyjaśnienie w prosty sposób,
  • wyjaśnienia do skrótów i akronimów,
  • określenie w kodzie strony/aplikacji w jakim języku jest jej treść,
  • spójny wygląd i działanie elementów na wszystkich podstronach,
  • widoczne i zrozumiałe etykiety przy każdym polu formularza,
  • dostępne i zrozumiałe komunikaty błędów w formularzach i podpowiedzi jak je poprawić.

Zasada 4: Solidność

W polskim i unijnym prawie ta zasada nazwana jest „kompatybilnością”. Spełnienie zasady solidności opisanej we WCAG oznacza spełnienie kompatybilności opisanej w prawie.

Spraw by treści i funkcje działały poprawnie w wielu różnych programach użytkowników (np. przeglądarkach internetowych oraz czytnikach ekranu osób niewidomych).

Możesz to osiągnąć między innymi przez:

  • prawidłowy kod, zgodny ze standardem sieciowym HTML,
  • dostępne dla użytkowników korzystających z technologii asystujących informacje o statusie/stanie,
  • zgłaszanie przez technologie asystujące pojawiających się ważnych komunikatów czy okien modalnych.

Dodatkowe materiały