WCAG - Czy Twoja strona jest dostępna dla wszystkich?
- Zapewnienie wysokiego poziomu dostępności cyfrowej wpłynie pozytywnie nie tylko na czytelność naszej strony, ale również na jej wynik SEO oraz konwersje.
- Poziom A to absolutne minimum dostępności, które każda strona powinna spełniać, poziom AA to cel, do którego powinna dążyć każda strona internetowa, natomiast poziom AAA to bardzo rygorystyczny poziom, przeznaczony raczej dla specjalistycznych stron.
- Zadbanie o realizację podstawowych zasad WCAG to zapewnienie stronie odpowiedniej postrzegalności, funkcjonalności, zrozumiałości oraz solidności.
Czy Twoja strona jest dostępna dla wszystkich? Odpowiedź na to pytanie wydaje się prosta: “Tak, przecież każdy może na nią wejść”, aczkolwiek sytuacja często może nie być tak banalna jak nam się wydaje. W dzisiejszym wpisie pochylimy się nad tematem dostępności cyfrowej i wytycznych WCAG, czyli nad tym, z czym większość z nas na co dzień nie ma do czynienia, a jest niezwykle ważne dla funkcjonowania naszej strony w sieci.
Dostępność cyfrowa, co to jest?
Dostępność cyfrowa to zbiór zasad i praktyk, które powinny być stosowane na wszystkich stronach internetowych, aby można było je uznać za powszechnie dostępne dla każdego użytkownika. Zasady dostępności cyfrowej ustanowione są nie tylko po to, aby umożliwić i ułatwić odbiór stron internetowych standardowym użytkownikom, lecz przede wszystkim kładą nacisk na dostosowanie wyświetlanych treści dla osób starszych, osób z niepełnosprawnościami czy neuroatypowych.
Zasady te mogą często wydawać się zbyt rygorystyczne, ale pamiętajmy o tym, że powinniśmy dbać o równy dostęp do informacji i treści dla wszystkich użytkowników, niezależnie od ich zdolności.
Warto również wiedzieć o tym, że dostępność cyfrowa, mimo że ma na celu dostosowanie stron internetowych dla osób z ograniczonymi zdolnościami, może nam przynieść również znaczne korzyści w kwestii pozycjonowania i konwersji. Jest tak, ponieważ Google zwraca dużą uwagę na to, czy dana strona przestrzega wytycznych WCAG i bierze to pod uwagę podczas indeksowania i pozycjonowania strony.
WCAG, co to oznacza?
WCAG, czyli Web Content Accessibility Guidelines, oznacza zbiór wytycznych stanowiących o dostępności stron internetowych. Zbiór ten mówi, jak powinny być tworzone i projektowane strony internetowe, aby ich treść była dostępna dla każdego użytkownika, bez względu na jego ograniczenia czy niepełnosprawności.
4 podstawowe zasady WCAG
Postrzegalność
Treści prezentowane na stronie internetowej powinny być dostępne dla zmysłów użytkownika. Brzmi dość podstawowo, jednak gdy weźmiemy pod uwagę, że odbiorcami naszej strony internetowej mogą być osoby z niepełnosprawnościami wzrokowymi czy słuchowymi, warto to przeanalizować ponownie.
Kluczowe dla spełnienia zasady postrzegalności mogą okazać się takie elementy, jak:
- Dodanie tekstów alternatywnych dla obrazów (alt text)
- Dodanie podpisów i transkrypcji dla multimediów
- Zadbanie o dostateczny kontrast kolorów pomiędzy tłem a istotnymi elementami na stronie
Funkcjonalność
Interfejs użytkownika i wszelkie elementy nawigacyjne muszą być na tyle przejrzyste i czytelne, aby wszyscy użytkownicy mogli z nich korzystać. Koniecznie musimy uwzględnić osoby z ograniczeniami ruchowymi, które korzystają jedynie z klawiatury, bez myszy.
Kluczowe dla spełnienia zasady funkcjonalności mogą okazać się takie elementy, jak:
- Zaprojektowanie alternatywnej nawigacji jedynie z poziomu klawiatury
- Unikanie migających elementów. Wg zasad WCAG elementy migające 3 razy na sekundę lub częściej mogą wywoływać ataki epilepsji
- Odpowiednie, adekwatne nazewnictwo dla linków i przycisków
Zrozumiałość
Treści i elementy przedstawiane na stronie internetowej powinny być czytelne i zrozumiałe dla każdego i nie powodować zamieszania.
Kluczowe dla spełnienia zasady zrozumiałości mogą okazać się takie elementy, jak:
- Przejrzysta nawigacja strony i instrukcje. Użytkownicy powinni w prosty sposób zrozumieć jak poruszać się po stronie i jak z niej korzystać.
- Zadbać o przewidywalność strony. Interaktywne elementy na naszej stronie powinny wywoływać spodziewaną interakcję.
- Zapewnienie pomocy w wypełnianiu formularzy
Solidność
Treści na stronie internetowej powinny być na tyle solidnie tworzone, aby mogły być odczytywane i interpretowane przez różnego rodzaju technologie wspomagające osoby niepełnosprawne, jak np. czytniki ekranu.
Kluczowe dla spełnienia zasady solidności mogą okazać się takie elementy, jak:
- Kodowanie strony zgodnie z aktualnymi standardami języków programistycznych, jak np. HTML
- Zachowanie odpowiedniej semantyki w kodowaniu, jak np. prawidłowe wykorzystywanie znaczników HTML
- Regularne przeprowadzanie testów dostępności na różnych urządzeniach i rozdzielczościach.
Zasad i wskazówek jest oczywiście znacznie więcej. Całość dokumentacji WCAG znajdziesz na oficjalnej stronie: https://www.w3.org/Translations/WCAG21-pl/
Twoja strona jest oceniania
Każda strona internetowa, w zależności od poziomu swojej dostępności cyfrowej jest oceniana: A, AA lub AAA.
- poziom A - jest to podstawowy poziom dostępności, aby go osiągnąć, wystarczy spełnić minimalne warunki, jak np. dodanie tekstów alternatywnych dla obrazów czy zapewnienie transkrypcji. Niespełnienie tego poziomu może oznaczać, że dla osób z niepełnosprawnościami Twoja strona internetowa nie będzie czytelna.
- poziom AA - czyli średni poziom dostępności cyfrowej. Aby osiągnąć ten wynik, Twoja strona powinna być dostosowania dla większości osób z ograniczeniami, czyli mieć wystarczający poziom kontrastu, czytelną nawigację i wsparcie merytoryczne jak i technologiczne osób niepełnosprawnych.
- poziom AAA - jest to najwyższy poziom dostępności. Aby otrzymać wynik AAA, należy spełnić najbardziej rygorystyczne wymagania, takie jak stosowanie uproszczonego języka, czy kompletne wyeliminowanie błysków, mogących wywołać ataki padaczki. Dla większości stron internetowych poziom ten jest niemalże niemożliwy do osiągnięcia, a wymogi te stosuje się z reguły na specjalistycznych portalach kierowanych do osób z ograniczeniami.
Podstawowe zasady dostępności w praktyce
Kontrast kolorów
Zachowanie odpowiedniego kontrastu pomiędzy tłem a elementami na stronie jest niezwykle ważne, aby osoby z zaburzeniami wzrokowymi, takimi jak daltonizm czy starczowzroczność, mogły swobodnie korzystać z Twojej strony.
WCAG zaleca minimalny stosunek kontrastu 4,5:1 dla tekstów podstawowych, oraz 3:1 dla dużych tekstów i nagłówków. W sieci istnieje wiele narzędzi, które pozwolą nam sprawdzić, ile wynosi stosunek kontrastu pomiędzy wybranymi kolorami.
Tekst alternatywny dla obrazów
Tekst alternatywny, inaczej alt text, to krótki opis obrazu, który jest przedstawiony na stronie internetowej. Dodanie takiego tekstu umożliwi osobom niewidomym i niedowidzącym uzyskanie informacji odnośnie treści obrazu, dzięki czytnikowi ekranu.
Teksty alternatywne powinny być krótkie, zwięzłe i dokładnie przedstawić istotne elementy obrazów.
Nawigacja klawiaturą po stronie
Każdy użytkownik powinien mieć możliwość poruszania się po stronie internetowej jedynie za pomocą klawiatury. Zastosowanie takiego rozwiązania umożliwi osobom o ograniczonej motoryce przeglądanie treści Twojej strony.
Kluczowe w takim rozwiązaniu jest odpowiednie zaprogramowanie działania klawisza “Tab”, który powinien w odpowiedniej kolejności przechodzić do kolejnych interaktywnych elementów strony.
Napisy i transkrypcja
Jest to rozwiązanie, które umożliwi osobom niesłyszącym lub niedosłyszącym dostęp do treści audio zawartych na naszej stronie internetowej.
Istnieje wiele narzędzi, w tym opartych na AI, które dobrze radzą sobie z automatycznym dodawaniem napisów do filmów, dzięki czemu nie wymaga to wiele pracy, a może pomóc wielu odbiorcom.
Jakie korzyści przynosi stosowanie się do WCAG?
Poprawa SEO
Odpowiednie zastosowanie się do wytycznych dostępności cyfrowej może przynieść znacznie większe korzyści, niż nam się wydaje. Bowiem spełnianie tych norm jednocześnie podnosi nasze miejsce w rankingu w bezpłatnych wynikach wyszukiwania Google. Nie jest to żadna tajemnica, ponieważ Google od dawna przestawia swoje stanowisko w niezmienny sposób: https://www.google.com/accessibility/ czyli “Każdy powinien mieć dostęp do internetu i móc z niego korzystać. Staramy się, by stało się to rzeczywistością.” Wynika z tego, że stosowanie się do zasad dostępności cyfrowej podnosi naszą pozycję w wynikach wyszukiwania! Ponadto gdy zastosujemy odpowiednie teksty alternatywne i dostosujemy naszą stronę pod względem semantyki kodu, nasza strona będzie dużo bardziej czytelna dla robotów wyszukiwarek, które “czytają” treści podobnie jak czytniki ekranu, co poprawi indeksowanie Twoich treści.
Jeśli interesują Cię wskazówki, które mogą Ci pomóc poprawić pozycjonowanie Twojej strony, koniecznie sprawdź nasz wpis: 10 wskazówek, jak tworzyć dobre treści pod SEO!
Wyższy wskaźnik konwersji
Odpowiednio dostosowana nawigacja i dostępność sprawi, że nasza strona będzie po prostu wygodna i prosta w obsłudze, dzięki czemu realizacja ustanowionych przez nas konwersji będzie po prostu łatwa. Skomplikowana nawigacja i nieczytelny interfejs generują również duży współczynnik odrzuceń, czego nie uświadczymy po zastosowaniu się do zasad WCAG.
Więcej wskazówek dotyczących konwersji znajdziesz w naszym wpisie: Poznaj 9 wskazówek, dzięki którym podniesiesz konwersję landing page'a
Wzmocnienie wizerunku marki
Sam fakt, że firma poświęca czas i środki na dostosowanie swojej strony internetowej dla wszystkich użytkowników, świadczy pozytywnie o marce. Dlatego bądźmy marką, która dba o wszystkich odbiorców i inwestuje w dostępność.
Interesuje Cię temat wzmacniania wizerunku swojej marki? Więcej o tym piszemy w naszym wpisie dot. systemu identyfikacji wizualnej
Jak sprawdzić, czy Twoja strona jest dostępna cyfrowo?
Najlepszym rozwiązaniem oczywiście jest przemyślenie aspektów dostępności cyfrowej jeszcze na etapie projektowania strony internetowej. Jeśli jednak Twoja strona już jest stworzona i publicznie dostępna - warto sprawdzić jej poziom dostępności dostępnymi narzędziami internetowymi, takimi jak:
Accesibility Checker
https://www.accessibilitychecker.org/
Narzędzie umożliwiające sprawdzenie poziomu dostępności cyfrowej dowolnej strony internetowej oraz uzyskanie informacji, w jakim stopniu dana strona spełnia lokalne wymogi dostępności.
Walidator HTML
Narzędzie umożliwiające sprawdzenie znaczników HTML, XHTML oraz HTML5 i ich poprawności. Dzięki niemu możemy z poziomu strony internetowej sprawdzić dostępność dowolnej strony internetowej.
WAVE
Jest to jedno z najpopularniejszych narzędzi do sprawdzania dostępności cyfrowej. Jego zaletą jest przejrzystość informacji oraz możliwość korzystania z poziomu strony internetowej oraz dodatku do przeglądarki.
Accessibility Insights for Web
https://accessibilityinsights.io/
Strona ta działa podobnie do WAVE, umożliwiając sprawdzenie poprawności kodu HTML, poziomy kontrastu czy schemat nawigacji po stronie. Narzędzie to jest dostępne z poziomu dodatku do przeglądarek Chrome i Edge oraz jako samodzielna aplikacja dla systemu Windows.
Narzędzi jest wiele, dlatego warto sprawdzić kilka i wybrać to, które będzie dla Ciebie najbardziej przejrzyste i intuicyjne. Niestety niemal wszystkie narzędzia umożliwiające weryfikację dostępności cyfrowej są dostępne jedynie w wersji anglojęzycznej. Pamiętajmy jednak, że przeglądarki takie jak Chrome oferują tłumaczenie całych stron internetowych, przez kliknięcie prawego przycisku myszy i wybranie “Przetłumacz na polski”.
Podsumowując
Dbanie o dostępność to nic innego jak inwestycja w naszych odbiorców, która się zwróci. Nikt nie oczekuje od wszystkich stron osiągania poziomu AAA, ba, czasem jest to po prostu niemożliwe. Ale osiągnięcie poziomu AA powinno być celem każdej ogólnodostępnej strony internetowej, zwłaszcza że nie musi to oznaczać większych wyrzeczeń, a może podnieść nasz wynik zarówno pod względem SEO, jak i konwersji.
