Kompendium WCAG 2.0: Wytyczna 3.2 Przewidywalność

Buduj strony www, tak aby otwierały się i działały w sposób, który da się przewidzieć

tak brzmi zalecenie wytycznej 3.2 specyfikacji WCAG 2.0

3.2.1 Zaznaczanie elementu
Na stronie www nie powinna zaistnieć żadna zmiana kontekstu wprowadzająca w błąd lub dezorientująca użytkownika, jeśli jakikolwiek element tej strony otrzymał zaznaczenie (angielskie: focus). Nie powinno dochodzić do automatycznego przeładowywania strony, wysyłania formularzy etc. Wszystkie zmiany muszą być świadomym działaniem ze strony użytkownika.

3.2.2 Wprowadzanie danych
Nie wolno powodować automatycznej zmiany kontekstu treści podczas zmiany ustawień jakiegokolwiek elementu interfejsu przez użytkownika. Jeśli taki mechanizm jest niezbędny, należy bezwzględnie ostrzec użytkownika o takiej zmianie i to jeszcze zanim zacznie korzystać z elementu powodującego zmianę.

3.2.3 Jednolita nawigacja
Wszystkie elementy nawigacji powtarzające się na podstronach strony www, czy systemu informatycznego powinny pojawiać się w tym samym porządku za każdym razem, gdy są prezentowane. Dozwolone jest umieszczanie dodatkowych informacji pomiędzy powtarzającymi się elementami nawigacji, czy ich pomijanie w uzasadnionych sytuacjach, jednak pod warunkiem zachowania ustalonego porządku pozostałych.

3.2.4 jednolita identyfikacja
Elementy o tożsamej funkcjonalności na różnych podstronach strony www powinny być tak samo rozpoznawane. Np. formularze powinny być zawsze o tym samym wyglądzie. Takie działanie ułatwia odbiór strony użytkownikom z problemami kognitywnymi.

3.2.5 Zmiana na żądanie
Wszystkie zmiany treści i kontekstu strony www (np. pojawienie się wyskakujących okien, przekierowania, elementy wprowadzania danych) są wywoływane i prezentowane tylko na świadome życzenie użytkownika – bez wyjątku w całym serwisie.

 

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

Dla wszystkich śledzących nasz cykl wpisów „Kompendium WCAG 2.0” przygotowaliśmy także bezpłatną aplikację mobilną Pomocnik WCAG 2.0, stanowiącą uzupełnienie tego cyklu. Aplikacja kierowana jest do webmasterów i osób odpowiedzialnych w jednostkach publicznych za dostosowanie stron www do wymagań WCAG 2.0 zgodnie z Rozporządzeniem Rady Ministrów w sprawie Krajowych Ram Interoperacyjności.

 

Certyfikaty WCAG 2.0

Nawiązując do dużej ilości zadawanych nam pytań postaramy się wyjaśnić kwestę tzw. certyfikatów zgodności stron internetowych z WCAG 2.0, co ma związek z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, nakazującym instytucjom użyteczności publicznej oraz organom administracji państwowej i samorządowej dostosowanie stron www i systemów teleinformatycznych do standardu WCAG 2.0.

Już na wstępie należy podkreślić, że Polskie instytucje państwowe nie prowadzą certyfikacji zgodności stron z WCAG 2.0. Wynika to z natury samej specyfikacji WCAG 2.0, która jest tworzona i rozwijana na bieżąco przez jedną z agend ONZ. Rząd musiałaby powołać stosowny urząd kontrolny, a instytucja ta musiałaby zostać akredytowana przy W3C i ONZ. Nie istnieje zatem certyfikat zgodności z WCAG 2.0 w rozumieniu dokumentu poświadczanego przez instytucję państwową. Deklarację zgodności wystawia jednostka przeprowadzająca audyt poświadczając tym samym poziom zgodności i przyjmując na siebie za taką deklarację odpowiedzialność.

Również w przypadku prowadzonego przez nas audytu WCAG 2.0 wystawiana jest pisemna deklaracja zgodności strony z WCAG 2.0 i Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności. Strony www, które uzyskują wymagany poziom zgodności mogą ponadto posługiwać się logotypem W3C informującym o zgodności z danym poziomem WCAG 2.0. Wzory logotypów wyglądają następująco:

Logotypy zgodności z WCAG 2.0

Logotypy zgodności z WCAG 2.0

Warto także przypomnieć, że rozporządzenie nakłada obowiązek dostosowania stron www według wybranych 36 pozycji specyfikacji WCAG 2.0, pogrupowanych w 12 wymagań, według 4 zasad, w 10 punktach do poziomu AA (drugi, z trzech możliwych), w pozostałych do poziomu A. Nie jest wymagany zatem pełny audyt WCAG 2.0 i dostosowywanie stron do poziomu AAA. Ta kwestia budzi wiele wątpliwości – strony www według wspomnianego rozporządzenia muszą zostać dostosowane do poziomu AA WCAG 2.0.

