10 podstawowych zasad przewodnich inkluzywnego projektowania stron internetowych

Badania wykazały, że około 70% stron internetowych jest przynajmniej częściowo nieczytelnych dzięki technologii wspomagającej.

Ta statystyka brzmi i jest szokująca. Jak to się dzieje, że tak wiele marek rezygnuje z oczywistych względów dla milionów niepełnosprawnych internautów?

Kiedy zastanowimy się, jak często osoby niepełnosprawne stają się niewidoczne w społeczeństwie i biznesie, to niestety zaczyna nabierać większego sensu.

Wytyczne dotyczące dostępności treści internetowych (WCAG) określają, w jaki sposób strony internetowe mogą poprawić swoją dostępność, a tym samym ich włączenie.

Wiele z tych wytycznych staje się prawnie chronionych, więc Twoja firma może być zagrożona, jeśli Twoja witryna jest niedostępna.

Korzyści z integracji dla Twojej firmy i klientów są ogromne.

Ułatwienia dostępu zapewni większy udział w odbiorcach, ale jest również kluczem do budowania zaufania klientów.

Wszyscy klienci, niepełnosprawni lub nie, skorzystają z płynniejszej obsługi witryny. Docenią biznes, któremu zależy na tym doświadczeniu.

Inkluzywność oznacza uwzględnienie zakresu potrzeb Twoich klientów oraz tego, w jaki sposób ich dostęp do Twojej usługi może być ograniczony. Pomyślne wdrożenie funkcji ułatwień dostępu pomoże Ci pokonać te ograniczenia.

Chociaż ten artykuł koncentruje się na projektowaniu stron internetowych, pamiętaj, że kluczową kwestią dostępności jest brak dostępu do Internetu, więc powinieneś dążyć do zwiększenia dostępności we wszystkich obszarach.

Technologie telefoniczne, takie jak opcje połączeń konferencyjnych wdzwanianych, mogą pomóc w utrzymaniu zdalnego kontaktu ze wszystkimi klientami.

Przejdźmy teraz do tych dziesięciu podstawowych zasad, które pomogą w projektowaniu stron internetowych sprzyjających włączeniu społecznemu.

Wytyczne dotyczące projektowania włączającego

1. Bądź elastyczny

Termin „niepełnosprawność” obejmuje szeroki zakres ludzkich doświadczeń i potrzeb. Może to być onieśmielające, gdy zastanawiasz się, jak sprawić, by Twoja witryna była dostępna i inkluzywna.

Pamiętaj jednak, że wszyscy Twoi klienci, niepełnosprawni lub nie, przychodzą do Twojej firmy z bardzo różnymi potrzebami i preferencjami.

To prawda, że ​​nie możesz zadowolić wszystkich, ale możesz zaoferować elastyczne doświadczenie, aby dotrzeć do jak największej liczby klientów.

Rozważ kontekst, w którym użytkownicy uzyskują dostęp do Twojej witryny. Na przykład, jakich urządzeń używają? Czy chętniej korzystają z Twoich usług w pracy czy w domu?

Profiluj swoich klientów, aby określić ich dane demograficzne, takie jak wiek i płeć. Jest to jeden z kluczy do zrozumienia najlepszej platformy eCommerce lub projektów stron dla Twojej firmy.

Najlepszą opcją, aby zarówno zadowolić obecnych klientów, jak i dotrzeć do nowych, jest elastyczność.

Oferuj różne opcje kontaktu w trybie online i offline. Kontakt z Twoją firmą i korzystanie z Twoich usług powinno przebiegać sprawnie i bezboleśnie. Jest to korzystne dla wszystkich Twoich klientów, nie tylko tych z dodatkowymi potrzebami.

2. Unikaj przytłaczających klientów

Chociaż pewien stopień poruszania się treści może sprawić, że Twoja witryna będzie się wyróżniać, zbyt wiele może powodować niepokój i wywierać presję. Dla użytkowników z potrzebami zdrowia psychicznego, takimi jak lęk, autyzm lub ADHD, problemy te są szczególnie istotne.

WCAG ma jasne wytyczne dotyczące przenoszenia treści. Przenoszenie treści (tj. GIF-y, przewijanie i automatyczne aktualizowanie kanałów informacyjnych itd.) musi mieć mechanizm wstrzymywania, jeśli uruchamiają się automatycznie, trwają dłużej niż pięć sekund i są równoległe do innych treści.

W zależności od odbiorców możesz całkowicie rozważyć rezygnację z treści autoodtwarzanych. Pomyśl o swoich starszych klientach, którzy mogą nie być przyzwyczajeni do usług internetowych.

