Integracyjne projektowanie stron internetowych: dlaczego to ma znaczenie i jak to zrobić
Opublikowany: 2023-03-16Integracja społeczna stała się kluczową kwestią, a wiele organizacji i grup rzeczników szuka sposobów na powstrzymanie dyskryminacji osób doświadczających wykluczenia społecznego.
Ale co ze środowiskami cyfrowymi? Ponieważ 15% światowej populacji żyje z jakąś formą niepełnosprawności, integracja w doświadczeniach online jest czymś więcej niż tylko trendem.
Weźmy na przykład projektowanie stron internetowych. Prawdopodobnie tysiące osób odwiedza Twoją witrynę, ale nie może się po niej poruszać. Więc z czym ci to zostaje? Miliony straconych okazji, by zrobić na nich wrażenie, sprostać wyzwaniom i zbudować długoterminowe relacje. Dlatego firmy zaczynają koncentrować się na stworzeniu równego doświadczenia przeglądania sieci dla wszystkich użytkowników.
Ale prawda jest taka, że przed nami jeszcze długa droga, aby integracyjne projektowanie stron internetowych stało się nową normą. Większość marketerów wydaje się niechętna wdrażaniu taktyki projektowania włączającego, myśląc, że jest to czasochłonne i kosztowne. W tym artykule zajmiemy się tym popularnym przekonaniem, dzieląc się wszystkim, co trzeba wiedzieć o integracyjnym projektowaniu stron internetowych, dlaczego jest to potrzebne i najlepszymi praktykami, aby zrobić to dobrze.
Co to jest integracyjne projektowanie stron internetowych?
Inkluzywne projektowanie stron internetowych to praktyka uwzględniania specyficznych potrzeb użytkowników, którzy w różny sposób doświadczają wykluczenia z powodu przynależności do grupy mniejszościowej. Integracja projektowa obejmuje nie tylko osoby z trwałą niepełnosprawnością, ale także grupy uciskane lub każdego użytkownika, który doświadcza ograniczeń lub wykluczeń podczas interakcji z produktami cyfrowymi.
Jako profesjonalista UX stoisz przed odpowiedzialnością za tworzenie produktów dostępnych dla wszystkich. Niezależnie od tego, czy chodzi o to, jak zbudować firmowego bloga, czy jak utworzyć stronę docelową i niezależnie od rodzaju ograniczeń napotykanych przez odwiedzających, dostosowanie się do potrzeb przeglądania wszystkich użytkowników nie powinno być późniejszą refleksją. Powiedziawszy to, nie powinniśmy mylić projektowania włączającego z praktykami dostępności, ponieważ to znacznie więcej.
Inkluzywne projektowanie stron internetowych a dostępne projektowanie stron internetowych
Istnieje powszechne błędne przekonanie, że integracyjne projektowanie stron internetowych jest odpowiednikiem dostępnego projektowania stron internetowych. Dostępność i integracja w projektowaniu mogą iść w parze, ale to nie to samo. Inkluzywne projektowanie stron internetowych to ogólny termin obejmujący metody ułatwień dostępu, które obejmują ułatwianie zrozumienia produktów cyfrowych osobom niepełnosprawnym. Inkluzywność obejmuje inne czynniki, takie jak ograniczenia techniczne, bariery językowe i demograficzne lub wszelkiego rodzaju ograniczenia sytuacyjne, które uniemożliwiają użytkownikom pełne korzystanie ze stron internetowych.
Kiedy mówimy o projektowaniu włączającym, tak naprawdę mamy na myśli projektowanie uniwersalne, które uwzględnia wszelkiego rodzaju ograniczenia, od osób korzystających z małego ekranu lub wolnego połączenia internetowego po osoby z tymczasowymi niepełnosprawnościami, takimi jak uraz ręki. Projektowanie integracyjne nie ogranicza się do dostarczania dostępnych i łatwych w użyciu rozwiązań, ale co ważniejsze, powinno sprawić, że ludzie poczują się docenieni.
Krótko mówiąc, w integracyjnym projektowaniu stron internetowych chodzi bardziej o to, jak podejść do projektowania pod kątem różnorodności, a nie o wynik jako taki.
Podstawowe filary integracyjnego projektowania stron internetowych
Aby tworzyć integracyjne produkty cyfrowe, projektanci muszą tworzyć doświadczenia, które odpowiadają potrzebom i okolicznościom każdego użytkownika. Dlatego tak ważne jest, aby od samego początku przyjąć podejście projektowe obejmujące wszystkich.
Przyjrzyjmy się filarom projektowania włączającego, o których należy pamiętać.
- Zidentyfikuj rodzaje wykluczeń. Zanim zaczniesz, poszukaj punktów wykluczenia i wykorzystaj je jako punkty wyjścia do tworzenia nowych i bardziej włączających opcji. Gdy projektanci dowiedzą się, w jaki sposób i dlaczego poszczególne osoby czują się wykluczone, łatwiej jest stworzyć plan działania na rzecz integracyjnych doświadczeń cyfrowych.
- Zaangażuj użytkowników. Użytkownicy powinni znajdować się w centrum każdego rozwiązania cyfrowego. Aby projektanci wiedzieli, co cenią różne grupy użytkowników, zaangażowanie ich powinno być priorytetem. Staje się to jeszcze ważniejsze dla grup, o których projektanci niewiele wiedzą. Dlatego poproś ich o opinię, aby poznać ich zmieniające się potrzeby i przetestować pomysły na podstawie ich wkładu, aby zapewnić wrażenia, które docenią.
- Trzymaj się z dala od osobistych uprzedzeń. Włącz użytkowników z różnych środowisk i społeczności, aby uniknąć osobistych uprzedzeń utrudniających projektowanie sprawiedliwych rozwiązań. Pomoże ci to uświadomić sobie, kogo pomijasz w procesie projektowania.
- Zacznij od swojego zespołu. Pierwszym krokiem do uniknięcia uprzedzeń jest rozpoczęcie od własnego zespołu. Posiadanie integracyjnego personelu nie tylko pomaga uświadomić sobie osobiste uprzedzenia, ale także je przezwyciężyć. Zespół projektowy składający się z osób o różnym pochodzeniu i umiejętnościach jest kluczem do odblokowania szerszego zakresu wyzwań dla użytkowników.
Dlaczego integracja jest koniecznością w projektowaniu stron internetowych?
Potrzeby użytkowników są różnorodne. Tak więc założenie uniwersalnego podejścia prawdopodobnie doprowadzi do katastrofy. Ponadto wszechstronny rozwój w zakresie projektowania stron internetowych pomaga zdobyć pozycję lidera w branży i przewyższyć konkurencję.
Przyjrzyjmy się najważniejszym powodom, dla których warto przyjąć integracyjny sposób myślenia podczas projektowania produktów cyfrowych.
1. Dotrzyj do większej grupy odbiorców
Odkładając na bok wpływ społeczny, integracyjne projektowanie stron internetowych ma kluczowe znaczenie również z biznesowego punktu widzenia. Jest rzeczą oczywistą, że stracisz klientów, jeśli pominiesz dużą część odbiorców. Funkcje włączające, takie jak opcje tłumaczenia, komponenty wizualne lub asystenci głosowi, pomagają dotrzeć do większej liczby odbiorców i zwiększają integrację w projekcie witryny. Koncentruj się na budowaniu uniwersalnie pozytywnego doświadczenia, a użytkownicy wynagrodzą Cię swoją lojalnością.
2. Ludzie tego od ciebie oczekują
Platformy mediów społecznościowych zwróciły uwagę na niesprawiedliwości społeczne, więc dzisiejsi użytkownicy są bardziej świadomi społecznie niż kiedykolwiek. Ludzie oczekują, że firmy przestawią się na integrację, ponieważ jest to słuszne. Dlatego włączenie osób o różnych potrzebach i zdolnościach to coś więcej niż decyzja biznesowa.
Jeśli nie robisz wszystkiego, co w Twojej mocy, aby uwzględnić użytkowników, wykluczasz ich z interakcji z Twoimi produktami, nawet nieumyślnie. Nadszedł czas, aby projektować pod kątem różnorodności, ponieważ ma ona wpływ na to, czy użytkownicy zdecydują się zostać klientami, czy nie.
3. Rozwiązuj jednocześnie różne problemy
Każdy odwiedzający witrynę ma zainteresowania i motywacje, a także ograniczenia swoich możliwości wynikające z różnych okoliczności. W rezultacie każdy z nas może doświadczyć wykluczenia podczas interakcji z projektowaniem stron internetowych. Właśnie tam projektowanie integracyjne może łączyć różnych użytkowników z różnymi ograniczeniami w podobny sposób. Na przykład duży, czysty tekst jest korzystny dla osób ze słabym wzrokiem, ale pomaga także kierowcom i innym osobom przeglądającym strony w ruchu.
4. Buduj świadomość marki
Konsumenci uwielbiają marki, które ułatwiają im życie, a nic nie wskazuje na to bardziej niż inkluzywne elementy projektu. Internauci mają krótszą zdolność koncentracji i spędzają więcej czasu na różnych ekranach. Dlatego problemy takie jak zespół cieśni nadgarstka czy zespół widzenia komputerowego są częstsze niż nam się wydaje. Ci ludzie wolą odwiedzać strony internetowe, po których mogą łatwo poruszać się na dowolnym urządzeniu.
Kiedy projektujesz swoją witrynę internetową z myślą o integracji, odwiedzający czują się mile widziani i zadowoleni z podróży klienta, którą im oferujesz. W ten sposób Twoja marka pozostaje na pierwszym miejscu i ma przewagę konkurencyjną.
5. Poprawia Twoje SEO
Wyszukiwarki preferują strony internetowe zoptymalizowane pod kątem lepszego doświadczenia użytkownika i funkcji integracji. Jeśli nie nadążasz za najlepszymi praktykami w zakresie ułatwień dostępu, atrakcyjna witryna internetowa nie przyniesie Ci korzyści pod względem SEO.
Wielu marketerów ma tendencję do pomijania użyteczności i dostępności na swoich stronach internetowych. Jest to jednak kuloodporny sposób dla wyszukiwarek na zauważenie stron internetowych i poprawę ich rankingu. Nie tylko dbasz o zadowolenie Google, dostosowując się do jego algorytmu wyszukiwania, ale także zapewniasz odwiedzającym najlepsze wrażenia na stronie.
8 najlepszych praktyk projektowania włączającego
Projektowanie bardziej integracyjne może być frustrujące, ponieważ trudno jest ocenić, czy Twoja strona internetowa oferuje równe wrażenia online. Jeśli mamy wybrać punkt wyjścia, to jest to odrzucenie wszelkich założeń, a także decyzja o faworyzowaniu wszystkich użytkowników, a nie tylko przeciętnego. Aby odnieść sukces, aby wszyscy czuli się włączeni, czytaj dalej, aby odkryć najlepsze praktyki, których należy przestrzegać jako projektant.