Należy także pamiętać, że wspomniane rozporządzenie określa ponadto minimalne wymagania, które musi spełnić sam audyt WCAG 2.0. Wymagania te wynikają bezpośrednio ze specyfikacji WCAG 2.0 i ich niespełnienie może skutkować zakwestionowaniem audytu WCAG 2.0 przez instytucje kontrolne. Minimalnych wymagań nigdy nie spełni audyt WCAG 2.0 przeprowadzony przez jedną osobę. W audycie WCAG 2.0 bierze udział minimum 6-oosobowy zespół specjalistów – złożony nie tylko z programistów oceniających techniczną budowę kodu strony internetowej i zastosowane rozwiązania z zakresu user experience lecz również samych zainteresowanych: osób niepełnosprawnych z różnymi dysfunkcjami, do których kierowane jest rozporządzenie. Audyt powinien zostać również skontrolowany i zatwierdzony przez specjalistę ds. rehabilitacji osób niepełnosprawnych. Audyt WCAG 2.0 prowadzony bez udziału osób niepełnosprawnych nie spełnia wymagań Rozporządzenia Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, które to rozporządzenie w dużej mierze opiera się na specyfikacji WCAG 2.0. Sama specyfikacja bowiem, w swoich założeniach, przewiduje oprócz kontroli technicznych aspektów działania, dostępności i dostosowania strony internetowej, kontrolę jej faktycznego odbioru przez osoby niepełnosprawne.

 

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

Dla wszystkich śledzących nasz cykl wpisów „Kompendium WCAG 2.0” przygotowaliśmy także bezpłatną aplikację mobilną Pomocnik WCAG 2.0, stanowiącą uzupełnienie tego cyklu. Aplikacja kierowana jest do webmasterów i osób odpowiedzialnych w jednostkach publicznych za dostosowanie stron www do wymagań WCAG 2.0 zgodnie z Rozporządzeniem Rady Ministrów w sprawie Krajowych Ram Interoperacyjności.

 

Kompendium WCAG 2.0: Wytyczna 3.1 Czytelność

Treść strony www oraz obsługa interfejsu użytkownika musi być zrozumiała

tak w dosłownym przekładzie brzmi zasada 3 specyfikacji WCAG 2.0.

Wytyczna 3.1 Czytelność
Po prostu: twórz treści czytelne i łatwe do zrozumienia

3.1.1 Język strony
Język strony powinien być jasno określony za pomocą atrybutu lang lub xml:lang w znacznikach HTML. Pozwala to poprawnie wybrać interpretowany język przez urządzenia wspomagające, używane przez osoby niepełnosprawne. W praktyce chodzi głównie o syntetyzery mowy czytające strony www osobom niewidomym.

3.1.2 Język elementów
Język elementów strony powinien być jasno określony za pomocą atrybutu lang lub xml:lang w znacznikach HTML. Podobnie, jak w punkcie 3.1.1 – pozwala m.in. poprawnie określić język dla syntetyzerów mowy.

3.1.3 Nietypowe słowa
Jeśli w treści strony www użyte są skróty, należy zapewnić opisy ich znaczeń w pełnej formie.

3.1.4 Skróty
Słowa nietypowe, nieznane powszechnie, dwuznaczne, albo używane w specyficzny sposób powinny być wytłumaczone. Np. w podręcznym słowniczku dostępnym obok tekstu.

3.1.5 Poziom umiejętności czytania
Teksty, instrukcje i informacje zawierające nazwy własne, których zrozumienie wymaga wiedzy i wykształcenia wyższego, niż poziom gimnazjalny, należy uzupełniać o streszczenia, ilustracje, wykresy itp.

3.1.6 Jak to wymówić?
Jeśli do zrozumienia słowa użytego w treści strony www niezbędna jest znajomość wymowy, zaraz po użytym słowie należy zapewnić możliwość poznania wymowy tego słowa lub zamieścić odnośnik do stosownego słownika.

 

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

Dla wszystkich śledzących nasz cykl wpisów „Kompendium WCAG 2.0” przygotowaliśmy także bezpłatną aplikację mobilną Pomocnik WCAG 2.0, stanowiącą uzupełnienie tego cyklu. Aplikacja kierowana jest do webmasterów i osób odpowiedzialnych w jednostkach publicznych za dostosowanie stron www do wymagań WCAG 2.0 zgodnie z Rozporządzeniem Rady Ministrów w sprawie Krajowych Ram Interoperacyjności.

 

Kompendium WCAG 2.0: Wytyczna 2.4 Nawigacja

Ostatni już w tym roku wpis z cyklu Kompendium WCAG 2.0 – dotychczas omówiliśmy około 50% specyfikacji, tak więc zainteresowanych tematem WCAG 2.0 zapraszamy do śledzenia naszego bloga także w roku 2015. Na koniec roku 2014 Wytyczna 2.4 Nawigacja.

Przekład z WCAG 2.0 Guideline:

Udostępnij na stronie www narzędzia pomagające użytkownikom w nawigacji, dotarciu do treści i określaniu, w którym miejscu strony się aktualnie znajdują.

