, ,

Pomocnik WCAG 2.0

Aplikacja mobilna Pomocnik WCAG 2.0
Pomocnik WCAG 2.0
4.9 (98%) 10 głos[ów]

Dla wszystkich śledzących nasz cykl wpisów „Kompendium WCAG 2.0”, którzy nie mogą doczekać się kolejnych części, przygotowaliśmy małą niespodziankę. W największych marketach z aplikacjami na telefony komórkowe i tablety znajdziecie 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. Pomaga zrozumieć WCAG 2.0 i zasady audytu WCAG 2.0. W aplikacji zawarliśmy m.in.:

• Pełny zapis specyfikacji WCAG 2.0, z wyjaśnieniami i komentarzami
• Pełny zapis poziomów WCAG 2.0, w ujęciu zgodnym z RRM w sprawie Krajowych Ram Interoperacyjności
• Praktyczny leksykon pomocny w prowadzeniu lub kontroli audytu WCAG 2.0
• Podręczny Słownik WGAG 2.0
• Narzędzia szybkiego przeszukiwania i katalogowania haseł

Aplikację można już pobierać, niemniej jednak zachęcamy do dalszego śledzenia cyklu poświęconego WCAG 2.0 na naszym blogu.

 

,

Kompendium WCAG 2.0: Wytyczna 2.1 Dostępność przy pomocy klawiatury

Kompendium WCAG 2.0 Zasada 2: Funkcjonalność
Kompendium WCAG 2.0: Wytyczna 2.1 Dostępność przy pomocy klawiatury
4.86 (97.14%) 7 głos[ów]

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

Kompendium WCAG 2.0: Wytyczna 1.4 Treść łatwa do rozróżnienia
Kompendium WCAG 2.0: Wytyczna 1.4 Treść łatwa do rozróżnienia
4.88 (97.5%) 8 głos[ów]

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

Kompendium WCAG 2.0: Wytyczna 1.3 Możliwość dokonania adaptacji
Kompendium WCAG 2.0: Wytyczna 1.3 Możliwość dokonania adaptacji
4.82 (96.36%) 11 głos[ów]

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: Wytyczna 1.2 Media zależne od czasu

Kompendium WCAG 2.0 - Zasada 1: Percepcja, Wytyczna 1.2 Media zależne od czasu
Kompendium WCAG 2.0: Wytyczna 1.2 Media zależne od czasu
4.9 (98%) 10 głos[ów]

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

,

Kompendium WCAG 2.0

Kompendium WCAG 2.0 - Zasada 1: Percepcja, Wytyczna 1.1 Tekst alternatywny
Kompendium WCAG 2.0
4.8 (96%) 10 głos[ów]

Dziś pierwszy odcinek naszego cyklu „Przybliżamy WCAG 2.0”. Układ kolejnych wpisów w tym cyklu jest tożsamy z samą instrukcją WCAG 2.0, tak, aby po opublikowaniu tej serii artykułów powstało swoiste, polskie kompendium wiedzy na temat WCAG 2.0.

WCAG 2.0 Zasada 1: Percepcja

Dosłowne tłumaczenie instrukcji WCAG 2.0 Guideline brzmi:

Dla każdej informacji nietekstowej zapewnij tekst alternatywny, tak aby przyjął formę zrozumiałą. Może być to np. większa czcionka, synteza mowy, symbol, czy alfabet Braille’a. Stosuj język prosty do zrozumienia.

Wytyczna 1.1 Tekst alternatywny

