Wyobraź sobie, że jesteś osobą niewidomą lub słabowidzącą i chciałbyś/chciałabyś zalogować się do własnego konta bankowego poprzez stronę internetową lub aplikacje mobilną. Wpisujesz hasło, wybierasz kolejne opcję, przechodzisz na następną stronę, ale w pewnym momencie nie możesz zrobić nic więcej… Nie masz dostępu do pełnej funkcjonalności aplikacji. Dlaczego?

Posiadając lub budując stronę lub aplikację internetową powinieneś pamiętać o obowiązkowych zasadach dostępności cyfrowej, czyli WCAG 2.1. Dla części podmiotów niedostosowanie strony www lub aplikacji mobilnej do poniższych standardów wiąże się nawet z karą finansową. Chcesz wiedzieć czym jest WCAG, dlaczego jest ważne oraz jaka jest jego podstawa prawna? Właśnie trafiłeś w dobre miejsce  – pełne wyjaśnienie oraz listę zaleceń dla programistów zamieściłem w tym artykule.

1.       Co to jest WCAG 2.1

Web Content Accessibility Guidelines – WCAG 2.1 to zbiór dokumentów, które zawierają zalecenia dotyczące tworzenia dostępnych dla wszystkich użytkowników serwisów internetowych. Dostępność do serwisu internetowego oznacza stopień, w jakim może on być postrzegany, rozumiany oraz przeglądany przez wszystkich użytkowników, niezależnie od ich niepełnosprawności oraz niezależnie od tego jakie właściwości posiada używane przez nich oprogramowanie oraz sprzęt. Szacując, że 1/7 całej populacji stanowią osoby z różnymi rodzajami niepełnosprawności i tylko 1/10 z nich korzysta z Internetu, to nie należy pomijać ich w  cyfrowej przestrzeni, a wspomniane wyżej rozporządzenie o dostosowaniu stron do wszystkich użytkowników, jest jak najbardziej słuszne.

2.  Normy prawne WCAG 2.1 w Polsce

Wraz z wprowadzeniem międzynarodowej normy ISO/IEC 40500:2012 (dla WCAG 2.0), od roku 2012 w Polsce obowiązuje zestaw minimalnych wymagań dla rejestrów publicznych, wymiany informacji w postaci elektronicznej oraz minimalnych wymagań dla systemów teleinformatycznych, który zobowiązuje podmioty realizujące zadania publiczne, takie jak ministerstwa, urzędy wojewódzkie, urzędy miast i gmin, policję, straż, szpitale i wiele innych instytucji publicznych do dostosowania serwisów internetowych do standardu WCAG 2.1. 4 kwietnia 2019 roku Sejm Rzeczpospolitej Polskiej uchwalił Ustawę o dostępności cyfrowych stron internetowych oraz aplikacji mobilnychktóra przewiduje nałożenie kary pieniężnej na  podmioty publiczne, które nie spełniają norm WCAG.

3.       Standard WCAG 2.1 na świecie

Ponieważ standardy WCAG są popularne i uniwersalne to zdecydowana większość krajów swoje prawodawstwo dotyczące kwestii dostępności i przeciwdziałania wykluczeniu cyfrowemu oparło właśnie na nich. W roku 2016 Parlament Europejski przyjął dyrektywę o numerze 2016/2102, według której zarówno witryny internetowe, jak i aplikacje mobilne, które są powiązane z organami i podmiotami publicznymi, muszą realizować drugi poziom kryteriów dostępności standardu, minimum na poziomie WCAG 2.0 (A i AA).

4.     WCAG 2.1 – zalecenia dla programistów

 

Zalecenia WCAG 2.1 same w sobie są bardzo zwięzłe, zawierają tylko uniwersalne zalecenia. Jednak nie zawsze można je zastosować bezpośrednio, dlatego powstały dwa dokumenty uzupełniające:

  • Understanding WCAG 2.1
  • Techniques for WCAG 2.1