2.4.1 Dostęp bezpośredni
Zapewnij w nagłówku strony www – nie chodzi o sekcję head w samym kodzie, a o nagłówek strony z punktu widzenia użytkownika – menu służące do przechodzenia do istotnych treści serwisu za pomocą kotwic, bez konieczności przeładownia strony. Pomimo, _że każdy program czytający posiada skróty klawiaturowe, dzięki którym użytkownik może poruszać się po dowolnych elementach serwisu – nagłówkach, polach formularzy, akapitach, odnośnikach itd. w ten sposób ułatwisz osobom niewidomym nawigację przez możliwość pominięcia powtarzających się na kolejnych podstronach stałych elementów np. menu narzędziowe serwisu.

2.4.2 Tytuł strony
Każda podstrona strony www czy systemu informatycznego powinna być zatytułowana w sposób jednoznaczny. Tytuł strony to bowiem pierwszy tekst odczytywany przez czytniki ekranowe.

2.4.3 Kolejność zaznaczenia
Kolejność nawigacji po odnośnikach, elementach formularzy, itp. elementach musi mieć spójną i logiczną strukturę, tak, aby zapewnić mozliwie naturalne poruszanie się pomiędzy np. polami formularza. Przykład: Pole 1 – wpisz swoje imię, 2 – wpisz swoje nazwisko.

2.4.4 Cel odnośnika i jego kontekst
Określaj jednoznacznie cel wszystkich elementów aktywnych na stronie www. Linki, przyciski formularza, czy obszary aktywne map odnośników powinny być opisane konkretnie wraz z jasnym wskazaniem celu, do którego prowadzą.

2.4.5 wiele dróg
Do każdego elementu strony www można dotrzeć przynajmniej na dwa z wymienionych sposobów:

  • spis treści,
  • wyszukiwarka,
  • mapa strony,
  • lista podstron pokrewnych,
  • lista wszystkich podstron.

2.4.6 Nagłówki i etykiety
Nagłówki i etykiety muszą być opisane w sposób logiczny, sensowny i jednoznaczny, dzięki czemu użytkownikom łatwiej jest odnaleźć konkretną treść i zorientować się w strukturze strony. Nie wolno stosować podwójnych nagłówków i etykiet, zwłaszcza w elementach aktywnych, takich jak np. pola formularza.

2.4.7 Wyraźne akcentowanie zaznaczeń
Obsługując stronę www za pomocą klawiatury, użytkownik musi wiedzieć, który aktywny element strony ma wybrany. Podczas poruszania się po stronie klawiszem Tab musi być wyraźnie widoczne, który element został zaznaczony. Minimum jest niewyłączanie za pomocą atrybutu outline:none; tzw. autofokusu dostępnego w każdej przeglądarce internetowej.

2.4.8 Lokalizacja
Użytkownik zawsze musi wiedzieć, w którym miejscu strony www lub systemu informatycznego właśnie się znajduje. Należy zatem zapewnić odnośniki powrotne do stron nadrzędnych, które użytkownik przejrzał przed dotarciem do aktualnej strony. Najczęściej stosuje się ścieżkę linków, z angielskiego zwaną breadcrumbs.

2.4.9 Cel linku bez kontekstu
Zasada tożsama z wytyczną 2.4.4, jednak bardziej restrykcyjna: Określaj jednoznacznie cel wszystkich elementów aktywnych na stronie www. Linki, przyciski formularza, czy obszary aktywne map odnośników powinny być opisane konkretnie wraz z jasnym wskazaniem celu, do którego prowadzą. Nie mogą istnieć żadne odnośniki i elementy aktywne z tym samym tekstem kierujące w różne miejsca. Dobrym przykładem jest tutaj często spotykany odnośnik „Czytaj więcej” – na tym poziomie WCAG 2.0 należy go całkowicie wyeliminować.

2.4.10 Nagłówki sekcji
Punkt tożsamy z wytyczną 1.3.1, mówiącą o stosowaniu nagłówków w strukturze ogólnej strony www. Aby zapewnić poziom zgodności AAA nagłówki należy stosować w każdej sekcji każdego dokumentu podzielonego na sekcje. Np. jeśli artykuł jest podzielony na akapity, nagłówkiem należy opatrzyć część tytułową artykułu i każdy jego akapit.

 

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

Dla wszystkich śledzących nasz cykl wpisów „Kompendium WCAG 2.0” przygotowaliśmy także bezpłatną aplikację mobilną Pomocnik WCAG 2.0, stanowiącą uzupełnienie tego cyklu. Aplikacja kierowana jest do webmasterów i osób odpowiedzialnych w jednostkach publicznych za dostosowanie stron www do wymagań WCAG 2.0 zgodnie z Rozporządzeniem Rady Ministrów w sprawie Krajowych Ram Interoperacyjności.

 

Kompendium WCAG 2.0: Wytyczna 2.3 Ataki padaczki

Przekład powyższej wytycznej z WGAG 2.0 Gudieline ma następujące brzmienie:

Unikaj układania treści w formie, która mogłaby spowodować atak padaczki.

2.3.1 trzy błyski przekaz podprogowy
Błyski światła działają na układ nerwowy człowieka, co u osób z grup podwyższonego ryzyka może powodować ataki padaczki. Wprawdzie epileptycy wiedzą, że nie należy korzystać z komputera przy zgaszonym świetle, niemniej jednak instrukcja WCAG 2.0 stara się obejmować również osoby zagrożone daną przypadłością, które nie są jej jeszcze świadome. Aby zminimalizować ryzyko napadów padaczkowych nie należy tworzyć treści, które migają więcej niż 3 razy na sekundę.