Zbyt wiele poruszających, czasochłonnych informacji jest odpychających i przytłaczających.

Wiele witryn w dzisiejszych czasach ma wyskakujące okienko czatu na żywo, gdy tylko wejdziesz na stronę. Ma to swoje zalety jako łatwo dostępne narzędzie kontaktu. Jednak może to być irytujące, jeśli komunikat pojawia się od razu za każdym razem, gdy korzystasz z witryny.

Zamiast wyskakującego okienka możesz zamiast tego mieć składaną, oznakowaną opcję czatu na żywo w dyskretnej pozycji. Wymuszanie kontaktu z klientami zaraz po ich przybyciu może być bardzo stresujące.

Powinno to również dotyczyć korzystania przez Twoją firmę z aplikacji do obsługi wiadomości tekstowych. Nie zasypuj swoich klientów powiadomieniami.

3. Użyj przejrzystej typografii

WCAG jasno określa wymagania dotyczące typografii:

• Zachowaj tekst wyrównany do lewej lub do prawej (nie wyjustowany)
• Odstępy między wierszami i akapitami powinny wynosić co najmniej 1,5x
• Maksymalna szerokość akapitu to 80 znaków

Zawsze powinieneś przestrzegać tych wytycznych, ale możesz posunąć się dalej, aby skorzystać z większej liczby swoich klientów.

Użyj wyraźnej czcionki bezszeryfowej, odpowiedniego rozmiaru i kontrastującego koloru tła. Język powinien być prosty i bezpośredni, bez protekcjonalnego traktowania klientów.

Skorzystaj z badań klientów, aby określić, czego klienci oczekują od Twojej witryny.

Innym ważnym problemem jest tekst w obrazach. W miarę możliwości należy tego unikać.

Użytkownicy niewidomi i niedowidzący często korzystają z oprogramowania czytnika ekranu. Programy te czytają na głos tekst wyświetlany na ekranie, ale nie potrafią dekodować obrazów.

Twoi klienci mogą zatem przegapić ważne informacje, jeśli tekst jest „ukryty” w obrazie. Ważne jest, aby Twoi klienci niedowidzący nie czuli, że mają ograniczony dostęp do Twojej witryny.

4. Udostępnij obrazy

Oczywiście obrazy są nadal niezbędne do dobrego projektowania stron internetowych. I odwrotnie, mogą zwiększyć dostępność dla innych klientów.

W przypadku osób z trudnościami w czytaniu, takimi jak dysleksja, odpowiednie obrazy mogą poprawić zrozumienie tekstu. Obrazy prawie na pewno będą potrzebne w niektórych obszarach witryny, takich jak strony produktów.

Nadal możesz udostępniać obrazy użytkownikom czytników ekranu. Tekst alternatywny powinien być dołączany do każdego obrazu w Twojej witrynie. To jest tekst, który pojawia się po najechaniu kursorem na obraz.

Jest również odczytywany przez czytniki ekranu, które nie mogą wyświetlić samego obrazu. Dobry tekst alternatywny jasno i dokładnie opisuje wyświetlany obraz.

Umieszczanie tekstu alternatywnego w witrynie za pomocą HTML jest łatwe. Włączenie tekstu alternatywnego nie będzie przeszkadzać innym użytkownikom i przyniesie ogromne korzyści tym, którzy używają czytników ekranu. Tekst alternatywny i dostępne obrazy mogą być również korzystne dla rankingów w wyszukiwarkach.

Oprócz tekstu alternatywnego ważne jest, aby same obrazy były prezentowane w przystępny sposób. Dla celów WCAG kontrast kolorów jest mierzony jako współczynnik. Istnieje wiele aplikacji i rozszerzeń przeglądarki, których można użyć do pomiaru tego wskaźnika.

Podczas gdy przypadkowe obrazy do dekoracji nie mają wymagań dotyczących kontrastu, tekst na tle powinien mieć współczynnik kontrastu 4,5:1. Elementy graficzne, takie jak wykresy, i elementy interfejsu użytkownika, takie jak klikalne ikony, wymagają 3:1.

Wreszcie prawie 1 na 20 osób jest daltonistami. Zastanów się, jakie kombinacje kolorów mogą sprawiać tym użytkownikom problemy.

Istnieje wiele różnych rodzajów daltonizmu. Aplikacje mogą być używane do symulowania wyglądu Twojej witryny dla daltonistów. Co więcej, skontaktuj się z osobami z daltonizmem lub innymi wadami wzroku, aby dowiedzieć się, jak użyteczna jest Twoja witryna.

5. Zapewnij dostępność ekranu dotykowego

