Jak sprawić, by strony internetowe WordPress były dostępne

Ten post został napisany gościnnie przez Amber Hinds, CEO Equalize Digital, certyfikowanej firmy B Corporation specjalizującej się w dostępności WordPress. Jeśli chcesz dowiedzieć się więcej o Equalize Digital i jej usługach, odwiedź stronę internetową firmy.

Miliony ludzi na całym świecie cierpią na niepełnosprawność, która wpływa na sposób, w jaki korzystają z Internetu, a po pandemii, która zwiększyła zapotrzebowanie na łatwe zakupy online, zamawianie jedzenia, a nawet usługi zdalnej opieki zdrowotnej, dostępność sieci jest ważniejsza niż kiedykolwiek.

W tym przewodniku po ułatwieniach dostępu w sieci omówiono, czym jest dostępność, dlaczego jest ważna i jak sprawić, by witryny WordPress były dostępne, w tym identyfikując typowe problemy za pomocą testów.

W tym artykule omówię:

• Co to jest dostępność sieci?
• Dlaczego dostępność ma znaczenie
• Jakie są typowe problemy z ułatwieniami dostępu?
• Testowanie witryn WordPress pod kątem dostępności
• Utrzymanie dostępności strony internetowej

Co to jest dostępność sieci?

Mówiąc najprościej, dostępne strony internetowe to strony internetowe, z których mogą korzystać wszyscy ludzie, w tym osoby, które mogą nie wchodzić w interakcję z siecią za pomocą typowej konfiguracji klawiatury i myszy, oraz osoby, które mają różne różnice intelektualne lub fizyczne.

Strony internetowe muszą być wbudowane w określone funkcje, aby były użyteczne i zrozumiałe dla osób niepełnosprawnych. Niepełnosprawność słuchowa, wzrokowa, poznawcza, ruchowa lub uczenie się wymaga dostosowania i modyfikacji strony internetowej, aby były użyteczne. W zależności od sytuacji osoby niepełnosprawne korzystają z różnych urządzeń wspomagających, takich jak czytniki ekranu, aby uzyskać dostęp do stron internetowych.

Projektanci stron internetowych i programiści muszą zapewnić, aby zawartość i funkcjonalność ich witryn internetowych były dostrzegalne, obsługiwane, zrozumiałe i solidne (POUR), co oznacza, że ​​treść i funkcjonalność mogą być dostępne i zrozumiałe dla wszystkich ludzi na wszystkich urządzeniach.

Niektóre przykłady funkcji, które zwiększają dostępność witryn internetowych, obejmują:

• napisy i transkrypcje do plików wideo i audio
• alternatywny tekst na obrazach
• pomiń linki, aby ułatwić nawigację za pomocą klawiatury
• odpowiedni kontrast kolorów, aby tekst był bardziej czytelny

Dlaczego dostępność ma znaczenie

Dostępność stron internetowych ma wpływ na każdego, kto korzysta z sieci. Jeśli witryny internetowe Twoje lub Twoich klientów są dostępne, zapewnia to wszystkim równy dostęp do informacji online, artykułów pierwszej potrzeby, rozrywki, zakupów i nie tylko, niezależnie od umiejętności.

Ale dostępność stron internetowych to nie tylko dobra karma; ma również rzeczywisty wpływ na rankingi w wyszukiwarkach, nową sprzedaż i odwiedzających witrynę, komplikacje prawne i wizerunek marki.

Ranking wyszukiwarek

Wprowadzanie poprawek ułatwień dostępu może poprawić ranking witryny w wyszukiwarkach. Wiele funkcji ułatwień dostępu, takich jak alternatywny tekst na obrazach i odpowiednio ustrukturyzowana treść z nagłówkami, pomaga zarówno w ułatwieniach dostępu, jak i optymalizacji pod kątem wyszukiwarek (SEO). Wyższa pozycja na stronie wyników wyszukiwania może zwiększyć widoczność wśród nowych klientów lub klientów, prowadząc do zwiększenia ruchu w witrynie, liczby konwersji, liczby subskrybentów bloga lub biuletynu i nie tylko.