2.3.2 Trzy błyski
Strona www lub system informatyczny jest całkowicie pozbawiony elementów migających z większą częstotliwością, jak trzy razy na sekundę.

 

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

Dla wszystkich śledzących nasz cykl wpisów „Kompendium WCAG 2.0” przygotowaliśmy także bezpłatną aplikację mobilną Pomocnik WCAG 2.0, stanowiącą uzupełnienie tego cyklu. Aplikacja kierowana jest do webmasterów i osób odpowiedzialnych w jednostkach publicznych za dostosowanie stron www do wymagań WCAG 2.0 zgodnie z Rozporządzeniem Rady Ministrów w sprawie Krajowych Ram Interoperacyjności.

 

Kompendium WCAG 2.0, Wytyczna 2.2 Wystarczająca ilość czasu

Dosłowny przekład instrukcji WCAG 2.0 Guideline brzmi:

Zapewnij użytkownikom wystarczającą ilość czasu do spokojnego przeczytania, interpretacji i przetworzenia treści.

2.2.1 Możliwość ustawienia ilości czasu – WCAG 2.0 poziom A

Zapewnij użytkownikom taką ilość czasu na wykonanie czynności, jakiej potrzebują, bez nagłego zmieniania treści w wyniku nałożonego limitu czasowego. Jeśli strona www lub system teleinformatyczny ma limit czasu na wykonanie określonej czynności należy zapewnić opcję wyłączenia lub zwiększenia tego limitu. Wytycznej tej nie podlegają zdarzenia na stronie www zachodzące w czasie rzeczywistym, gdzie limit czasu stanowi funkcjonalność serwisu. Dobrym przykładem będzie tu aukcja internetowa.

2.2.2 Przerwa, stop, schowaj – WCAG 2.0 poziom A

Wszystkie treści informacyjne automatycznie przewijane, przesuwane, migające, widoczne dłużej jak 5 sekund, a jednocześnie prezentowane równolegle z inną treścią muszą być możliwe do zatrzymania, wyłączenia lub ukrycia. Wyjątek jest dopuszczalny w sytuacji, kiedy przesuwanie lub miganie treści jest nieodzowną częścią wykonywanej czynności, np. animacja widoczna w czasie wczytywania treści. Wówczas jej zatrzymanie mogłoby wprowadzić użytkownika w błąd, sugerując przerwanie wczytywania. Dopuszczalne jest użycie elementów ruchu, migania lub przewijania w celu zwrócenia uwagi użytkownika lub wyróżnienia treści, jeśli nie trwają dłużej, niż 3 sekundy.

2.2.3 Bez limitu czasu – WCAG 2.0 poziom AAA

Zapewnij użytkownikom tyle czasu ile potrzebują na wykonanie każdego zadania na stronie www lub w systemie teleinformatycznym. Na tym poziomie WCAG 2.0, na stronie www nie występują żadne limity czasu.

2.2.4 Brak zakłóceń – WCAG 2.0 poziom AAA

Na stronie www lub w systemie teleinformatycznym istnieje możliwość odłożenia w czasie lub wyłączenia wszystkich komunikatów, informacji itp. elementów, mogących rozpraszać użytkownika i przeszkadzać w trakcie korzystania ze strony w każdym jej elemencie i funkcjonalności. Wyjątkiem są sytuacje, takie jak użyteczne, pilne alarmy np. przypomnienia zadefiniowane przez samego użytkownika o ważnym terminie lub spodziewane potwierdzenia w czasie wprowadzania zmian.

2.2.5 Ponowne potwierdzenie autentyczności – WCAG 2.0 poziom AAA

Gdy kończy się czas sesji użytkownika (np. po zalogowaniu do portalu) i system poprosi o ponowną autoryzację, użytkownik będzie móg kontynuować czynności bez utraty danych z aktualnie otwartej strony.

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

Dla wszystkich śledzących nasz cykl wpisów „Kompendium WCAG 2.0” przygotowaliśmy także bezpłatną aplikację mobilną Pomocnik WCAG 2.0, stanowiącą uzupełnienie tego cyklu. Aplikacja kierowana jest do webmasterów i osób odpowiedzialnych w jednostkach publicznych za dostosowanie stron www do wymagań WCAG 2.0 zgodnie z Rozporządzeniem Rady Ministrów w sprawie Krajowych Ram Interoperacyjności.

 

Kompendium WCAG 2.0 Zasada 2: Funkcjonalność

Przedstawiliśmy Wam już zasadę 1 WCAG: Percepcja. Czas na poznanie zasady 2: Funkcjonalność. Zatem zaczynamy 🙂
Dosłowne tłumaczenie z instrukcji WCAG 2.0 Guideline brzmi:

Zadbaj, aby cała funkcjonalność strony www była możliwa do obsłużenia za pomocą klawiatury.

2.1.1 Klawiatura – WCAG 2.0 poziom A