Łatwo wpaść w pułapkę przekonania, że ​​witryna na komputery jest „domyślna”. Korzystanie ze smartfonów i tabletów stale rośnie wśród wszystkich użytkowników ze względu na ich wygodę. Urządzenia te są również ogólnie tańsze niż laptopy lub komputery stacjonarne.

Rozważ dostępność swojej witryny dla użytkowników o niższych dochodach i zwróć uwagę na swoją witrynę mobilną.

Stukanie i przesuwanie powinno być łatwe i intuicyjne. Cel twoich linków powinien być jasny i powinieneś starać się zminimalizować błędy w podsłuchu.

Pamiętaj, że palec jest znacznie większy niż kursor i zasłania użytkownikowi widok ekranu. Możesz to zrobić za pomocą dużych, dobrze rozmieszczonych przycisków. WCAG nakazuje rozmiar przycisku 44 x 44 piksele.

Rozważ fizyczne potrzeby klientów dzięki optymalizacji ekranu dotykowego. Niepełnosprawność może oznaczać, że klienci mają ograniczoną zręczność fizyczną lub wytrzymałość, więc unikaj rozszerzonych lub zbyt skomplikowanych wymagań dotyczących dotyku.

Gest „szczypania”, często wymagany do powiększania lub obracania, może być uciążliwy nawet dla pełnosprawnych użytkowników. Zamiast tego możesz chcieć mieć dotykany przycisk powiększenia, który jest świetnym znakiem, że zależy Ci na wygodzie swoich klientów.

6. Zapewnij łatwe wprowadzanie danych

Ma to ścisły związek z obszarem dostępności ekranu dotykowego.

Formularze w Twojej witrynie (do składania zamówień, nawiązywania kontaktu, zakładania konta itp.) powinny być łatwe dla Twoich klientów. Upewnij się, że wszystkie pola są wyraźnie oznaczone wymaganymi danymi wejściowymi.

Możesz również umieścić symbole zastępcze w polach, aby zilustrować, co klienci powinni wpisać. Na przykład zastępczy adres e-mail, taki jak [email protected]

Nawet w najbardziej przystępnych projektach zawsze jest miejsce na błąd ludzki. Ważne jest, aby Twoja witryna była odporna na błędy wejściowe. Nie pozwól, aby Twoi klienci czuli się głupio z powodu błędów i uczyń je łatwymi do naprawienia.

Najlepszym sposobem jest wyróżnianie błędów w czasie rzeczywistym, dzięki czemu klienci nie muszą przewijać długich formularzy. Nie polegaj tylko na kolorze, aby pokazać błędy; może to nie być dostępne dla użytkowników niedowidzących.

Komunikaty o błędach powinny być jasne, a nie zagadkowe, i dać klientom możliwość ostatecznego sprawdzenia przed ich przesłaniem.

Tolerancja na błędy nie tylko poprawia dostępność Twojej witryny. Sprawia również, że klienci czują się wspierani na każdym etapie ich kontaktów z Tobą.

Tworzenie intuicyjnych i intuicyjnych formularzy to jeden z wielu sposobów, w jaki możesz budować zaufanie swoich klientów, pokazując, że zależy Ci na ich doświadczeniu.

7. Dąż do informacyjnej prostoty

Przekazywanie informacji wyraźnie przynosi korzyści każdemu, kto korzysta z Twojej witryny. Pomaga osobom z trudnościami w uczeniu się lub czytaniu, użytkownikom niedowidzącym, pełnosprawnym i własnym pracownikom.

Przejrzyste informacje na Twojej stronie zmniejszą presję na zespoły obsługi klienta, zmniejszając liczbę zapytań wyjaśniających.

Akapity powinny być krótkie, a słownictwo nie bardziej skomplikowane niż to konieczne. Nie wahaj się używać terminów branżowych, które zrozumieją Twoi klienci, ale Twoja witryna nie jest miejscem, w którym można naginać słownictwo SAT.

W miarę możliwości eliminuj niejasności. Twoje dokładne znaczenie powinno być zawsze jasne, a funkcje linków w Twojej witrynie powinny być dokładnie oznaczone.

Celuj w minimalistyczny design, który podkreśla to, co dla Twoich klientów najważniejsze.

8. Zachowaj spójność

Dla niektórych niepełnosprawnych klientów zmiana może być niepokojąca. Chociaż aktualizacja witryny w miarę rozwoju marki jest w porządku, częste niepotrzebne zmiany mogą zniechęcić klientów.

Kiedy wydaje się, że tożsamość Twojej marki stale się zmienia, Twoi klienci są mniej skłonni do zaufania do Ciebie.