Pod pojęciem „tekst alternatywny” kryje się technika, dzięki której wszelkie elementy nie będące na stronie internetowej czystym tekstem (grafiki, zdjęcia, wykresy, filmy itd.) mogą być przetworzone przez oprogramowanie użytkownika kończowego i zapewnić mu komplet informacji nawet, gdy użytkownik nie ma możliwości zobaczenia elementu nietekstowego. Oznacza to bezwzględny nakaz stosowania zrozumiałego opisu elementu umieszczonego w atrybucie „alt”, jednak tylko tam, gdzie jest on potrzebny i niesie istotną, użyteczną informację. Dlaczego? Oprogramowanie wspomagające osoby niepełnosprawne, np. czytniki ekranowe, czy syntezatory mowy nie widzą np. grafiki. Umieją jednak odczytać informację tekstową zawartą w atrybucie „alt”. I stąd nacisk na „stosowanie zrozumiałego opisu umieszczonego w atrybucie alt”. Nic bowiem nie da „alt” umieszczony przy obrazku, będący nazwą pliku (co np. automatycznie wstawia większość popularnych systemów CMS): internauta niepełnosprawny usłyszy bowiem od swojego czytnika np. tekst „obraz_logo.jpg”. Mało zrozumiałe prawda? Co innego jeśli czytnik oznajmi „Obrazek przedstawiający logo Kancelarii Premiera Rady Ministrów”. Krótko rzecz ujmując w atrybucie powinien znaleźć się krótki opis szczegółów, jakie przedstawia ilustracja w zależności od kontekstu. Zawsze warto się zastanowić, co w atrybucie wpisać i czy w ogóle jest w nim potrzebna jakakolwiek informacja. Jeśli grafika pełni rolę czysto dekoracyjną, bez znaczenia dla przekazu, lepiej „alt” pozostawić pusty. Informacja typu „ramka ozdobna w kolorze brązowym” nie jest raczej potrzebna do prawidłowego odbioru strony wwww, a tylko ten odbiór zaciemnia. Jeśli natomiast opis ma być bardziej szczegółowy, obrazek może być linkiem do osobnej strony z opisem, lub opis można zamieścić sobok obrazka w postaci tekstowej.

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

,

Przybliżamy WCAG 2.0

Entera Studio WWW - Przybliżamy standard WCAG 2.0
Przybliżamy WCAG 2.0
4.75 (95%) 4 głos[ów]

Zgodnie z rozporządzeniem Rady Ministrów z dnia 12 kwietnia 2012 r. w sprawie Krajowych Ram Interoperacyjności jednostki i organy administracji publicznej oferujące ogólnodostępne systemy informatyczne mają obowiązek przystosowania swoich stron www do standardów WCAG2.0, czyli zadbania o ich dostępność dla osób niepełnosprawnych. Termin na wprowadzenie zmian wyznaczono do 2015 r. Również po tym terminie każdy nowo powstający serwis będzie musiał być dostosowany do standardu WCAG 2.0 już na etapie tworzenia, a każda większa modernizacja będzie musiała być prowadzona zgodnie z regułami dostępności. Po przeprowadzeniu setek audytów dostępności strony internetowej, bazując na doświadczeniu zyskanemu dzięki kontaktom z webmasterami i włascicielami stron postanowiliśmy na naszym blogu przybliżyć Wam standard WCAG 2.0. Przez kolejne miesiące będziemy wyjaśniać kolejne zalecenia i punkty specyfikacji, tak aby wyjaśnić skąd biorą się i dlaczego podczas budowy dostępnych stron wwww, zgodnych z WCAG 2.0, stosuje się specyficzne techniki mające na celu poprawę odbioru witryn przez osoby niepełnosprawne.

Zacznijmy od wyjaśnienia czym jest WCAG 2.0? To instrukcja dla webdesignerów, opracowana przez agendę Organizacji Narodów Zjednoczonych UNDP, dotycząca dostępności stron www dla osób niepełnosprawnych z rozmaitymi dysfunkcjami. Specyfikację tę można porównać do dokumentów opisujących zasady likwidacji barier architektonicznych w urzędach, czy szkołach – opisuje, jak budować podjazdy, windy dla wózków inwalidzkich i inne udogodnienia sprawiające, że dany obiekt staje się dostępny dla osób niepełnosprawnych, jednak w odniesieniu do strony www, czy systemu informatycznego. Stronę zgodną z WCAG 2.0 powinny prawidłowo odczytywać syntezatory mowy używane przez osoby niedowidzące i niewidome, kontrasty tekstu i czcionki muszą być na tyle duże, aby stronę www mogli odczytać ludzie o słabym wzroku, a całość musi dać się obsłużyć nie tylko myszką, ale i klawiaturą oraz innymi urządzeniami wejścia-wyjścia. Numeracja 2.0 oznacza, że jest to druga, rozszerzona i poprawiona wersja dokumentu. Obecnie specyfikacja wraz z załącznikami liczy ponad 1500 stron zaleceń.

Układ kolejnych wpisów, dodawanych systematycznie, będzie tożsamy z samą instrukcją WCAG 2.0, tak, aby po skończeniu tego cyklu powstało swoiste polskie kompendium wiedzy na temat tej agendy (sam WCAG 2.0 Guideline w oryginale rozwijany jest i publikowany w języku angielskim).