Każdy element strony www, czy systemu teleinformatycznego i każda oferowana przez nie funkcjonalność musi być dostępna i możliwa do obsłużenia tylko przy pomocy klawiatury. Wyjątek mogą stanowić tylko te elementy, które nie mogą być wykonane klawiaturą ze swej natury (np. oprogramowanie do rysowania odręcznego palcem na ekranie dotykowym).
Użyte na stronie skróty klawiaturowe nie powinny wchodzić w konflikty ze skrótami używanymi w przeglądarkach internetowych i czytnikach ekranu. Specyfikacja WCAG 2.0 nie zaleca jednak stosowania własnych skrótów klawiaturowych, chociaż ich nie wyklucza.

Spełnienie powyższej wytycznej ma kluczowe znaczenie dla użytkowników niewidomych, korzystających tylko z klawiatury i użytkowników z zaburzeniami koordynacji ruchowej stosujących rozmaite manipulatory manualne do obsługi komputera.

Ponadto zalecane jest, by zwrócić szczególną uwagę na wykonywanie zdarzeń typu: onclick, onmouseover, czyli po kliknięciu i po najechaniu myszką. Zwłaszcza dotyczy to najazdu wskaźnika na element i podwójnego kliknięcia. Jeśli jakaś ważna z punktu widzenia funkcjonalności serwisu funkcja będzie wykonywana po podwójnym kliknięciu lub po najechaniu myszką, funkcja ta może stać się niedostępna dla użytkowników korzystających wyłącznie z klawiatury lub manipulatora dotykowego. Nie ma bowiem jak wykonać podwójnego kliknięcia klawiaturą, a na ekranie dotykowym nie można na element najechać wskaźnikiem, gdyż automatycznie ten element zostaje „kliknięty” dotknięciem.

2.1.2 Niezablokowana klawiatura – WCAG 2.0 poziom A

Użytkownik powinien móc nawigować po wszystkich elementach strony www lub systemu teleinformatycznego przy użyciu wyłącznie klawiatury. Niedopuszczalna jest sytuacja, w której najpierw należy wykonać akcję myszką, aby przejść do elementu aktywnego obsługiwanego klawiaturą.

2.1.3 Wyłącznie klawiatura – WCAG 2.0 poziom AAA

Cała funkcjonalność strony www lub systemu teleinformatycznego, w 100 procentach musi być dostępna wyłącznie z klawiatury.

 

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

 

Kompendium WCAG 2.0: Wytyczna 1.4 Treść łatwa do rozróżnienia

Przekład z instrukcji WCAG 2.0 Guideline brzmi:

Ułatw użytkownikom oglądanie i słuchanie treści poprzez oddzielenie pierwszego planu (informacji istotnej) od tła (informacji drugorzędnej).

1.4.1 Użycie koloru – WCAG 2.0 poziom A

Nie stosuj koloru jako jedynego wyróżnienia przekazywanych treści i do rozróżniania elementów wizualnych. Dlaczego? Wyobraź sobie, że osoba niewidząca kolorów lub niewidoma wypełnia formularz rejestracyjny na stronie www, a w owym formularzu niewypełnione pola wymagane zmieniają kolor na niebieski i jest to jedyne wyróżnienie, że dane pole jest obowiązkowe. Użytkownik nie odbierający informacji przekazywanej kolorem nie będzie w stanie wypełnić formularza jeśli pominie pole wymagane. Możesz naturalnie użyć wyróżnienia kolorem, jeśli obok dopiszesz prostą informację „Pole wymagane”.

1.4.2 Kontrola dźwięku – WCAG 2.0 poziom A

Zapewnij możliwość spauzowania, wyłączenia, wyciszenia lub zmienienia głośności dźwięków automatycznie odtwarzanych na stronie. Użytkownikom niewidomym dźwięki odtwarzane na stronie www nakładają się na głos lektora płynący z czytnika ekranowego.

1.4.3 Minimalny kontrast – WCAG 2.0 poziom AA

Kontrast pomiędzy treścią tekstową strony www (dotyczy to także grafik z zawartością tekstową), a tłem strony powinien wynosić co najmniej 4,5:1. Specyfikacja WCAG 2.0 umożliwia odstępstwo od tej wytycznej tylko w następujących wypadkach:

– teksty pisane dużą czcionką – 14 punktów dla koloru czarnego i 18 punktów dla kolorów pozostałych – mogą mieć kontrast w stosunku minimum 3:1.
– teksty będące częścią logotypów i znaków handlowych są wyłączone z wymagań minimalnych dotyczących kontrastu.
– wymagań dotyczących kontrastu nie muszą spełniać teksty i grafiki z zawartością tekstu będące nieaktywnymi fragmentami interfejsu użytkownika, pełnią rolę czysto dekoracyjną, są częścią obrazka lub zdjęcia.

Jeżeli nie można zapewnić wymaganego kontrastu np. z powodu konieczności utrzymania identyfikacji wizualnej właściciela strony należy wprowadzić przełączniki zmieniające wyświetlanie serwisu w trybie wysokiego kontrastu (w praktyce oznacza to zazwyczaj przełączenie szablonu graficznego lub dynamiczną zmianę arkusza stylu CSS). Wymagane jest, aby kontrolki zmiany kontrastu same w sobie spełniały wymagania stosunku kontrastu 4,5:1 . Wersja strony www o wysokim kontraście musi posiadać taką samą zawartość i funkcjonalność, jak wersja podstawowa serwisu.