Zwiększona sprzedaż

CDC stwierdza, że ​​​​od 2018 r. 1 na 4 Amerykanów jest niepełnosprawny. Niepełnosprawni Amerykanie wydawali rocznie ponad 200 miliardów dolarów na wydatki uznaniowe online. Funkcje ułatwień dostępu pozwalają większej liczbie osób znajdować strony internetowe i z nich korzystać, zwiększając szanse na nową sprzedaż, konwersje i stałych klientów. Gdy wiele witryn internetowych nie jest dostępnych w dzisiejszym świecie, każda dostępna witryna będzie wyróżniać się na tle konkurencji.

Jest to prawnie wymagane

Wszystkie strony internetowe muszą spełniać standardy dostępności sieci określone w ustawie Americans with Disabilities Act (ADA). W ramach ADA ustanowiono precedens prawny, który ustanawia strony internetowe jako miejsca zakwaterowania publicznego. Oznacza to, że strony internetowe firm, które w zasadzie są ich cyfrowymi witrynami sklepowymi, muszą być dostępne w taki sam sposób, jak budynek biznesowy z cegły i zaprawy murarskiej.

Witryny lokalnych, stanowych i federalnych agencji rządowych oraz wszelkie witryny organizacji i projektów finansowanych ze środków federalnych muszą również spełniać standardy sekcji 508. Ponadto istnieje wiele przepisów stanowych i międzynarodowych, które wymagają, aby witryny były dostępne.

Jeśli strona internetowa nie spełnia wymagań dostępności określonych w niniejszych wytycznych, organizacji może grozić pozew sądowy lub, w niektórych przypadkach, grzywna rządowa. Według Usablenet w 2020 roku w Stanach Zjednoczonych złożono 3550 pozwów dotyczących dostępności stron internetowych. Zachowanie zgodności z prawem jest ważną częścią prowadzenia działalności, a posiadanie dostępnej witryny internetowej jest jednym ze sposobów, w jaki firmy mogą wywiązywać się ze swoich zobowiązań prawnych.

Wizerunek marki

Firmy i organizacje non-profit, które podejmują kroki w celu zwiększenia dostępności swoich witryn WordPress, pokazują, że praktykują odpowiedzialność społeczną i potwierdzają, że chcą, aby Internet był miejscem dla wszystkich. Zaangażowanie organizacji w dostępność pokazuje ludziom, że troszczą się o nich w sposób głęboko ludzki, co buduje lojalność i może podnieść wizerunek marki.

Jakie są typowe problemy z ułatwieniami dostępu?

Moja firma, Equalize Digital, jest firmą konsultingową w zakresie ułatwień dostępu, która przeprowadza audyty ułatwień dostępu w witrynach internetowych dla firm, organizacji non-profit i agencji rządowych. We wszystkich naszych testach zauważyliśmy, że wiele problemów z dostępnością powtarza się we wszystkich witrynach. Te typowe problemy są stosunkowo proste do rozwiązania, ale zwykle są pomijane przez programistów, projektantów i twórców treści.

Jeśli chcesz mieć pewność, że witryny, które tworzysz lub którymi zarządzasz, są dostępne, zacznij od sprawdzenia następujących problemów:

Brakujący lub niskiej jakości tekst alternatywny

Tekst alternatywny jest używany przez czytniki ekranu do opisywania zawartości lub celu obrazu osobom niewidomym. Jeśli tekst alternatywny pozostanie pusty, czytnik ekranu całkowicie go pominie lub zamiast tego odczyta nazwę pliku obrazu, co jest nieprzydatne, gdy nazwa pliku jest ciągiem liczb lub nie opisuje wyglądu. Bez odpowiedniego tekstu alternatywnego użytkownicy niewidomi i niedowidzący nie będą mieli kontekstu ani zrozumienia obrazu.