Gotowi? Zatem zaczynamy: WCAG 2.0 Zasada 1: Percepcja

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

Oświadczenie o dostępności

WCAG 2.0 jako wytyczne ONZ dla webmasterów
Oświadczenie o dostępności
4.67 (93.33%) 6 głos[ów]

Niniejszy serwis internetowy został zaprojektowany tak, aby był możliwy do obsłużenia dla jak najszerszej grupy użytkowników, niezależnie od używanej technologii, oprogramowania lub niepełnosprawności. Nieustannie poszukujemy rozwiązań aby zwiększyć dostępność i użyteczność naszej strony internetowej. Jeżeli masz jakieś uwagi albo komentarze skontaktuj się z nami.

Zgodność ze standardami

Serwis jest zgodny ze standardami W3C:
HTML 5
WCAG 2.0 (poziom AA)

Zgodność z prawem polskim i międzynarodowym

Serwis entera.pl spełnia wymagania zawarte w Rozporządzeniu Rady Ministrów Krajowe Ramy Interoperacyjności z 12 kwietnia 2012 r. Rozporządzenie to wskazuje, że od czerwca 2015 r. serwisy publiczne musza spełniać wymagania dostępności. Powołuje się ono przy tym na specyfikację Web Content Accessibility Guidelines (WCAG) w wersji 2.0 na poziomie AA.
Serwis entera.pl spełnia także zapisy dokumentów:

Deklaracja Ministrów z 11 czerwca 2006
Inicjatywa i2010
Konwencja Praw Osób Niepełnosprawnych ONZ

Kompatybilność

Serwis jest w pełni rozpoznawalny przez programy czytające dla osób niewidomych takich jak np. Window-Eyes, JAWS czy NVDA.
Pełna obsługa serwisu możliwa jest zarówno przy pomocy samej klawiatury jak i myszki.

Wygląd

Serwis jest wyposażony w mechanizmy ułatwiające przeglądanie treści przez osoby niedowidzące:

zmiana wielkości czcionki
zmiana kontrastu
całość serwisu oparta jest na stylach CSS.

Skróty klawiaturowe

Serwis nie zawiera skrótów klawiaturowych, które mogły by wchodzić w konflikt z technologiami asystującymi (np. programy czytające), systemem lub aplikacjami użytkowników.

Informacje szczegółowe dotyczące dostępności strony