Wspomniane wyżej dokumenty są bardzo obszerne (zajmują blisko tysiąc stron) – konsekwencją czego jest fakt, że wielu twórców serwisów, albo zna wytyczne WCAG 2.1 pobieżnie, albo, nie zna ich wcale. Co oznacza, że zdecydowana większość serwisów nie spełnia chociażby minimalnych wymagań, które są zawarte w dokumentacji WCAG 2.1. Dlatego, aby ułatwić pracę programistom, dla których przebrnięcie przez górę wytycznych jest prawie niemożliwe, powstają setki streszczeń WCAG 2.1, które zawierają najważniejsze wskazówki dotyczące budowy stron dostępnych dla wszystkich. Poniżej przedstawiamy kilka bardzo istotnych zaleceń, po których wdrożeniu, będziecie mieć gwarancję, że strona internetowa jest w pełni funkcjonalna i dostępna dla każdego użytkownika. Dotyczy to zarówno osób niewidomych, niedowidzących, z niepełnosprawnością ruchową, niesłyszących, z dysleksją lub różnego rodzaju dysfunkcjami intelektualnymi. Dodatkowym bonusem jest fakt, że dzięki wprowadzonym zaleceniom, serwis będzie bardziej przyjazny dla osób starszych oraz tych, które nie mają wprawy w korzystaniu z Internetu.