1.4.4 Zmiana rozmiaru tekstu – WCAG 2.0 poziom AA

Tekst na stronie www musi dać się powiększyć o 200% bez utraty czytelności, zawartości i funkcjonalności strony.
Niedopuszczalne jest np. obcinanie fragmentów tekstu, zmiana położenia pól formularzy, czy ich wychodzenie poza krawędzie przeglądarki, itd.

Nie jest to wprawdzie wymagane, jednak specyfikacja WCAG 2.0 zaleca zapewnienie na stronie www kontrolek umożliwiających stopniowe powiększanie rozmiaru czcionki. Wprowadzenie tych zaleceń ułatwia odbiór serwisu nie tylko osobom niedowidzącym, ale także pełnosprawnym mającym ograniczoną percepcję wizualną, np. starszym.

1.4.5 Grafiki tekstowe – WCAG 2.0 poziom AA

Do przedstawiania tekstu na stronie www nie należy używać grafiki, jeśli ta sama informacja może być zaprezentowana tylko przy użyciu tekstu. Np. zamiast umieszczania obrazka z zaproszeniem na jakieś wydarzenie, na którym to obrazku będzie napisana data i miejsce tego wydarzenia, można zamieścić tekst: „zapraszamy na wydarzenie, które odbędzie się dnia tego, a tego, tu i tu” lub przynajmniej umieścić ten teks obok grafiki. Wyjątek od tej wytycznej stanowią teksty będące częścią logo, znaku towarowego lub nazwy własnej produktu.

1.4.6 Kontrast podwyższony – WCAG 2.0 poziom AAA

Wytyczna ta jest tożsama z wytyczną 1.4.3, z tą różnicą, że współczynnik kontrastu pomiędzy tekstem lub grafikami tekstowymi na stronie www, a tłem powinien być w stosunku 7:1.
Z wytycznej wyłączone są:
– teksty pisane dużą czcionką – 14 punktów dla koloru czarnego i 18 punktów dla kolorów pozostałych – mogą mieć kontrast w stosunku minimum 3:1.
– teksty będące częścią logotypów i znaków handlowych są wyłączone z wymagań minimalnych dotyczących kontrastu.
– wymagań dotyczących kontrastu nie muszą spełniać teksty i grafiki z zawartością tekstu będące nieaktywnymi fragmentami interfejsu użytkownika, pełnią rolę czysto dekoracyjną, są częścią obrazka lub zdjęcia.

1.4.7 Brak treści audio w tle strony lub niska głośność tła – WCAG 2.0 poziom AAA

Dla następujących rodzajów plików dźwiękowych publikowanych na stronie internetowej, które zawierają głównie mowę, nie są zabezpieczeniami antyspamowymi w postaci dźwiękowej, nie są oczekiwanymi przez użytkownika utworami muzycznymi, należy spełnić przynajmniej jedno z założeń:
– nagranie audio nie posiada tła dźwiękowego utrudniającego odbiór,
– dźwięki w tle mogą zostać wyłączone przez użytkownika,
– dźwięki w tle są co najmniej czterokrotnie cichsze, niż głośność mowy będącej treścią nagrania. Wyjątkowo można używać krótkich dźwięków ilustracyjnych, nie dłuższych jednak, niż 2 sekundy.

1.4.8 Prezentacja wizualna – WCAG 2.0 poziom AAA

Tekst na stronie www trzeba formatować tak, aby użytkownicy z problemami poznawczymi, mający trudności w uczeniu się, wady wzroku, itp. nie odczuwali problemów z jego odczytaniem.
Zalecane są następujące działania i mechanizmy dla bloków tekstu:
– możliwość wybierania przez użytkownika kolorów na pierwszym planie oraz kolorów tła,
– szerokość bloku tekstu nie przekracza 80 znaków,
– tekst niejustowany,
– interlinia wynosi przynajmniej 150%, odstęp między paragrafami 1,5 razy wartości interlinii.
– rozmiar tekstu może zostać powiększony do 200% bez używania technologii wspomagających, nie wymagając od użytkownika przesuwania tekstu horyzontalnie przy widoku w pełnym oknie – nie trzeba używać przewijania poziomego, aby przeczytać blok tekstu.

1.4.9 Grafiki tekstowe wyeliminowane całkowicie – WCAG 2.0 poziom AAA

Nie używaj grafik tekstowych do przekazania jakiejkolwiek informacji. Dopuszczalne są jedynie jako dekoracje, lub gdy informacja nie może zostać przekazana w inny sposób, np. z powodów prawnych: gdy tekst jest częścią znaku towarowego lub logo.

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

Kompendium WCAG 2.0: Wytyczna 1.3 Możliwość dokonania adaptacji

Dosłowne tłumaczenie instrukcji WCAG 2.0 Guideline ma postać:

Publikuj treści z możliwością prezentacji w różny sposób i w różnym układzie bez utraty informacji, czy struktury.

1.3.1 Informacje i jej związki – WCAG 2.0 poziom A

– Unikaj tworzenia layoutu strony www opartego o tabele.
– Stosuj nagłówki w hierarchii ważności dbając o sematyczność układu treści.
– Stosuj tytuły i nagłówki do informacji zawartych w tabelach, jeśli ich używasz.
– Dodawaj etykiety opisowe przy polach formularzy.
– Buduj menu jako listę.

Wbrew intensywnemu rozwojowi internetowych multimediów, podstawowym sposobem przekazywania informacji na stronie internetowej jest treść w formie tekstu. Warto zatem dbać, aby znaczniki HTML używane do formatowania tekstu zapewniły logiczną strukturę przekazywanych informacji. W tym miejscu uwaga do webmasterów: wprawdzie łatwo formatować tekst stosując znaczniki formatujące pogrubienia b, podkreślenia u, czy kursywy i, tylko po co, skoro w kaskadowych stylach CSS można zmienić wygląd każdego elementu strony www? I na dokładkę zrobić to raz dla całej strony w sposób jednolity. Znacznie szybszym i bardziej spójnym sposobem z punktu widzenia semantyki kodu jest stosowanie najzwyklejszych znaczników stylowanych w CSS: strong, h1 h2 table label itd. Pozwala to równie efektywnie sformatować treść na stronie, a ma pewną zaletę: programy czytające tzw. czytniki ekranu, używane przez osoby niewidome i niedowidzące, interpretują prawidłowo znaczniki semantyczne, co umożliwia poprawne odczytanie treści strony. Znaczniki formatujące HTML b u i są przez czytniki zazwyczaj pomijane, zatem najlepiej wogóle ich nie używać. Czytniki działają bowiem podobnie do przeglądarki tekstowej, takiej jak Lynx. Znacznik np. b przez Lynxa zostanie pominięty, tekst oznaczony znacznikiem np. strong będzie wyróżniony kolorem.

1.3.2 Zrozumiała kolejność – WCAG 2.0 poziom A

Dbaj o kolejność nawigacji i czytania treści bezpośrednio w kodzie HTML, PHP, czy innym narzędziu bazowym, którego używasz. Nie projektuj układu treści w stylach CSS. Jeśli zaprojektujesz układ treści w arkuszach styli, w normalnej przeglądarce, takiej jak FireFox, czy Internet Explorer, wizualnie na stronie wszystko będzie OK. Jeśli jednak wyłączysz stylowanie CSS cała zawartość strony stanie się niezrozumiała, gdyż elementy, których położenie określał CSS zmienią swoje miejsce. Większość czytników ekranu wyłącza stylowanie CSS, ponieważ osobom niewidomym estetyka strony jest do niczego potrzebna.

1.3.3 Charakterystyki zmysłowe – WCAG 2.0 poziom A

Unikaj na stronie www projektowania nawigacji zależnej od tzw. komponentów zmysłowych. Tzn. nie używaj do nawigacji elementów nietekstowych, które nie mogą być opisane poprawnie w tekście alternatywnym umieszczonym w znaczniku „alt”. Jak myślisz, czy osoba niewidoma jest w stanie wykonać taką instrukcję: „aby przejść do menu głównego kliknij ikonę w kształcie okręgu”, gdy owa ikona nie jest opisana w sposób zrozumiały dla jej czytnika ekranu? Zatem nie projektuj nawigacji opartej na charakterystykach zmysłowych – instrukcje i komunikaty nie mogą zależeć od kształtu (patrz przykład z ikoną w kształcie okręgu), lokalizacji wizualnej miejsca (np. opis znajdziesz w lewej kolumnie tabeli po prawej stronie) i dźwięku (np. gdy usłyszysz gong, będziesz mógł przejść dalej).

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0

Kompendium WCAG 2.0 - Zasada 1: Percepcja, Wytyczna 1.2 Media zależne od czasu

Kolejny odcinek naszego cyklu „Przybliżamy WCAG 2.0″. Przypominamy, że układ kolejnych wpisów w tym cyklu jest tożsamy z samą instrukcją WCAG 2.0 – aby zawęzić kryteria wyszukiwania i ułatwić odbiór dla osób zainteresowanych wyłącznie tą tematyką, czy hasłem audyt WCAG 2.0, stworzyliśmy nową kategorię bloga: Kompendium WCAG 2.0, gdzie znajdą się wpisy tylko z tego cyklu.

W omawianej dziś wytycznej znajduje się kilka podwytycznych, mających wpływ na osiągany poziom zgodności strony www z WCAG 2.0. Jak zapewne pamiętacie, stopni zgodności są trzy: A, AA oraz AAA, gdzie AAA oznacza najwyższą możliwą dostępność strony. Przy każdej podwytycznej zaznaczyliśmy do jakiego stopnia zgodności instrukcja WCAG 2.0 zalicza jej wdrożenie. Ma to praktyczne znaczenie dla osób zainteresowanych tematyką audytu WCAG 2.0 wymaganego prawem UE. Dla przypomnienia – w Polsce poziom zgodności musi osiągnąć stopień AA.