Język stron serwisu jest prawidłowo określony w kodzie strony,
Tytuły stron – prawidłowo osadzone w całym serwisie; każda strona ma swój własny, unikalny tytuł, tworzony w oparciu o jeden, ustalony wzorzec.
W całym serwisie zadbano o konsekwentną nawigację
Zagwarantowana jest możliwość pominięcia bloków
Nagłówki są prawidłowo zagnieżdżone w całym serwisie.
Listy są prawidłowo użyte w całym serwisie.
Wszystkie Formularze zostały prawidłowo zbudowane i opisane
Linki są prawidłowo opisane tak by informowały o swoim celu także poza kontekstem
Linki graficzne – prawidłowo wdrożone w całym serwisie dzięki zastosowaniu linków blokowych i ustawieniu pustych tekstów alternatywnych.
Nawigacja jest spójna i logiczna w całym serwisie.
Ruch, animacje, banery – żaden element serwisu nie miga w tempie szybszym niż 3 razy na sekundę.
Fokus oraz tabindex – każdy element nawigacji ma wyraźne obramowanie na aktywnym elemencie strony, a nawigacja za pomocą klawisza Tab jest logiczna.
W całym serwisie zastosowany jest kontrast wymagany standardem WCAG 2.0 na poziomie AA
Rozdzielenie struktury i wyglądu – strony serwisu są dostępne i czytelne po wyłączeniu obsługi CSS. Brak błędów składniowych HTML.
Odtwarzacze video dostosowane są dla osób korzystających wyłącznie z klawiatury
Wszystkie elementy graficzne mają zrozumiały tekst alternatywny lub możliwość ustawienia takiego tekstu przez redaktora.
Wszystkie strony powinny mieć możliwość stosowania nagłówków w prawidłowej hierarchii.
Serwis nie jest zbudowany na bazie tabel, traktowanych jako element konstrukcji layoutu.
Wszelkie mechanizmy nawigacyjne „grupy odnośników” są przedstawione za pomocą list nieuporządkowanych.
Kolejność nawigacji oraz czytania, określona za pomocą kolejności w kodzie HTML jest logiczna i intuicyjna.
Architektura informacji jest logiczna, przejrzysta, spójna i przewidywalna.
Elementy nawigacyjne oraz komunikaty nie polegają tylko na charakterystykach zmysłowych jak np.: kształtu, lokalizacji wizualnej lub miejsca czy dźwięku.
Odnośniki zamieszczone treściach artykułów odróżniają się od pozostałego tekstu nie tylko kolorem, ale i dodatkowym wyróżnieniem np. podkreśleniem.
Po wczytaniu strony www nie jest od razu odtwarzany dźwięk.
Kontrast treści w stosunku do tła wynosi co najmniej 4,5:1.
Serwis posiada wersję kontrastową posiadającą taką samą zawartość i funkcjonalność co wersja graficzna.
Serwis jest prawidłowo wyświetlany w systemowym trybie wysokiego kontrastu (system Microsoft Windows, przeglądarka Internet Explorer).
Typografia tekstów i kontrasty są zaprojektowane pod kątem czytelności.
Po powiększeniu w przeglądarce rozmiaru czcionki do 200% nie następuje utrata zawartości lub funkcjonalności serwisu.
Treści nie są przedstawione jedynie za pomocą grafiki, jeśli ta sama prezentacja wizualna może być zaprezentowana jedynie przy użyciu tekstu. Wyjątkiem jest tekst, który jest częścią logo lub nazwy własnej produktu.
Fokus jest widoczny, wzmocniony i spełnia minimalne wymagania kontrastu.
Wszystkie informacje, które są automatycznie przesuwane i widoczne dłużej niż 5 sekund lub automatycznie się aktualizują posiadają mechanizm, który pozwala na ich zatrzymanie lub ukrycie.
Odnośniki będące częścią nawigacji jak np. rozwinięcia artykułów („więcej”, „czytaj więcej”) są uzupełnione tak, aby były zrozumiałe i jednoznacznie informowały użytkownika, dokąd go zaprowadzą lub jaką akcję wykona.
Poza standardową nawigacją zapewniona są przynajmniej dwa sposoby odnalezienia informacji jak np. mapa strony i wyszukiwarka.
Zdefiniowany jest główny język dokumentu adekwatny do wersji językowej. Mechanizm edycji treści ma możliwość definiowania języka dla poszczególnych treści zamieszczonych na podstronach (atrybut lang).
W całym serwisie mechanizmy, które powodują przy zmianie ustawień jakiegokolwiek komponentu interfejsu użytkownika, automatyczną zmianę kontekstu.
Serwis zawiera mechanizm ostrzegający o otwieraniu się wybranych stron w nowym oknie.
Wszystkie pola formularzy są opatrzone etykietami. Etykiety jednoznacznie informują o błędach lub sukcesie po ich wypełnieniu. W przypadku wystąpienia błędów system sugeruje jego rozwiązanie.
Zapewniona jest całkowita zgodność ze standardami HTML i CSS całego serwisu (zarówno szablonów, jak i kodu generowanego z edytora treści, w którym pracuje redaktor).
Serwis może zawierać technologie wymienione w dokumentach WCAG 2.0 jako wspierające dostępność jak np.: Java Script, PDF, ARIA.
W serwisie zastosowano wytyczne odnośnie strony kontrastowej przygotowanej na potrzeby osób niepełnosprawnych (np. czarne tło, żółte i białe litery).
Wszystkie teksty w alternatywnej wersji kolorystycznej mają prawidłowy kontrast
Odnośniki, które w wersji normalnej mają dobry kontrast tekstu do tła są zachowane w wersji kontrastowej
Przycisk przełączenia na wersję kontrastową jest dobrze widoczny
W wersji kontrastowej dobrze widoczny jest przycisk powrotu do pierwotnej kolorystyki.
Serwis ma możliwość powiększania czcionki, przy czym:
Przycisk powiększenia zmienia nie tylko tekst artykułu, ale również wielkość tekstu nawigacji i innych bloków treści strony
Powiększenie działa w obrębie wszystkich podstron
Przyciski powiększenia są widoczne
Przyciski powiększenia są dostępne z poziomu klawiatury.