5.     Na co przede wszystkim należy zwrócić uwagę:

 

  • elementy graficzne powinny mieć one zwięzły tekst alternatywny (alt), który ma opisywać, co znajduje się na grafice lub w przypadku gdy grafika jest odnośnikiem, powinna być informacja, dokąd ten odnośnik prowadzi. Gdy grafika ma zadanie czysto dekoracyjne, to atrybut alt powinien zostać pusty,
  • unikaj animowanych elementów i poruszających się tekstów, ponieważ rozpraszają one wszystkich użytkowników bez wyjątku. Dodatkowo bardzo agresywne, szybkie animowane grafiki, mogą stanowić zagrożenie dla osób, które cierpią na padaczkę fotogenną,
  • odstępy w tekście, możliwość zmiany odstępu między akapitami, wierszami, słowami i literami,
  • pliki dźwiękowe, wszystkie, bez wyjątku, na przykład audycje, wywiady, czy wykładypowinny być uzupełnione o transkrypcję tekstową. Odtwarzacze zamieszczone na stronie powinny dać się obsłużyć za pomocą klawiatury i oczywiście powinny być dostępne dla osób niewidomych,
  • zawartość powinna być wyświetlana pod wskaźnikiem lub po oznaczeniu fokusem,
  • pliki multimedialne oraz Flash powinny być dostępne w postaci alternatywnej, nie jako jedyna możliwość skorzystania z funkcjonalności,
  • znakowe skróty klawiszowe,
  • powszechnie stosowane pliki dostępne do ściągnięcia takie jak na przykład PDF czy DOC, powinny mieć strukturę, która pomoże osobom niewidomym ich przeglądanie,
  • limity czasowe, czyli poinformowanie użytkownika, że brak aktywności może spowodować utratę danych,
  • teksty umieszczone na stronie powinny być napisane w jak najprostszy sposób, oczywiście w miarę możliwości, tak aby mogły je zrozumieć również osoby z niepełnosprawnością intelektualną,
  • anulowanie zdarzeń wskaźnika w przypadku omyłkowego dotknięcia elementu,
  • publikowane teksty powinny być czytelne, podzielone na paragrafy, listy, podpunkty, oraz inne pomocne sekcje, każde odpowiednio zaopatrzone w nagłówki (h1-h6), tak aby osoby niewidome mogły przejść do interesujących informacji. Dodatkowo teksty nie powinny być też justowane do prawej strony. Skróty literowe zaś powinny mieć rozwinięcie w każdym pierwszym wystąpieniu, na każdej stronie,
  • nawigacja powinna być spójna, logiczna, oraz jednakowa w obrębie całego serwisu, oczywiście nawigacja powinna być możliwa również z poziomu klawiatury,
  • dopasowanie zawartości do szerokości ekranu bez konieczności przewijania ekranu w poziomie,
  • wszystkie elementy aktywne (np. banery, odnośniki, pola formularza) powinny być wyraźne, oraz klarowne. Zaleca się wzmocnienie domyślnego focusa tak, aby również osoby niedowidzące nie miały problemu z jego odnalezieniem. Dobrym rozwiązaniem jest ramka widoczna w trakcie nawigacji po stronie klawiszem TAB,
  • orientacja, czyli wyświetlanie zawartości ekranu w orientacji pionowej i poziomej,
  • kontrast elementów nietekstowych,
  • odnośniki, wszystkie, bez wyjątku, powinny być unikalne, oraz zrozumiałe, również poza kontekstem. Nie należy używać linków typu „kliknij tutaj”, czy „więcej”. Dodatkowo odnośniki nie powinny być otwierane w nowym oknie lub zakładce przeglądarki bez ostrzeżenia,
  • gesty wskaźnikowe,
  • skip to main content” lub „skip links” to popularny odnośnik prowadzący bezpośrednio do treści pojedynczej strony. Jest to niezwykle istotne na serwisach, które mają bardzo rozbudowaną nawigację, i menu,
  • wzbudzanie ruchem,
  • kontrast kolorystyczny wszystkich elementów, bez wyjątku, których zadaniem jest przekazywanie treści (linków, tekstów, banerów) musi mieć stosunek jasności tekstu do tła co najmniej 4,5 do 1, a idealnie jest, jeżeli nie jest mniejszy niż 7 do 1,
  • rozmiar celu, tzn. wielkość minimum 44×44 pikseli CSS danego elementu, jeśli wymagane jest jego dotknięcie,
  • powiększenie strony do co najmniej 200%, przy pomocy narzędzi, które oferuje przeglądarka. Dodatkowo powiększona strona nie może „gubić” treści,
  • tytuły muszą być unikalne i powinny informować o treści podstrony, na której znajduje się użytkownik,
  • nagłówki (h1-h6) powinny być podstawowym sposobem na uporządkowanie treści, które znajdują się na stronie. Pamiętaj, że nagłówek h1 powinien być tytułem tekstu głównego na każdej podstronie,
  • listy uporządkowane oraz nieuporządkowane powinny również służyć do usystematyzowania treści w tekstach czy elementach znajdujących się w nawigacji,
  • zarówno język strony jak i język fragmentów obcojęzycznych, powinien być oznaczony atrybutem lang,
  • cytaty powinny być wyróżnione, przynajmniej przez użycie cudzysłowów,
  • kod serwisu powinien być zgodny ze standardami, nie należy korzystać z tabel jako elementu konstrukcyjnego strony,
  • tabele, których celem jest wizualizacja danych, powinny być zbudowane w możliwie jak najprostszy sposób oraz powinny posiadać nagłówki,
  • animacje stosujemy zawsze po interakcji z użytkownikiem,
  • ramki powinny być zatytułowane,
  • skrypty oraz aplety powinny być dostępne zarówno dla osób niewidomych, jak i osób, które korzystają wyłącznie z klawiatury,
  • komunikaty o statusie wszelkich akcji na stronie,
  • formularze, w tym również formularze wyszukiwarki powinny być zbudowane zgodnie ze standardami. Każde pole formularza oraz przyciski powinny być odpowiednio opisane,
  • serwis powinien być dostępny w przeglądarkach i urządzeniach z wyłączoną obsługą CSS.

Stosując się do powyższych wskazówek możemy mieć pewność, że nasza aplikacja bądź strona internetowa będzie dostępna i w pełni funkcjonalna dla znacznie szerszego grona użytkowników bez wykluczania grup osób niepełnosprawnych.

How useful was this post?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