Spójność należy również zachować po stronie obsługi klienta.

Rozwiązania takie jak sieci definiowane programowo mogą pomóc w utrzymaniu spójności usług. Utrzymuj przyjazny, otwarty ton, aby wszyscy Twoi klienci czuli się wspierani.

Niektórzy klienci mogą potrzebować informacji powtarzanych częściej. Twój zespół CS powinien być na to przygotowany, ale warto też zastanowić się nad udostępnieniem informacji.

Funkcje ułatwień dostępu, takie jak kontrast kolorów i tekst alternatywny, powinny być spójne w każdym obszarze witryny.

Oferowanie niepełnosprawnym użytkownikom zupełnie innej wersji witryny może być kuszące. Jednak może to być coś innego i sprawić, że ci klienci poczują się, jakby byli ciężarem. Zamiast tego zintegruj dostępność ze swoją witryną od podstaw, z korzyścią dla wszystkich klientów.

9. Utrzymuj swoją witrynę gładką

Kolejnym problemem z dostępnością jest fakt, że nie każdy będzie miał dostęp do szybkiego internetu czy potężnego sprzętu.

Klienci na obszarach wiejskich, w krajach rozwijających się lub klienci o niskich dochodach mogą mieć problemy z Twoją witryną.

Zaprojektuj swoją witrynę tak, aby użytkownicy mogli wybrać, czy chcą oglądać treści pochłaniające dane, takie jak filmy. Istnieje wiele sposobów na zmniejszenie opóźnień w witrynie, aby przynosić korzyści tym klientom.

Zastanów się ponownie, w jaki sposób klienci uzyskują dostęp do Twojej witryny.

Zastanów się, jakich urządzeń używają i na jakich obszarach geograficznych się znajdują. Niezależnie od tego, jak oglądają Twoją witrynę, powinni cieszyć się bezproblemową obsługą. Nie chcesz, aby Twoi klienci poczuli, że korzystanie z Twojej witryny jest uciążliwym zadaniem.

Zapewnij dokładne, wysokiej jakości kodowanie, aby zmniejszyć frustrujące błędy. Postaraj się zmniejszyć liczbę stron, które Twoi klienci muszą klikać podczas wykonywania zadań.

Utrzymuj formularze na jak najmniejszej liczbie stron. Nikt nie lubi czekać, aż nowe strony załadują się co kilka sekund, zwłaszcza jeśli ich połączenie jest słabe.

10. Stwórz wizualną hierarchię w projektowaniu stron internetowych

Wspólnym wątkiem w wielu najlepszych projektach witryn jest przejrzysta hierarchia wizualna. Oznacza to, że nawigacja jest łatwa i oczywiste jest, jakie kroki powinni wykonać użytkownicy, aby wykonać różne zadania.

Możesz analizować korzystanie z witryny przez klientów i wyświetlać na pierwszym planie najczęściej używane funkcje. Unikaj „kafelkowania”, ponieważ jest to łatwo przytłaczające i niezbyt jasne.

Możesz grupować powiązane funkcje, ujednolicając opcje projektowe, takie jak kolor i kształt. Jednak nie powinieneś polegać tylko na tych funkcjach. Jak wspomniano, mogą być niedostępne. Używaj również tekstu na potrzeby czytników ekranu.

Celem hierarchii wizualnej jest przyspieszenie i ułatwienie klientom korzystania i przeglądania witryny.

Wykorzystaj wybrane przez siebie projekty, aby kierować klientów do odpowiednich sekcji swojej witryny. Zrozum potrzeby swoich klientów i podkreśl to, co jest dla nich najważniejsze

Ostatnie słowa na temat inkluzywności

Ostatecznie filozofią stojącą za dostępnością i inkluzywnością jest to, że niepełnosprawni użytkownicy są tak samo wartościowi jak każdy inny użytkownik. Może się to wydawać oczywiste, ale zaskakująca liczba marek nie stosuje tego w praktyce w swoich projektach stron internetowych.

Dokładanie wszelkich starań, aby zapewnić wszystkim klientom dobre wrażenia, zbuduje zaufanie i lojalność w Twojej bazie. Twoi klienci będą szczęśliwsi, a Ty wyróżnisz się jako firma, której naprawdę zależy.

Biografia autora

John Allen jest dyrektorem ds. globalnego SEO w RingCentral, globalnym dostawcy oprogramowania UCaaS, VoIP i automatycznego wybierania numeru. Ma ponad 14-letnie doświadczenie i rozległe doświadczenie w budowaniu i optymalizacji programów marketingu cyfrowego. Pisał dla serwisów takich jak Vault i 3DCart.