Zasada 1: Percepcja, Wytyczna 1.2 Media zależne od czasu

Dosłowny przekład instrukcji WCAG 2.0 Guideline brzmi:

Należy zapewnić alternatywę dla wszystkich mediów zależnych od czasu.

1.2.1 Tylko nagranie dźwiękowe lub tylko film wideo – WCAG 2.0 poziom A
Przy wszystkich materiałach dźwiękowych i wideo (nie dotyczy streamingu, czyli przekazu na żywo) na stronie www, czy w systemie teleinformatycznym należy opublikować transkrypcję opisową nagranego dźwięku. Dotyczy to plików mp3, podcastów itp. Transkrypcja zapewnia dostęp do informacji użytkownikom niesłyszącym. Podobnie przy materiałach wideo należy zapewnić dodatkowy opis: dla wideo, które nie zawiera ścieżki dźwiękowej – dźwiękowy i tekstowy, dla wideo zawierającego ścieżkę dźwiękową – tekstowy, aby osoby niewidome i niesłyszące także miały dostęp do prezentowanej informacji.

1.2.2 Napisy w nagraniu – WCAG 2.0 poziom A
Wszystkie materiały wideo publikowane na stronie www, takie ja np. film z YouTube, powinny zostać wzbogacone o napisy z dialogami oraz napisy opisujące istotne dla treści i odbioru wideo informacje dźwiękowe. Np. na ekranie nie widać zamykanych drzwi, jednak słychać trzaśnięcie drzwiami. Widz o normalnej percepcji wie, że ktoś wyszedł z pomieszczenia, gdyż słyszał odgłos zamykanych drzwi. Osoba niesłysząca jest tej informacji pozbawiona, zatem w napisach powinien pojawić się opis: „słychać trzaśnięcie drzwiami”.

1.2.3 Audiodeskrypcje, zamiennie treści alternatywne multimediów – WCAG 2.0 poziom A
Dla mediów zmiennych w czasie należy zapewnić alternatywę, dla nagrań wideo w multimediach zsynchronizowanych należy zapewnić audiodeskrypcję.
Mówiąc prościej – dla każdej zawartości multimedialnej (np. film), należy zapewnić opis alternatywny niosący tą samą informację, co zastępowana treść multimedialna – np. tekstowy opis filmu (akcja, dialogi, kontekst) dla osób, które filmu nie obejrzą i nie usłyszą, np. osoby niesłyszącej i niewidomej. Wytyczna ta dotyczy także wszelkich interaktywnych elementów strony: formularzy, pól wyboru itp. – każdy z nich powinien zawierać przynajmniej deskrypcję audio.

1.2.4 Napisy w transmisjach i multimediach transmitowanych na żywo – WCAG 2.0 poziom AA
Każdą treść multimedialną, udostępnianą na stronie www w formie transmisji na żywo (wideokonferencje, webcasty, konferencje audio itp.) trzeba uzupełnić o napisy zsynchronizowane z dźwiękiem.

1.2.5 Audiodeskrypcje w nagraniach – WCAG 2.0 poziom AA
Dla każdego materiału wideo na stronie www należy zapewnić ścieżkę audio z lektorem opisującym wideo dla osób niewidomych. Użytkownicy niewidomi powinni móc włączyć ścieżkę audio z nagraniem lektorskim opisującym treść wideo z dodatkowymi informacjami, skupiającymi się na działaniach, postaciach, zmianach scen, które są ważne dla zrozumienia treści wideo. W skrócie mówiąc: tekstowy opis filmu (akcja, dialogi, kontekst).

1.2.6 Język migowy w nagraniach – WCAG 2.0 poziom AAA
Każdą treść multimedialną, która posiada dźwięk, należy wzbogacić w przekład tłumacza na język migowy.

1.2.7 Audiodeskrypcja poszerzona – WCAG 2.0 poziom AAA
Jeśli nie ma możliwości dodania ścieżki z audiodeskrypcją do oryginalnego materiału wideo z powodu niemożliwości synchronizacji ścieżki dźwiękowej, należy udostępnić wersję alternatywną tego wideo z audiodeskrypcją, np. wideo tylko z audiodeskrypcją pozbawione oryginalnej ścieżki dźwiękowej.

1.2.8 Alternatywy dla multimediów – WCAG 2.0 poziom AAA
Wszystkie treści multimedialne ze ścieżką wideo na stronie www muszą posiadać alternatywę w postaci transkrypcji opisowej.

1.2.9 Tylko dźwięk w przekazie na żywo – WCAG 2.0 poziom AAA
Dla każdej treści dźwiękowej prezentowanej na żywo trzeba zapewnić alternatywę z transkrypcją opisową. Przykładem może być np. transmisja opery: obok okienka z transmisją ze sceny powinien pojawić się scenariusz przedstawienia lub odnośnik do scenariusza.

Jeśli interesuje Państwa audyt WCAG 2.0 zgodny z Rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności, zachęcamy do zapoznania się z metodyką prowadzonego przez nas audytu dostępności stron www zgodnego z tym rozporządzeniem, dostępną pod tym odnośnikiem: Audyt WCAG 2.0