W przypadku naruszenia Regulaminu Twój wpis zostanie usunięty.

    _Wszystkie wpisy z tej kategorii

    Third Party QA Testing z Xray

    Zatrudnianie zewnętrznych zespołów QA do weryfikacji produktu stało się powszechną praktyką – dowiedz się czym jest usługa Third Party QA Testing i jak…
    Czytaj dalej

    Od Javy do Go – skalowanie kompetencji w zespole Software Development Center

    Eksperci Transition Technologies PSC opowiadają o inicjatywie "Akademia Go" i korzyściach z nauki języka programowania Go w dostarczaniu wydajnych rozwiązań klientom. Dowiedz się,…
    Czytaj dalej

    Outsourcing programistów – elastyczny sposób skalowania zespołu IT

    Outsourcing zewnętrznego programisty zwiększa możliwości Twojego zespołu. Dodatkowy specjalista jest wsparciem w realizacji codzienny zadań i dotrzymywaniu deadline’ów. Jego obecność pozwala zwiększyć produktywność…
    Czytaj dalej

    Jak uchronić się przed phishingiem, wykorzystując autentyfikację?

    Żyjemy w epoce danych, co oznacza, że w świecie, w którym funkcjonujemy, są one cenniejsze niż pieniądze. Kradzież tożsamości i utrata istotnych danych…
    Czytaj dalej

    Co musisz wiedzieć o serverless computing?

    Serverless cmputing nadal budzi sporo wątpliwości, szczególnie wśród tych środowisk, które właśnie zaczynają korzystanie z usług chmurowych lub dopiero planują migrację do chmury…
    Czytaj dalej

    6 błędnych przekonań na temat metodologii Scrum

    6 najczęstszych mitów i błędnych przekonań dotyczących scruma. Liczymy, że ich poznanie sprawi, że skutecznie ich unikniesz.
    Czytaj dalej

    Scrum Guide 2020. 5 TOP zmian i ich wpływ na pracę zespołu

    Najnowsza aktualizacja wytycznych najpopularniejszego frameworka agile czyli Scrum Guide. Najważniejsze zmiany wprowadzone przez aktualizację Scrum Guide 2020 oraz ocena ich wpływu na codzienną…
    Czytaj dalej

    Agile. Wszystko co musisz wiedzieć o metodyce zwinnej

    Czym właściwie jest agile? Jak to się wszystko zaczęło? Jakie zasady charakteryzują tę metodykę działania, czym różni się ona od podejścia tradycyjnego i…
    Czytaj dalej

    Dostępność w sieci zgodna z WCAG i jej wpływ na wizerunek firmy

    Coraz więcej aktywności z zakresu PR i marketingu przenosi sie obecnie do internetu. To zatem dobry moment na dokładną analizę działań prowadzonych w…
    Czytaj dalej

    WCAG, czyli dlaczego warto mieć dostępną stronę internetową i aplikację mobilną

    Zastanawiałeś się kiedyś, jak korzystają ze stron internetowych osoby niewidome i niepełnosprawne? Standardowe czynności, które wykonujemy na co dzień w Internecie, są dla…
    Czytaj dalej

    Dostępność w sieci, czyli co to jest WCAG?

    Dzisiejsze społeczeństwo jest mocno zinformatyzowane. Chcemy mieć dostęp do muzyki, książek, czy filmów gdziekolwiek jesteśmy, niezależnie od tego czy czekamy w poczekalni u…
    Czytaj dalej

    Nowości w Javie

    W javie sporo się zmieniło. Od wydania najpopularniejszej jej wersji, czyli ósemki minęło już kilka dobrych lat. Cały czas wersja 8 jest tą,…
    Czytaj dalej

    Nearshoring – więcej możliwości dla Twojego biznesu

    Branża IT to jedna z najszybciej ewoluujących gałęzi biznesu. Nie tylko dzięki technologii, którą oferuje, ale też dzięki szerokiemu obszarowi usług, które jest…
    Czytaj dalej

    Jak szybko i skutecznie zbudować profesjonalny zespół programistyczny w kilku krokach – studium przypadku

    Obecne trendy w tworzeniu i dostarczaniu dedykowanego oprogramowania dla firm mocno poszły w kierunku modelu opartego o outsourcing. Jest to bardzo wygodne rozwiązanie,…
    Czytaj dalej

    FIDO – bezpieczniej czy wygodniej?

    Od dawna intensywnie pracujemy nad stworzeniem skuteczniejszych oraz bezpieczniejszych sposobów identyfikacji użytkownika niż login i hasło. Wraz z rozwojem takich technologii jak czytniki…
    Czytaj dalej

    _Zostańmy w kontakcie

    Skontaktuj się