(ilość głosów: 10, średnia: 4,60 na 5)
Ładowanie...Osoby niepełnosprawne jako użytkownicy internetu
W grudniu 2021 roku GUS podał, że w Polsce żyje 2,3 mln osób z orzeczeniem o niepełnosprawności, stopniu niepełnosprawności lub stopniu niezdolności do pracy. Oczywiście nie są to dane oddające realną liczbę osób, które na co dzień potrzebują dostępności w różnych obszarach swojego życia. Jak czytamy na stronie Biura Pełnomocnika Rządu do Spraw Osób Niepełnosprawnych, w 2011 roku
„[…] prawne orzeczenie o niepełnosprawności lub równoważne posiadało prawie 3,8 mln Polaków (w tym blisko 194 tys. dzieci do lat 16 z aktualnym orzeczeniem o niepełnosprawności), tj. o około 0,3 mln osób więcej w porównaniu z szacunkami z badania BAEL w tym samym okresie.”
Z kolei na stronie GOV przeczytamy, że „w Polsce osób z niepełnosprawnościami, które mają prawne potwierdzenie niepełnosprawności, jest ponad 3 mln. W rzeczywistości jest ich dużo więcej – od 4 do 7 mln.”
Ale odejdźmy na moment od liczb, bo nieważne, czy osób, które szczególnie skorzystają z ułatwień dostępu do treści na Twojej stronie, będzie 3, 4 czy 7 milionów – dostosowanie stron do osób z niepełnosprawnościami jest absolutną podstawą. Według badania opublikowanego przez Ewę Migaczewską i Tomasza Maslyka z centrum badań Polscy Niepełnosprawni przy AGH w 2013 roku osoby niepełnosprawne stanowiły aż 33% użytkowników sieci. To nie jest jedna, dwie czy trzy osoby. Dlaczego więc, mimo rosnącej świadomości o UX, strony internetowe wciąż nie są dostosowane do potrzeb osób niepełnosprawnych?
Często wynika to z niewiedzy. Po prostu. Dlatego stworzyliśmy ten artykuł, aby podpowiedzieć Ci, co zrobić, aby dostosować stronę internetową do potrzeb osób niepełnosprawnych. Najpierw trzeba ich poznać i dowiedzieć się, w jaki sposób korzystają z sieci.
Jak osoby niepełnosprawne korzystają z sieci?
Przykładowo: osoby niewidome korzystają z desktopowych przeglądarek czytających kod takich jak Webbie. Niektóre przeglądarki, takie jak Firefox, udostępniają narzędzia pozwalające im poruszać się po sieci.
Ale to jest dopiero początek wyzwań, z których w ogóle nie zdajemy sobie sprawy. Mamy w końcu w społeczeństwie osoby neuroróżnorodne, z dysfunkcjami poznawczymi, epilepsją czy nadwrażliwością słuchową. Warto o nich pamiętać, projektując stronę. I, zanim zaczniesz wątpić – tak, da się przygotować strony internetowe zgodne z zasadami dostępności, które będą świetnie wyglądać i jeszcze lepiej sprzedawać.
Tematem dostępności stron internetowych zajmują się takie organizacje jak World Wide Web Consortium, które opublikowało Web Content Accessibility Guidelines, czy polska Fundacja Widzialni.
A co deweloperzy i specjaliści SEO mogą zrobić, by dostosować stronę www dla niepełnosprawnych?
Dostosowanie strony internetowej do potrzeb osób niepełnosprawnych A WCAG 2.2
O tym, co należy dostosować do niepełnosprawnych użytkowników i jak tworzyć dostępne dla wszystkich serwisy internetowe, mówią zasady WCAG 2.2, czyli Web Content Accessibility Guidelines. Zostały określone przez Web Accessibility Initiative, czyli inicjatywę W3C i mają status międzynarodowej normy ISO. Wyznaczają podstawowe kwestie, które trzeba przemyśleć, budując stronę. Stąd z kolei wynikają konkretne optymalizacje, których przykłady podam dalej.
Zasady WCAG 2.2
Cztery podstawowe zasady dostępności według WCAG to kolejno: percepcja, funkcjonalność, zrozumiałość i rzetelność.
By wypełnić zasadę percepcji, należy przedstawić użytkownikom informacje na stronie i elementy interfejsu w dostępny dla nich sposób. Funkcjonalność oznacza, że elementy interfejsu i nawigacji muszą być użyteczne – każdy z nich powinien mieć przypisaną rolę i powodować konkretną akcję, pojawiać się w jakimś określonym celu. Zrozumiałość, jak łatwo się domyślić, znaczy, że zamieszczona treść powinna być dla użytkownika łatwo przyswajalna, a obsługa interfejsu intuicyjna. Wreszcie aby strona/aplikacja była rzetelna, musi być rzeczowo, merytorycznie i poprawnie technicznie opracowana, tak by mogła być właściwie interpretowana zarówno przez użytkowników, jak i przez technologie, z których korzystają.
Najprościej mówiąc, zasady WCAG 2.2 wymuszają na projektujących strony i aplikacje konkretnych, przemyślanych i celowych zadań, prostych i praktycznych rozwiązań i nastawienia na określoną funkcję, którą dany serwis ma pełnić.
Czym różni się WCAG 2.2 od WCAG 2.0?
WCAG 2.2 jest bardziej kompleksowym i aktualnym zestawem wytycznych dotyczących dostępności stron internetowych niż WCAG 2.0.
Nowe kryteria
WCAG 2.2 zawiera 9 dodatkowych kryteriów sukcesu, które obejmują m.in.:
- Dostępność do treści w czasie rzeczywistym. Kryteria te dotyczą m.in. napisów na żywo dla transmisji wideo i czatów na żywo.
- Ułatwienia dla osób z dysfunkcjami poznawczymi. Kryteria te dotyczą m.in. uproszczenia języka i nawigacji strony.
- Dostępność dla osób z nadwrażliwością słuchową. Kryteria te dotyczą m.in. możliwości wyłączenia automatycznie odtwarzanych dźwięków.
WCAG 2.2 uaktualnia też niektóre kryteria z WCAG 2.0, dzięki czemu uwzględnia nowe technologie i trendy.
Poziomy zgodności
WCAG 2.2 wprowadza trzy poziomy zgodności: A, AA i AAA. Poziomy te określają, w jakim stopniu strona internetowa spełnia kryteria sukcesu WCAG.
Inne zmiany
- Nowe techniki – WCAG 2.2 zawiera nowe techniki, które pomagają w spełnieniu kryteriów sukcesu.
- Ulepszona dokumentacja – Dokumentacja WCAG 2.2 została ulepszona, aby była bardziej przejrzysta.
Dostosowanie strony internetowej do WCAG 2.2 sprwi, że będzie ona dostępna dla szerszego grona użytkowników, w tym dla osób niepełnosprawnych.
Optymalizacje strony zgodne WCAG 2.2, które możesz wykonać na swojej stronie
Poniżej opiszemy 5 konkretnych aspektów, które należy dopracować, by stworzyć stronę zoptymalizowaną pod kątem potrzeb osób niepełnosprawnych: niewidomych i niedowidzących. Na każdy z nich składa się w sumie wiele elementów.
1. Zrozumiały dla przeglądarek kod
Jak się okazuje, o poprawny i czysty kod źródłowy należy dbać nie tylko ze względu na roboty indeksujące. Warto to robić także z uwagi na przeglądarki dla osób niewidomych, które ten kod czytają liniowo. Na jakie elementy zwrócić uwagę przy tej okazji?
- Zrozumiałą i rzeczywistą kolejność elementów na stronie, czyli zgodność kolejności elementów widzianych z tymi, które zapisane są w kodzie.
Powyżej przykład poprawnego układu treści tabeli w kodzie. Przeglądarka dla niewidomych po etykiecie od razu przeczyta jej wartość. W wersji niepoprawnej najpierw opisano by w kodzie kolumnę etykiet, później wartości, a ich układ graficzny zmodyfikowano by za pomocą CSS-a.
- Zbudowanie strony tak, by można się było na niej poruszać także wyłącznie za pomocą klawiatury. Tu należy zadbać przede wszystkim o to, by wszystkie linki były aktywne bez użycia myszy. Każdy znacznik <a> musi tu więc zawierać atrybut href. Bywa to pomijane, kiedy przy łączach wykorzystywane są zdarzenia typu onclick. By nie utrudniały osobom niepełnosprawnym korzystania ze strony, należy przedstawić je następująco:
zamiast:
2. Poprawna struktura serwisu
Na poprawną strukturę serwisu składają się element title, meta description, nagłówek H1, nagłówki H2, H3 i niższych rzędów oraz semantyczne formatowanie tekstu, czyli doskonale znane pozycjonerom i co rusz optymalizowane.
- Tytuł strony będzie pierwszą informacją, jaką przeczyta robot przeglądarki dla niewidomych – zupełnie tak, jak w przypadku botów Google, musi więc zawierać informacje o tym, czym strona jest, jakie są jej cel i przeznaczenie. Zostanie także wykorzystany do nazwania pliku ze stroną, jeżeli użytkownik postanowi zapisać ją do odczytu offline.
- By nagłówki były dopasowane do potrzeb osób niepełnosprawnych, powinny ułatwiać orientację w hierarchii strony, a w żadnym wypadku nie być wykorzystywane losowo do graficznego wyróżniania tekstu. By zmieniać rozmiar tekstu należy wykorzystywać CSS, a nie nagłówki różnych rzędów.
- Znaczniki <strong>, tak ważne przy wyróżnianiu słów kluczowych, w nadmiarze mogą zaszkodzić – tradycyjnie jako oznaka manipulacji dla Google, ale także jako zaciemnienie przekazu czytanego przez przeglądarki dla niewidomych. Nie należy też obejmować nimi tekstu, który już znajduje się w obrębie jakiegoś nagłówka.
- By ułatwić czytelność, nie należy też nadużywać znaczników <span> i miejscowo formatować tekstu.
3. Przejrzysty layout strony
Czytelny wygląd strony jest kluczowy, by zapewnić pozytywne doświadczenie użytkownika. W przypadku osób z problemami ze wzrokiem ma jeszcze większe znaczenie. By tacy użytkownicy w ogóle mogli się na stronie poruszać:
- Strona powinna mieć klarowne i uszeregowane menu z czytelnym podziałem na kategorie. Choć mogłoby się wydawać, że WERSALIKI zwiększą czytelność nazw kategorii, nie jest to prawdą. Słowa w układzie takim jak w zdaniu czytane są szybciej, bo mają więcej elementów wyróżniających. Lepiej więc nie stosować w menu nazw zapisanych drukowanymi literami. Należy też zadbać o odpowiednie odległości między kolejnymi elementami menu oraz o wyraźny kontrast między nimi a tłem, a także o dostateczną (ale nieprzesadzoną) grubość liter.
Przykład dobrze czytelnego menu na stronie
Przykład menu o mniejszej czytelności.
- Krój pisma wykorzystany na stronie musi być czytelny i mieć wszystkie znaki wykorzystywane w danym języku. Dobranie kroju do projektowania na potrzeby sieci jest osobnym i zbyt obszernym tematem, by go tu w całości poruszać, jednak podstawowe wyznaczniki dobrze czytelnego fontu do internetu są następujące: jest bezszeryfowy, ma niewielki kontrast (czyli części liter mają podobną grubość) i dużą wysokość x. Przykładami takich czytelnych fontów będą Lato, Roboto, Arial. Poniżej przykład Roboto, bardzo czytelnego fontu do sieci.
- Nie warto przesadzać z różnorodnością kolorów na stronie. Dobrze z kolei zadbać o wyraźny kontrast między nimi, jednocześnie uważając, by nie zestawiać kolorów problematycznych, takich, które nie są rozróżniane przez osoby cierpiące na ślepotę barwną. Mylą one np. czerwień z zielenią i odwrotnie, kolor niebieski z czarnym.
- Spektrum tęczy widziane przez osobę mylącą czerwień z zielenią (cierpiącą na daltonizm)
- Spektrum tęczy widziane przez osobę mylącą zieleń z czerwienią
-
- Spektrum tęczy widziane przez osobę nierozpoznającą barwy niebieskiej
- Aby ułatwić osobie korzystającej z przeglądarki dla niewidomych poruszanie się w formularzach, trzeba poprawnie oznaczyć informacje o błędach. Muszą pojawiać się one przed polem, by użytkownik najpierw mógł je usłyszeć, a później poprawić błędnie wprowadzone dane.
4. Intuicyjna nawigacja na stronie
Orientację na stronie można ułatwić, pamiętając o następujących kwestiach:
- Osobom z dysfunkcjami wzroku w nawigowaniu po stronie pomagają elementy takie jak mapa serwisu, wewnętrzna wyszukiwarka, powiązane podstrony. Zaplanowane i sensownie poprowadzone linkowanie wewnętrzne pomoże więc nie tylko w pozycjonowaniu serwisu, ale i w poruszaniu się na stronie.
- W lokalizacji na stronie pomogą także breadcrumbs, które wskażą użytkownikowi ścieżkę dotarcia do podstrony, na której się znalazł. O tym, czym są tzw. okruszki chleba, pisaliśmy jakiś czas temu.
- Elementy graficzne, które mają taką samą funkcję (np. strzałki, rozwinięcia opisów itd.), powinny mieć też spójną formę, za to nie być wykorzystywane w innej roli. Dzięki temu użytkownicy będą wiedzieli, co mogą znaleźć pod danym symbolem.
5. Adekwatne opisy alternatywne
Pozycjonując strony, zawartość atrybutów alt optymalizujemy zazwyczaj pod kątem słów kluczowych, na które ma wyświetlać się dana strona. Tymczasem z perspektywy osób z dysfunkcjami wzroku opisy alternatywne są bardzo ważne jako zastępcza informacja o tym, co się na materiale graficznym znajduje. Warto pamiętać o tym, konstruując te opisy, i zawierając w nich nie tylko frazy kluczowe, ale i dodatkowe informacje.
6. Alternatywne wersje strony
Oczywiście nie zawsze da się spełnić wymienione wyżej wymagania graficzne. W takiej sytuacji warto zamieścić na stronie buttony umożliwiające użytkownikowi samodzielne modyfikowanie jej wyglądu: wielkość liter, ich kontrast (czarno-biały i czarno-żółty).
2 wersje strony http://www.gupkrakow.pl/
Strony internetowe dla niepełnosprawnych. Jak sprawdzić, czy strona jest odpowiednio dostosowana?
Dostosowanie strony www dla niepełnosprawnych można sprawdzić na kilka sposobów:
- z udziałem specjalisty, który dzięki liście kontrolnej WCAG analizuje elementy serwisu (metodę na tej podstawie opracowała Fundacja Widzialni),
- z udziałem zróżnicowanej grupy użytkowników niepełnosprawnych,
- za pomocą automatycznych walidatorów, takich jak validator.w3.org lub wave.webaim.org/,
- używając narzędzia Inne narzędzia zewnętrzne, które pomagają zwizualizować sobie, jak funkcjonuje strona dla różnych osób, np.:
- symulacja korzystania ze sklepu internetowego przy użyciu czytnika ekranowego przez osobę niewidomą – https://www.projectlima.co/vision/total-blindness/
- symulacja korzystania ze strony przez osobę z ograniczonym polem widzenia – https://www.projectlima.co/vision/low-vision/
Dostosowanie stron internetowych dla osób niepełnosprawnych. Podsumujmy
Część z optymalizacji, które zwiększą dostępność strony dla osób niepełnosprawnych, pomoże również w pozycjonowaniu jej. Najważniejsze z nich to czysty kod, poprawna struktura serwisu i hierarchia nagłówków, przejrzysty layout i intuicyjna nawigacja. Warto nad nimi popracować, by nie tylko zoptymalizować stronę na potrzeby osób niewidomych i niedowidzących, ale także zwiększyć jej widoczność w ogóle.