1. Twórz dobrze ustrukturyzowane, czytelne treści
Treść Twojej witryny jest integralną częścią Twojej strategii marketingu treści. Czytelna i starannie ustrukturyzowana treść jest kluczem do utrzymania zaangażowania odwiedzających.
Wybierz strukturę, która umożliwia odczytanie jej osobom z upośledzeniem umysłowym lub wzrokowym. Powinieneś także zawierać logiczną sekwencję, która poprowadzi użytkowników przez Twoje treści i usunie punkty sporne.
Oprócz tych kroków istnieją proste zmiany, które mają wpływ na sposób interakcji użytkowników z Twoimi treściami. Oto kilka kluczowych wskazówek dotyczących czytelnej i sensownej sekwencji treści:
- Używaj prostego języka z krótkimi zdaniami, aby Twoje treści były łatwe do odczytania i przyswojenia
- Podziel długie bloki tekstu na mniejsze sekcje i używaj nagłówków, list wypunktowanych i obrazów, aby pomóc użytkownikom niedowidzącym lub mającym problemy z czytaniem
- Dołącz elementy, takie jak akordeony, aby ukryć treści, które odwracają uwagę odwiedzających od podstawowych treści, do których muszą najpierw uzyskać dostęp
- Upewnij się, że używasz odpowiedniego kontrastu między treścią a tłem
2. Zadbaj o przejrzystość i prostotę układu
Hierarchia jest równie ważna w przypadku układu, jak i treści. Przejrzystość i minimalizm nigdy nie wyjdą z mody jako trend w projektowaniu i nie bez powodu, ponieważ odwiedzający nie doceniają niechlujnych projektów ze skomplikowaną nawigacją i chaotycznymi informacjami. Przejrzyste i proste układy przekładają się na intuicyjne, przyjazne dla użytkownika i atrakcyjne wizualnie interfejsy.
Upewnij się, że budujesz podstawowe funkcje swojej witryny, które podkreślają jej użyteczność, nie odciągając odwiedzających od najistotniejszych informacji. Następnie możesz dodać wszelkie niezbędne komponenty, aby pokazać wartość i dalej je angażować.
3. Zapewnij spójność
Będąc projektantem, wiesz już, że spójność jest niezbędna dla każdego tworzonego produktu cyfrowego. Jest to jeszcze ważniejsze, gdy projektujesz z myślą o różnych odbiorcach. Niespójne projekty zwykle wprowadzają użytkowników w błąd i prowadzą do opuszczenia Twojej witryny. Jest to jeszcze trudniejsze dla osób z niepełnosprawnością poznawczą, ponieważ zmagają się ze złożonymi interfejsami, które nie mają sensu.
Spójność nawigacji w Twojej witrynie poprawia łatwość użytkowania i może skutkować łatwiejszymi i szybszymi konwersjami. Ale nie zrozumcie nas źle – spójność nie oznacza przewidywalności. Upewnij się więc, że usuwasz tylko te elementy, które powodują frustrację, pozostając przy tym jak najbardziej kreatywnym.
4. Użyj tekstu alternatywnego dla obrazów
Doświadczeni marketerzy wiedzą, jak elementy wizualne, takie jak obrazy, filmy lub infografiki, przyciągają uwagę, jednocześnie przekazując uczucia. Ale umieszczanie obrazów lub filmów na swojej stronie internetowej jest bezużyteczne, jeśli nie uwzględnisz odpowiednio alternatywnego tekstu i podpisów.
Czytniki ekranu polegają na tekście alternatywnym, aby opisywać obrazy osobom z wadami wzroku. Starannie wykonane i krótkie opisy pomagają uniknąć błędnej interpretacji, informując odwiedzających, o czym jest obraz.
Pisząc tekst alternatywny dla swoich obrazów, należy wziąć pod uwagę kilka ważnych aspektów:
- Opisz krótko, ale dokładnie, co dzieje się na obrazie, aby użytkownicy szybko mieli dostęp do najważniejszych informacji
- Pamiętaj, aby uwzględnić sposób, w jaki obraz odnosi się do otaczającego środowiska
- Gdy obraz jest głównie dekoracyjny, użyj pustego pola <alt>, aby czytniki ekranu wiedziały, że mogą pominąć ten obraz
Nie zapomnij też dołączyć napisów do treści wideo, aby osoby niedosłyszące mogły je zrozumieć. Upewnij się, że umieściłeś napisy do każdego filmu prezentowanego w Twojej witrynie, aby użytkownicy mogli w pełni zrozumieć Twój przekaz. Wreszcie, cokolwiek robisz, nie umieszczaj swoich filmów w trybie autoodtwarzania, ponieważ zwiększa to obciążenie poznawcze użytkownika.
5. Zdecyduj się na kopię włącznie
Błędem popełnianym przez wielu marketerów jest zaniedbywanie tekstu na rzecz grafiki. Ale słowa są naszymi narzędziami do wyrażania siebie i tworzenia połączeń. To samo dotyczy projektowania UX. Aby otworzyć się na szerszą publiczność, potrzebujesz wszechstronnej i zwięzłej kopii. Przyjrzyjmy się kilku taktykom, które należy wdrożyć, aby uzyskać kopię obejmującą:
- Wybierz proste słowa i unikaj skomplikowanych terminów lub niepotrzebnego żargonu. Dzięki temu osoby z trudnościami w uczeniu się i poznawczymi będą w stanie zrozumieć Twój przekaz.
- Jeśli musisz używać skomplikowanych pojęć lub terminów w swojej witrynie, rozważ użycie obrazów lub filmów, aby uprościć korzystanie z nich użytkownikom niepełnosprawnym lub osobom, dla których język nie jest językiem ojczystym
- Zachowaj szczególną ostrożność podczas umieszczania kopii w formularzach online. Jest to jeden z najbardziej wrażliwych, ale zaniedbywanych elementów generowania leadów. Dowiedz się, jakie pytania musisz zadać i jak to zrobić, i pamiętaj o dostępnych opcjach odpowiedzi.
- Wyklucz zaimki związane z płcią i określenia związane z płcią (np. „panie i panowie”), aby wszyscy użytkownicy czuli się odpowiednio reprezentowani.
6. Mądrze wybieraj kolory
Kolor odgrywa ogromną rolę w projekcie, ponieważ wywołuje emocje i przyciąga uwagę widzów. Problem polega na tym, że ma ograniczenia, ponieważ nie wszyscy użytkownicy postrzegają kolory w ten sam sposób.
Na przykład osoby ze ślepotą barw czerwono-zielonych mają problemy z widzeniem odcieni zieleni i czerwieni. Ponadto odwiedzający z różnych środowisk kulturowych inaczej interpretują kolory, co może wpłynąć na ich zrozumienie treści. Na przykład odwiedzający z wadami wzroku lub daltonistami mogą mieć problemy ze zrozumieniem wykresów kołowych przedstawiających dane w postaci różnic kolorów.
Co możesz zrobić, aby uniknąć tego nieszczęścia wśród gości? Nie polegaj na kolorze jako jedynej wizualnej wskazówce, ale spróbuj włączyć elementy takie jak etykiety, ikony lub pogrubiony tekst. Ponadto unikaj używania mocno kontrastujących kolorów i umieszczania obok siebie podobnych kolorów. Takie małe rzeczy sprawiają, że użytkownicy czują się komfortowo podczas korzystania z Twojej witryny, a jednocześnie niwelują różnice między różnymi grupami odbiorców.
Jeśli nie wiesz od czego zacząć, możesz skorzystać z narzędzi takich jak Color Safe lub WebAIM, które wygenerują dla Ciebie dostępne kombinacje kolorów.
7. Nie zapomnij o dostępności klawiatury
Jednym z kluczowych elementów do przetestowania podczas projektowania witryny jest dostępność klawiatury. Jeśli nie zoptymalizujesz swojej witryny pod kątem nawigacji za pomocą klawiatury, utrudnisz odwiedzającym z upośledzeniem wzroku lub ruchu. Pamiętaj, że klawiatura może być ich jedynym środkiem dostępu do Twojej witryny i interakcji z jej komponentami.
Ale co oznacza optymalizacja pod kątem nawigacji za pomocą klawiatury? Spróbuj przejść od lewej do prawej oraz w górę iw dół, aby upewnić się, że możesz poruszać się po stronie internetowej, używając tylko klawiatury.
Nie zapomnij sprawdzić, jak łatwy lub trudny jest proces nawigacji, po prostu używając Tab. Klawisz Tab jest równie ważny dla ułatwień dostępu za pomocą klawiatury, ponieważ w ten sposób użytkownicy korzystający tylko z klawiatury poruszają się po stronach internetowych. Główną ideą tej opcji jest zaoferowanie im możliwości wybrania każdego elementu na Twojej stronie poprzez kliknięcie klawisza Tab.
Znaczenie integracji
Od wielu lat projektowanie stron internetowych polega na tworzeniu atrakcyjnych, kolorowych i niezwykłych stron internetowych, które przyciągają uwagę. I chociaż te cechy są nadal istotne, są niewystarczające, aby zapewnić odwiedzającym naprawdę przyjemne korzystanie z Internetu.
Wyobraź sobie przez chwilę, że tworzysz przyciągającą wzrok stronę internetową. Jeśli nie zbudujesz go z myślą o integracyjnym projektowaniu stron internetowych, uniemożliwisz dostęp do niego dużemu procentowi użytkowników. Efektem końcowym powinien być uniwersalny design dobrze odbierany przez każdego użytkownika na każdym urządzeniu.
Przekształcenie witryny w integracyjną i równą przestrzeń dla wszystkich odwiedzających nie jest tak onieśmielające, jak się wydaje. Aby odnieść sukces, musisz najpierw dobrze zrozumieć wyzwania, przed którymi stoją różne grupy odbiorców podczas interakcji z produktami cyfrowymi.
Pamiętaj, aby postępować zgodnie z najlepszymi praktykami przedstawionymi w tym przewodniku, aby tworzyć użyteczne i wartościowe strony internetowe. I cokolwiek robisz, nigdy nie przestawaj nadążać za stale zmieniającymi się potrzebami odbiorców w zakresie integracyjnych i zorientowanych na klienta cyfrowych doświadczeń.
