WCAG oznacza Web Content Accessibility Guidelines, czyli „wytyczne dotyczące dostępności treści internetowych”. To informacje, które wyjaśniają, w jaki sposób tworzyć content do sieci, przyjazny wszystkim, a w szczególności osobom z niepełnosprawnościami wzroku, słuchu, ruchu, a także zaburzeniami poznawczymi.
Kurs WCAG - dostępność cyfrowa w projektowaniu stron i aplikacji
Naucz się tworzyć strony i aplikacje, z których każdy użytkownik może korzystać bez ograniczeń. Poznaj aktualne zasady WCAG 2.1 i zadbaj o jak najlepszą dostępność Twoich produktów cyfrowych. Dowiedz się więcej
Jak powstało WCAG?
WCAG w wersji 1.0 powstało już w 1999 roku. Dokumentacja jest regularnie aktualizowana, wraz z rozwojem technologii oraz popularyzacją rozwiązań cyfrowych, przenikających do codzienności. Zadaniem WCAG jest konsolidacja najważniejszych wytycznych, których powinni przestrzegać m.in. UX designerzy i web developerzy podczas projektowania i tworzenia stron internetowych oraz aplikacji.
Wraz ze zmianami technologicznymi w 2008 roku opublikowano standard WCAG 2.0. Cztery lata później wytyczne zyskały status międzynarodowej normy ISO/IEC 40500:2012, dlatego zaczęły być coraz częściej przestrzegane przez firmy tworzące cyfrowe rozwiązania dla użytkowników.
Od 2018 roku obowiązuje standard WCAG 2.1. W tej wersji zwrócono szczególną uwagę na wygląd interfejsu oraz interakcje, jakie zachodzą pomiędzy rozwiązaniem cyfrowym a internautą (przede wszystkim dotyk i głos, ze względu na popularność ekranów dotykowych oraz rozwiązań głosowych).
Kompletna dokumentacja WCAG dostępna jest pod tym adresem.
WCAG 2.1 – najważniejsze informacje
Ideą standardu WCAG jest stworzenie prostych, konkretnych i przydatnych instrukcji, które mogą być z łatwością wdrożone na etapie projektowania oraz tworzenia rozwiązania cyfrowego. Wersja 2.1 skupia się na czterech kluczowych aspektach:
1. Postrzegalność
Publikowane treści muszą być dostępne (postrzegalne) dla odbiorców z różnymi niepełnosprawnościami. Dlatego rekomenduje się stosowanie technik takich jak:
- transkrypcja
- opisywanie grafik w sposób alternatywny (dodatkowy tekst)
- wyróżnienia najważniejszych fragmentów treści (bold, kolor)
- responsywność (dostępność dla wszystkich urządzenia)
2. Funkcjonalność
Aplikacja lub strona internetowa powinna być tak zaprojektowana, aby korzystać z niej np. wyłącznie przy pomocy myszki lub klawiatury. Należy również zadbać o odpowiednie opisanie dostępnych elementów (zarówno głównej zawartości, jak i dodatkowych linków, elementów nawigacji, menu, czy stopki). To pozwala wygodnie korzystać z dostępnych funkcjonalności.
3. Zrozumiałość
Warto używać prostego języka, który będzie zrozumiały dla wszystkich. Należy unikać niepotrzebnych skrótów oraz akronimów. Wygląd poszczególnych elementów aplikacji lub strony internetowej powinien być spójny i przejrzysty.
4. Kompatybilność
Aplikacja lub strona internetowa powinna prawidłowo otwierać się na każdym typie urządzenia, bez względu na technologię, czy wielkość ekranu. Użytkownicy korzystają z różnych rozwiązań, dlatego tak istotnym elementem WCAG pozostaje kompatybilność.
Dostępność cyfrowa w praktyce – WCAG na stronach internetowych
Stworzenie strony internetowej zgodnej z wytycznymi WCAG pozwoli na wygodne korzystanie z witryny wszystkim użytkownikom. Z tego względu należy pamiętać o tych aspektach:
- Responsywność – to element nawiązujący do kompatybilności oraz postrzegalności. Serwis musi prawidłowo otwierać się na każdym typie urządzenia, od telefona, poprzez tablet, aż po komputery stacjonarne oraz laptopy.
- Czas ładowania – serwis powinien gwałtownie wczytywać dostępną zawartość.
- Nawigacja i menu – witryna musi posiadać przejrzyste elementy nawigacyjne, w tym menu.
- Linkowanie wewnętrzne – użytkownik powinien z łatwością dostać się do wszystkich podstron przy pomocy linkowania wewnętrznego.
Kurs UX Design - wprowadzenie do projektowania doświadczeń użytkowników
Zobacz kurs
Kurs WCAG - dostępność cyfrowa w projektowaniu stron i aplikacji
Zobacz kurs
Kurs UX & UI - sztuka użytecznego projektowania
Zobacz kurs
Każdy serwis internetowy wymaga indywidualnej analizy pod kątem WCAG, aby zapewnić użytkownikom maksymalną kompatybilność, zrozumiałość, funkcjonalność oraz postrzegalność. Istnieje jednak szereg wytycznych, które są uniwersalne i znajdują zastosowanie w obrębie praktycznie każdej witryny lub aplikacji:
- Czcionka: powinna być bezszeryfowa o rozmiarze minimum 12 ptk., z zachowaniem interlinii na poziomie 1,15 lub 1,5. Tekst należy dzielić na akapity, gdzie każdy będzie opisywać konkretne zagadnienie. Użytkownicy powinni mieć możliwość powiększenia treści choćby do 200%.
- Kontrast: współczynnik kontrastu (pomiędzy tekstem a tłem) powinien osiągać minimum 4,5:1 dla tekstu pisanego czcionką 18 lub większą. Mniejsze treści mogą być publikowane z kontrastem 3:1.
- Grafiki: fotografie powinny posiadać teksty alternatywne. To opisy, informujące o tym, co dokładnie znajduje się na konkretnej grafice.
- Audio: materiały dźwiękowe powinny posiadać transkrypcje.
- Wideo: materiały wideo nie powinny odtwarzać się automatycznie, ale dopiero po wykonaniu akcji przez użytkownika (np. kliknięcie).
- Wersje językowe: treści warto udostępniać w kilku wersjach językowych, szczególnie o ile istnieje szansa na to, iż trafią na nie użytkownicy z różnych stron świata.
- Kolory: barwy nie powinny być jednym sygnalizatorem oznaczającym interakcję.
Zachowywanie wymienionych standardów jest zgodne z wytycznymi zamieszczonymi w dokumentacji WCAG 2.1 i sprawia, iż strona lub aplikacja są znacznie bardziej przystępne dla użytkowników.
