• Home
  • Technologia
  • Dostępny e-commerce - o standardach WCAG dla sklepów online

Dostępny e-commerce - o standardach WCAG dla sklepów online

27 maj 2020

Zakupy przez Internet, rezerwacja biletów do kina, zamawianie jedzenia online czy korzystanie z bankowości online lub załatwianie spraw w urzędzie online– to dla nas codzienność, Wyobraź sobie świat, w którym nie masz dostępu do tych usług internetowych. Dziwne, prawda? Nagle okazuje się, że dostępny dla każdego świat cyfrowy, wcale nie jest dostępny.

Ma sporo ograniczeń, z których nie zdajemy sobie na co dzień sprawy, a dla osób niepełnosprawnych czy starszych tworzy bariery nie do przejścia, jeśli aplikacje, systemy czy strony nie są dostosowane do standardów WCAG. Te same wytyczne odnośnie dostępności mają bardzo dużo znaczenie dla rynku e-commerce. Wiele firm nieświadomie ogranicza w ten sposób dostęp do swojej oferty dla potencjalnych klientów.

1. Co to jest e-commerce?

E-commerce, czyli handel elektroniczny prowadzony w Internecie. Towary oraz usługi są zamawiane przez Internet, a płatność i dostawa zamówionego towaru bądź usługi, może być dokonana w sieci lub poza nią. Transakcje mogą być dokonywane zarówno pomiędzy przedsiębiorstwami, osobami prywatnymi, instytucjami rządowymi lub innymi organizacjami prywatnymi, oraz publicznymi. Najbardziej popularną formą e-commerce, jest sprzedaż poprzez sklepy internetowe, portale aukcyjne oraz serwisy ogłoszeniowe. Handel elektroniczny dostarcza wielu korzyśći zarówno dla sprzedawców, jak i dla klientów.

Po swojej stronie sprzedawcy mogą wymienić takie zalety jak:

  • możliwość szybkiej aktualizacji oferty,
  • niższe koszty w porównaniu do sklepu stacjonarnego w szczególności w momencie zakładania biznesu,
  • redukcja kosztów (chociażby brak opłat za wynajem sklepu lub powierzchni magazynowych),
  • możliwość prowadzenia sprzedażu w modelu dropshippingowym,
  • możliwość szybkiego dodania do produktów opisów, parametrów czy zdjęć,
  • dostęp do nowych klientów,
  • mniejsza zależność od rynku lokalnego,
  • dostęp do nowych rynków zbytu.

Klienci natomiast dostrzegą takie plusy jak:

  • oszczędność czasu - towar kupuje się jednym „kliknięciem” bez potrzeby poświęcania czasu na dojazd do sklepu i stanie w kolejkach,
  • bardzo łatwy, oraz szybki dostęp do informacji, chociażby dotyczących parametrów produktu,
  • szybka możliwość sprawdzenia ofert oraz cen u konkurencji,
  • wygoda – zamówienie dostarczane jest do domu,
  • większy wybór asortymentu niż w sklepie stacjonarnym,
  • lepsza kontrola wydatków, widać faktyczny stan koszyka,
  • korzystniejsze ceny niż w sklepie stacjonarnym,
  • zakupy 24/7, 7 dni w tygodniu, w dowolnym momencie, w którym klient potrzebuje zrobić zakupy

2. Co to jest WCAG?

WCAG to wytyczne  dostępności dla stron internetowych i aplikacji (ang. Web Content Accessibility Guidelines). To zbiór dokumentów, które opublikowane zostały w roku 1999 przez WAI (Web Accessibility Initiative) i dotyczą one tworzenia stron internetowych. W roku 2008 został wprowadzony standard WCAG 2.0, a w roku 2018 pojawiła się aktualizacja standardu do wersji 2.1, która odpowiada w szczególności za zmiany związane ze sposobem interakcji ludzi z interfejsem witryn oraz urządzeń mobilnych (głównie chodzi tu o interakcję dotykową, czy mobilną). Obecnie w trakcie opracowywania są standardy 2.2. Co jest istotne, to fakt, że wszystkie wcześniejsze kryteria zgodności zostały zachowane, ale opis części z nich został rozwinięty o dodatkowe funkcjonalności i wdrożenia. Celem tych regulacji jest zwiększenie ilości serwisów oraz możliwości, które będą dostępne również dla osób z niepełnosprawnościami -  a stanowią oni aż 1/7 całej populacji. Dostosowując stronę do standardów WCAG, osoby z niepełnosprawnościami: ruchowymi, wzrokowymi, słuchowymi będą mogły bez problemu poruszać się po stronie internetowej i korzystać w pełni z możliwości, jakie dają aplikacje