Tekst alternatywny niskiej jakości jest problematyczny, ponieważ nie opisuje dokładnie obrazu lub jest zbyt rozwlekły i może powodować zamieszanie. Słowa i wyrażenia takie jak „obraz”, „obraz”, „grafika”, „obraz” nie muszą być dodawane do tekstu alternatywnego, ponieważ czytnik ekranu poinformuje o obecności obrazu lub grafiki.

Jeśli masz tekst alternatywny dłuższy niż 125-150 znaków, niektóre czytniki ekranu wyłączą się i przestaną czytać. Dodanie kropek w tekście alternatywnym może spowodować zatrzymanie czytników ekranu, potencjalnie dezorientując słuchaczy lub sprawiając, że sądzą, że tekst alternatywny się skończył.

Niewystarczający kontrast kolorów

W projektowaniu stron internetowych kontrast kolorów odnosi się do miary jasności między kolorem tła a kolorowymi elementami, takimi jak tekst, przyciski lub ikony. Aby tekst o standardowym rozmiarze został uznany za wystarczający, kolory tła i pierwszego planu muszą mieć stosunek 4,5:1. Kontrast kolorów można sprawdzić, wprowadzając szesnastkowe kody obu kolorów do bezpłatnego narzędzia do sprawdzania kontrastu kolorów.

Niejednoznaczny tekst kotwicy

Tekst zakotwiczenia to klikalne słowo lub grupa słów na stronie internetowej. Kliknięcie tekstu zakotwiczenia może spowodować przejście do nowej witryny, pobranie dokumentu, otwarcie obrazu lub filmu w nowej karcie. Tekst zakotwiczenia jest uważany za niejednoznaczny, jeśli nie ma sensu wyrwany z kontekstu lub nie opisuje celu linku. Niektóre przykłady niejednoznacznego tekstu zakotwiczenia to „link”, „kliknij tutaj”, „dowiedz się więcej” lub „kontynuuj”. Podczas dodawania linków do treści istotne jest, aby jeśli ktoś usłyszał sam link (bez otaczającego go tekstu), wiedział, dokąd link prowadzi lub co się stanie, gdy w link zostanie kliknięty.

Brakujące napisy i transkrypcje

Napisy zawierają treści mówione i niemówione, takie jak efekty dźwiękowe, muzyka lub śmiech z filmu, i opisują je za pomocą tekstu. Pojawiają się one na ekranie podczas odtwarzania filmu, więc niesłyszący i niedosłyszący użytkownicy mogą zrozumieć, co dzieje się na filmie. Ponadto napisy muszą pasować do czasu filmu. Należy pamiętać, że podpisy muszą być dokładne; napisy generowane automatycznie należy sprawdzić pod kątem dokładności.

Transkrypcja to pisemny zapis tego, co zostało powiedziane w klipie audio lub wideo. Transkrypcje zapewniają drugorzędny sposób zrozumienia treści wideo lub plików audio. Powinny być używane wraz z napisami w filmie, aby widzowie mogli przeczytać transkrypcję zamiast oglądać wideo. Jest to ważne, ponieważ nie wszyscy użytkownicy mogą czytać napisy. Transkrypcje zapewniają również korzyść w postaci łatwego tłumaczenia na inne języki i mogą pomóc w SEO.

Testowanie witryn WordPress pod kątem dostępności

Najlepszym sposobem testowania witryn pod kątem dostępności jest połączenie testów automatycznych, ręcznych i testów użytkowników.

Automatyczne testy dostępności

Automatyczne testy dostępności są przeprowadzane za pomocą narzędzi skanujących AI. Istnieje wiele bezpłatnych i płatnych narzędzi, które mogą oferować różne funkcje skanowania ułatwień dostępu. Wybierając zautomatyzowane narzędzie, należy pamiętać o kilku rzeczach:

• Rozmiar strony internetowej. Jeśli masz mniejszą witrynę, może Ci się przydać bezpłatne narzędzie. Jeśli masz większą witrynę, na przykład witrynę z blogiem lub sekcją eCommerce z tysiącami postów, prawdopodobnie bardziej odpowiednie będzie płatne narzędzie.
• Ile wsparcia potrzebujesz. Jeśli potrzebujesz pomocy w znalezieniu błędów ułatwień dostępu w swojej witrynie, aby móc je naprawić, bezpłatne narzędzia mogą być świetną opcją. Jeśli potrzebujesz pomocy w zrozumieniu błędów ułatwień dostępu lub chcesz, aby ktoś inny je naprawił, spróbuj znaleźć narzędzie z opcjami wsparcia wbudowanymi lub oferowanymi przez programistów. Dostępność pomocy technicznej jest kluczowa, jeśli dopiero zaczynasz korygować ułatwienia dostępu.
• Doświadczenie użytkownika. Niektóre zautomatyzowane narzędzia ułatwień dostępu mogą być używane bezpośrednio w Twojej witrynie, na przykład za pośrednictwem rozszerzenia przeglądarki lub pulpitu nawigacyjnego WordPress. Inne narzędzia wymagają użycia interfejsu całkowicie oddzielonego od Twojej witryny. Jeśli chcesz zobaczyć błędy dostępności podczas pracy na swojej stronie internetowej, wybierz narzędzie, które oferuje raportowanie on-site. Ułatwia to ciągłe sprawdzanie dostępności witryny podczas edytowania treści w witrynie.

Dwa popularne bezpłatne narzędzia, których można używać na dowolnej stronie internetowej, to WAVE i Axe. Narzędzia te mają dostępne rozszerzenia Chrome i Firefox do testowania pojedynczych adresów URL, pojedynczo, oraz płatne plany, które umożliwiają testowanie zbiorcze i dodatkowe funkcje.

Wtyczka WordPress do sprawdzania ułatwień dostępu

Jeśli chcesz przeprowadzać masowe skanowanie ułatwień dostępu i wyświetlać raporty na pulpicie nawigacyjnym WordPress, wtyczka WordPress Accessibility Checker jest najlepszym narzędziem. Możesz pobrać podstawową wersję wtyczki za darmo na WordPress.org.

Sprawdzanie ułatwień dostępu skanuje strony i posty pod kątem błędów dostępności lub potencjalnych problemów i wyświetla je bezpośrednio na ekranie edycji tej strony lub postu. Te raporty na stronie są przydatne nie tylko do sprawdzania, czy witryna jest dostępna, ale także do monitorowania bieżącej dostępności.

Sprawdzanie ułatwień dostępu przeprowadza ponad 40 różnych testów, w tym pod kątem typowych problemów wskazanych powyżej. Darmowa wersja skanuje posty i strony, a wersja Pro zawiera pełne skanowanie witryn niestandardowych typów postów i stron archiwów. Nieprawidłowo oznaczone lub przejrzane elementy można odrzucić, co pozwala na śledzenie wprowadzanych w czasie poprawek ułatwień dostępu. To świetne narzędzie zarówno dla agencji, programistów, jak i użytkowników WordPress.

Testowanie ręczne

Niestety automatyczne skanowanie nie jest w stanie zidentyfikować każdego problemu z dostępnością w witrynie — niektóre problemy może wykryć tylko człowiek korzystający z witryny. Po przetestowaniu witryny za pomocą zautomatyzowanego narzędzia, takiego jak Sprawdzanie ułatwień dostępu, przeprowadź testy ręczne, aby upewnić się, że wszyscy ludzie mogą z niej korzystać bez względu na to, jakiego urządzenia używają.

Pierwszym krokiem w ręcznym teście ułatwień dostępu jest potwierdzenie, że użytkownicy mogą w pełni poruszać się po nim tylko za pomocą klawiatury. Przejdź do przedniej części witryny i użyj klawiszy tabulatorów i strzałek, aby poruszać się po witrynie, upewniając się, że nie zgubisz miejsca w trakcie przeglądania i że możesz korzystać ze wszystkich części witryny.

