PODNIESIENIE DOSTĘPNOŚCI STRONY INTERNETOWEJ CZ. 2

W ostatnim czasie wróciłam do zagłębiania tajników dostępności stron internetowych. Na stronie W3C wygrzebałam bardzo ciekawy kurs Web Accessibility. Polecam go właściwie wszystkim. Temat do zgłębienia zarówno dla dev, QA, BA, design, PO, PM itd.

W kusie pokazali m.in. różne narzędzia, które pozwolą sprawdzić poziom dostępności strony. Oczywiście od razu postanowiłam sprawdzać na żywym organizmie 🙂  (do tej pory pokazałam jak zmierzyć dostępność za pomocą Lighthouse wbudowanego w Chroma).

Pierwsza na celownik poszła wtyczka do przeglądarki WAVE. U mnie pokazała masę błędów, których Lighthouse nie wychwycił:

Wynik audytu wtyczni wave przed zmianami.

36 błędów pokazało ewidentnie, że jest sporo do zrobienia. Na szczęście okazało się, że przede wszystkim brakowało alternatywnych tekstów. Po jakiejś godzinie edytowania kolejnych wpisów wynik znacznie się poprawił:

Wynik audytu wave po wprowadzeniu kilku zmian.

14 błędów mniej wydaje się niezłym sukcesem jak na godzinę pracy. I w tym momencie nasuwa się pytanie: czy gdybym od razu dodawała do każdego obrazka alternatywny tekst, musiałabym w niedzielne popołudnie stracić aż godzinę? Oczywiście, że nie. Skończyłoby się na kilku sekundach podczas pisania każdego wpisu. To taki mały przykład tego, jak wczesne myślenie o Accessibility redukuje czas wprowadzania go w późniejszym okresie projektu.

Kolejne 24 błędy związane są brakiem tekstu w linkach umożliwiających udostępnienie postu w różnych kanałach społecznościowych:

Pokazanie screena z błędem.

Jedak tu będę musiała dłużej pogrzebać czy w WordPressie jestem w stanie cokolwiek sama z tym zrobić.

Ciekawe jest również to, że po wprowadzeniu kilku zmian pojawiły się dwa błędy związane z kontrastem, długo się nad nimi głowiłam. Ostatecznie okazało się, że test po poprawkach robiłam będąc w trybie admina w WordPressie i błędy te odnoszą się bezpośrednio do panelu admina.

Pierwsze wrażenie wtyczki jest całkiem pozytywne. Prosta, łatwe odniesienia i, co najważniejsze, mnóstwo podpowiedzi i odnośników, które pomagają łatwo i szybko poprawić dostępność testowanego elementu.

W następnej kolejności zabieram się za wszystkie alerty! Krok po kroczku i wkrótce moja strona będzie przyzwoicie dostępna 🙂