Web Content Accessibility Guidelines

3. Dlaczego warto dostosować e-commerce do standardów WCAG??

Dostępność strony internetowej dla osób starszych oraz niewidomych może przynieść bardzo dużo korzyści. Dla przedsiębiorców, którzy:

  • Mogą dotrzeć z ofertą do nowych klientów,
  • Zwiększają potencjał zakupowy swojego biznesu,
  • Ale przede wszystkim stwarzają osobom niepełnosprawnym i starszym równe możliwości, korzystania z funkcji i wygód Internetu.


Dbając o równość szans dla wszystkich użytkowników Internetu, tworzą biznes odpowiedzielny społecznie oraz budują wizerunek firmy dbającej o wszystkich swoich klientów, umożliwiając osobom z ograniczeniami fizycznymi, łatwiejsze funkcjonowanie i wygodny dostęp do realizowania codziennych spraw czy zakupów.

Jak osoby niepełnosprawne mogą korzystastać ze stron internetowych i aplikacji?

Standardy WCAG określają dostosowanie stron i aplikacji, tak aby każda osoba z dowolnym rodzajem niepełnosprawności miała możliwość korzystania z funkcjonalności witryn i systemów internetowych w następujący sposób:

  • Z pomocą czytników ekranu - użytkownicy, którzy są niewidomi lub mają silną wadę wzroku, często używają czytników ekranowych do poruszania się w sieci. WCAG 2.1 wymaga, aby informacje przekazywane wizualnie, były również opisane w formie tekstowej.
  • Użytkownicy, którzy nie rozpoznają kolorów mają problem z rozróżniem barw o niskim kontraście, co oznacza, że np. nie będzie dla nich widoczna różnica między koszulką w kolorze czerwonym czy zielonym. WCAG wymaga aby większość produktów została odpowiednio opisana, tak aby użytkownik, który ma problem z rozróżnieniem barw, mógł na stronie produktu znaleźć informację o jego kolorze. W przypadku tekstu wymagany jest kontrast o minimalnym współczynniku 4,5:1.
  • Osoby z niepełnosprawnością ruchową poruszają się po aplikacji i stronie za pomocą klawiatury. Zgodnie z wytycznymi WCAG, wszystkie kluczowe funkcjonalności powinny być dostępne właśnie za pomocą klawiatury.
  • Użytkownicy z upośledzeniem poznawczym potrzebują jasnej struktury i łatwej w nawigacji, np.: pasek nawigacji powinien znajdować się zawsze w tym samym miejscu w stosunku do innych elementów.