Po przetestowaniu klawiatury możesz przejść do testowania czytnika ekranu. Czytniki ekranu to rodzaj oprogramowania technologii wspomagającej, za pomocą którego osoby niewidome i niedowidzące rozumieją treści internetowe. Jeśli masz komputer Mac, możesz użyć wbudowanego w komputer oprogramowania VoiceOver. Jeśli nie masz komputera Mac, możesz pobrać darmowy czytnik ekranu NVDA o otwartym kodzie źródłowym lub kupić popularny czytnik ekranu JAWS. Najlepszą praktyką jest przetestowanie witryny za pomocą dwóch lub więcej czytników ekranu, ponieważ nie wszystkie czytniki ekranu mówią to samo dla poszczególnych elementów.

Aby przetestować witrynę internetową za pomocą czytnika ekranu, przejdź do strony, którą chcesz przetestować, a następnie poruszaj się po niej tak, jak podczas testu nawigacji za pomocą klawiatury, używając tylko klawiszy tabulacji i strzałek. Słuchaj, co mówi czytnik ekranu, gdy poruszasz się po stronie i oznaczaj wszystko, co jest niepoprawne lub mylące. Słuchaj plików multimedialnych lub suwaków, które odtwarzają się automatycznie i przerywają inne treści na stronie.

Po przeprowadzeniu testów nawigacji za pomocą klawiatury i czytnika ekranu należy sprawdzić wszystkie osadzone lub połączone pliki multimedialne. Pliki multimedialne obejmują pliki wideo, pliki audio, pliki PDF, pliki .Doc lub .XLS, suwaki obrazu lub tekstu oraz widżety lub ramki iFrame innych firm. Upewnij się, że osoby niepełnosprawne mogą uzyskiwać dostęp, wchodzić w interakcje i rozumieć treści prezentowane przez wszystkie osadzone lub połączone pliki multimedialne.

Testowanie użytkowników

Po automatycznych i ręcznych testach dostępności zaleca się przeprowadzenie testów użytkowników. Testowanie użytkowników obejmuje zatrudnianie rzeczywistych użytkowników technologii wspomagających do testowania Twojej witryny pod kątem błędów dostępności. Zazwyczaj użytkownik testowy otrzymuje wytyczne od programisty internetowego z określonymi celami. Następnie użytkownik testowy spróbuje osiągnąć te cele, a następnie przekaże informację zwrotną programiście.

Możesz zatrudnić poszczególnych użytkowników testowych w ramach programów płatnych lub wolontariackich lub znaleźć firmę zajmującą się ułatwieniami dostępu, która oferuje usługi testowania użytkowników.

Wniosek: Utrzymanie dostępności strony internetowej

Należy zauważyć, że podobnie jak SEO, dostępność jest procesem ciągłym, który wymaga ciągłego monitorowania i modyfikacji. Aby Twoja witryna była dostępna, utwórz plan:

• Regularnie monitoruj i testuj błędy dostępności za pomocą narzędzia, takiego jak wtyczka Accessibility Checker.
• Szkol programistów, projektantów i twórców stron internetowych w zakresie najlepszych praktyk związanych z ułatwieniami dostępu do sieci. Jeśli uruchamiasz strony internetowe dla klientów, upewnij się, że wiedzą, jak dodawać treści w przystępny sposób po uruchomieniu.
• Bądź na bieżąco z wszelkimi wytycznymi dotyczącymi ułatwień dostępu lub zmianami przepisów, których musisz przestrzegać.

Podjęcie tych kroków pomoże zapewnić, że Twoja witryna pozostanie dostępna i że wszyscy ludzie będą mieli równy dostęp do informacji, produktów i usług w sieci, niezależnie od ich umiejętności.