case study

Organizacja edukacyjna

Lokalizacja

USA

Branża

Edukacja

Kontekst

Nasz klient – organizacja z sektora edukacji z siedzibą w Stanach Zjednoczonych – chciał poprawić dostępność cyfrową swojej strony internetowej. Inicjatywa ta wpisywała się w zobowiązanie firmy do zapewnienia równego dostępu do swoich usług wszystkim użytkownikom, w tym osobom z niepełnosprawnościami.

Wyzwanie

Klient dążył do poprawy dostępności strony na wszystkich poziomach zgodności z WCAG (Web Content Accessibility Guidelines – Wytyczne dotyczące dostępności treści internetowych). Osiągnięcie tego celu wymagało zidentyfikowania i usunięcia problemów wpływających na użyteczność serwisu oraz jego kompatybilność z technologiami wspomagającymi, takimi jak czytniki ekranu.

A photo showing a man in a meeting drawing a scheme on a whiteboard, two people are watching him

Proces

A photo showing somene working on a laptop

Audyt

Pierwszym krokiem było przeprowadzenie szczegółowego audytu dostępności infrastruktury klienta. Wyniki wyjściowe nie były złe, jednak klient chciał je jeszcze poprawić. Zidentyfikowaliśmy obszary wymagające uwagi pod kątem zgodności ze standardami WCAG na poziomach A, AA i AAA. Korzystając z zewnętrznych narzędzi, wykryliśmy takie problemy jak nieprawidłowe wysokości wierszy, niewystarczający kontrast kolorów oraz błędy strukturalne w nagłówkach.

Poziom A – rozwiązanie podstawowych problemów dostępności

Aby spełnić fundamentalne standardy dostępności, uzupełniliśmy brakujące alternatywy tekstowe dla obrazów i linków, zapewniając dostęp do wszystkich treści wizualnych użytkownikom korzystającym z technologii wspomagających. Poprawiliśmy zduplikowane identyfikatory elementów (ID), co usprawniło strukturę platformy i jej kompatybilność z czytnikami ekranu. Rozwiązaliśmy problem pustych nagłówków, wprowadzając znaczące treści tekstowe, a brakujące atrybuty ARIA (Accessible Rich Internet Applications) zostały uzupełnione w celu poprawy nawigacji dla urządzeń wspomagających.

Poziom AA – poprawa użyteczności

Na poziomie AA zajęliśmy się problemami bezpośrednio wpływającymi na użyteczność strony, takimi jak obcinanie tekstu podczas zmiany rozmiaru okna przeglądarki. W tym celu dopracowaliśmy parametry responsywnego projektu, aby elementy tekstowe były odpowiednio skalowane bez zniekształceń. Wprowadziliśmy też poprawki zapewniające minimalny wymagany poziom kontrastu, co przełożyło się na lepszą dostępność wizualną w całym serwisie.

A photo showing people in a meeting

Poziom AAA – optymalizacja czytelności i możliwości personalizacji

Na najwyższym poziomie zgodności skupiliśmy się na poprawie czytelności tekstu i kontrastu. Dostosowaliśmy wysokości wierszy do wymaganych wartości minimalnych, zwiększając ogólną dostępność treści. Stałe rozmiary czcionek zastąpiliśmy jednostkami skalowalnymi, dając użytkownikom możliwość dostosowania wielkości tekstu do własnych preferencji. Problemy z kontrastem kolorów rozwiązaliśmy, wprowadzając zaktualizowaną paletę barw zgodną z wymaganymi standardami kontrastu.

Poprawa obsługi ARIA dla technologii wspomagających

Uzupełniliśmy brakujące alternatywy tekstowe dla obrazów i linków, zapewniając użytkownikom korzystającym z technologii wspomagających pełen dostęp do treści wizualnych. Poprawiliśmy zduplikowane identyfikatory elementów, co poprawiło strukturę platformy i jej kompatybilność z czytnikami ekranu. Problem pustych nagłówków rozwiązaliśmy, wprowadzając znaczące treści tekstowe, a brakujące atrybuty ARIA zostały dodane w celu usprawnienia nawigacji dla urządzeń wspomagających.

Porządkowanie struktury nagłówków dla lepszej nawigacji

Korzystając z narzędzia Siteimprove, zidentyfikowaliśmy problemy ze strukturą nagłówków witryny. Zreorganizowaliśmy je, tworząc logiczną hierarchię zgodną z wytycznymi dostępności. Zaktualizowaliśmy strony tak, aby każda zaczynała się od nagłówka pierwszego poziomu, i uzupełniliśmy brakujące treści następujące po nagłówkach, zapewniając wyraźny i zrozumiały kontekst. Zmiany te nie tylko poprawiły dostępność, ale też podniosły ogólną jakość doświadczenia użytkownika, czyniąc platformę bardziej intuicyjną i łatwiejszą w nawigacji.

Co osiągnęliśmy

A screenshot showing improved accessibility rating of a website

Wprowadzone zmiany przyniosły znaczący wzrost poziomu dostępności cyfrowej. Osiągnęliśmy wzrost ogólnego wskaźnika dostępności o 20,6%, podnosząc wynik do 97,8/100 – co przekłada się na wyjątkowo dostępną witrynę. Największa poprawa, wynosząca aż 46%, nastąpiła na najwyższym poziomie zgodności AAA.

+20,6%
wzrost ogólnego wskaźnika dostępności
+46%
wzrost dostępności na poziomie AAA
+16,6%
wzrost dostępności na poziomie A
+22%
wzrost zgodności z najlepszymi praktykami dostępności

Zmiany wprowadzone na wszystkich poziomach zgodności WCAG sprawiły, że serwis stał się nie tylko bardziej dostępny, ale też ogólnie bardziej użyteczny i przyjazny dla wszystkich odwiedzających.

Skonsultuj z nami Twój projekt