Aby umożliwić wprowadzenie tych standardów, WCAG określiło odpowiednie wytyczne:

  • elementy graficzne – muszą zawierać zwięzły tekst alternatywny (alt), który ma za zadanie opisywać, co znajduje się na grafice lub gdy grafika jest odnośnikiem, powinna być informacja, dokąd ten odnośnik prowadzi. W przypadku gdy grafika ma zadanie jedynie ozdobne, to atrybut alt powinien pozostać pusty,
  • jak najmniej elementów animowanych - poruszające się obrazki oraz teksty rozpraszają użytkowników. Dodatkowo szybkie, animowane grafiki, mogą stanowić zagrożenie dla osób cierpiących na padaczkę fotogenną,
  • pliki multimedialne oraz Flash - powinny być dostępne w formie alternatywnej, nie jako podstawowa funkcja, np. wideo pokazujące zalety produktu, powinno być uruchamiane przez użytkownika, a nie po wejściu na stronę,
  • teksty znajdujące się na stronie - powinny być napisane w jak najprostszy sposób, oczywiście w miarę możliwości, tak aby każdy mógł je zrozumieć, bez względu na wykształcenie, wiek, czy niepełnosprawność intelektualną
  • publikowane teksty, powinny być czytelne - opisy produktów, dane techniczne, powinny być widoczne i łatwe do przeczytania
  • nawigacja - powinna być spójna, logiczna, i jednakowa w obrębie całego serwisu i również dostępna z poziomu klawiatury
  • wszystkie elementy aktywne - na przykład banery czy odnośniki powinny być wyraźne oraz klarowne, bardzo dobrym rozwiązaniem jest ramka widoczna w trakcie nawigacji po stronie klawiszem TAB,
  • odnośniki - wszystkie bez najmniejszego wyjątku powinny być unikalne, zrozumiałe oraz jasne, również poza kontekstem. Należy unikać linków typu „kliknij tutaj” lub „więcej”. Dodatkowo odnośniki nie mogą otwierać się bez ostrzeżenia w nowym oknie lub zakładce przeglądarki,
  • „skip links” - zalecane jest stosowanie takich usprawnień, które umożliwiają przejście bezpośrednio do treści pojedynczej strony (w kategorii, produktu). Jest to bardzo ważna w sklepach, które mają mocno rozbudowaną nawigację oraz menu,
  • kontrast kolorystyczny - wszystkich elementów, które za zadanie mają przekazywanie treści (to jest linków, tekstów, banerów), muszą mieć stosunek jasności tekstu do tła co najmniej 4,5 do 1, a najlepiej jeśli kontrast nie jest mniejszy niż 7 do 1,
  • zoom strony - powinna być możliwość powiększenia strony, co najmniej o 200%, za pomocą narzędzi, które oferuje przeglądarka, dodatkowo powiększona strona nie może „gubić” treści,
  • tytuły - powinny być unikalne oraz powinny informować o treści podstrony, na której obecnie znajduje się użytkownik. Treść powinna być zbudowana zgodnie ze schematem: [Tytuł podstrony] – [Nazwa Instytucji],
  • listy uporządkowane oraz nieuporządkowane, powinny służyć też do uporządkowanie treści w tekstach lub elementach znajdujących się w nawigacji,
  • ramki - znajdujące się na stronie ramki powinny być odpowiednio zatytułowane
  • formularzew tym formularze wyszukiwarki - powinny być zbudowane zgodnie ze standardami, czyli każde pole formularza i jego przyciski powinny być właściwie opisane,
  • serwis - powinien być dostępny w przeglądarkach oraz urządzeniach z wyłączoną obsługą CSS.

To tylko niektóre z elementów istotnych dla WCAG. Ich wdrożenie wymaga pracy i konsultacji z doświadczonym zespołem programistów w temacie dostępności.

Wdrożenie wytycznych WCAG, to nie tylko umożliwienie korzystania osobom niepełnosprawnym czy starszym z danego serwisu. To również zmiana istotna dla sprawnych użytkowników, ponieważ stworzenie strony, która jest intuicyjna, prosta i łatwa w nawigaci, poprawia „user experience” każdego użytkownika, który robi tutaj zakupy.

Małe zmiany  w kodzie czy strukturze serwisu, to duże zmiany dla funkcjonowania osób niepełnosprawnych. Stwarzając im takie same szanse na korzystanie z Internetu, nawet w tak „przyziemnych” sprawach, jak robienie zakupów, dajemy im kolejną możliwość do niezależnego działania i załatwiania spraw codziennych we własnym zakresie.

Twój biznes e-commerce oczywiście też zyskuje i to w dwóch obszarach: ekonomicznym i wizerunkowym. W ten sposób zwiększasz grono potencjalnych klientów oraz dostarczasz wszystkim swoim klientom serwis i aplikację funkcjonalną oraz łatwą w odbiorze, a to w znacznym stopniu przekłada się na ilość zamówień w e-commerce. Dodatkowo, zyskujesz przewagę wśród konkurencji, jako innowacyjna firma prowadząca odpowiedzialny biznes i tworząca rozwiązania dostępne dla wszystkich użytkowników Internetu.

Dowiedz się więcej: https://ttpsc.com/pl/blog/wcag/

Zapisz się do naszego Newslettera

Home | O nas | Reklama | Kontakt