Posiadanie witryny eCommerce ze żałosnym dostępem do jej docelowych klientów jest jak posiadanie dobrze wyglądającego samochodu, który nie ma wydajnego silnika. Nikt nie chciałby odwiedzać strony internetowej, której ładowanie zajmuje zbyt dużo czasu i często frustruje użytkownika. Jeśli chcesz poprawić sytuację swojego przedsiębiorstwa, musisz dążyć do zwiększenia dostępności witryny, by uzyskać doskonałe współczynniki konwersji i sprzedaży produktów. Przy wsparciu skutecznego projektu strony internetowej eCommerce, bez szwu nawigacja po stronie, szybszy proces kasowania, imponujący czas ładowania strony i wydajność, można łatwo osiągnąć niezwykły sukces w zakresie ruchu na stronie, współczynników konwersji, zaangażowania klientów i sprzedaży produktów. Oto szczegółowe zestawienie wszystkich składników wymaganych do zapewnienia niewiarygodnej dostępności witryny.
1. Poprawić zasięg i jakość materiałów tekstowych-
Każda strona internetowa bez imponującej i interesującej treści lub tekstu jest po prostu bezużyteczna. Co więcej, najnowsze algorytmy Google, takie jak Panda, Hummingbird i inne, wielokrotnie udowodniły wyższość treści generujących wymagany ruch w witrynie i współczynniki konwersji. Pamiętaj, aby zwracać odpowiednią uwagę na treść oraz grafikę lub obrazy w celu zwiększenia czytelności twoich tekstów pisanych. Spójrz na różne sposoby bezproblemowego wykonania tego kluczowego zadania.
- Użyj wysokiej jakości zoptymalizowanych obrazów, aby zwiększyć wartość i atrakcyjność swoich tekstów pisanych. Ponadto użyj skutecznego tagu alt obrazu wraz z podpisem i opisem, aby poprawić przyjazność SEO treści.
- Oferuj wysokiej jakości krótkie filmy z twoją zawartością (produkt wideo), aby treści były bardziej atrakcyjne i warte zachodu.
- Korzystaj ze skutecznej alternatywnej treści audio, która nie wpływa na ogólną wydajność i czas ładowania Twojej witryny.
- Korzystaj z usług transkryptu w postaci zwykłego tekstu lub kanału RSS, aby udostępnić treść witryny dużej liczbie użytkowników.
- Dołącz napis zamknięty, aby zoptymalizować jakość wideo swoich docelowych klientów.
2. Zatrudnij sposoby, aby przeczytać treść dla swoich docelowych klientów
Istnieje wiele osób, które mogą nie być w stanie prawidłowo odczytać treści witryny z powodu wad wzroku, niewielkiego rozmiaru czcionki lub nieczytelnego rodzaju czcionki w tekście pisanym. Aby zapewnić bezproblemową dostępność witryny dla tego typu klientów, obowiązkowe jest posiadanie wersji audio strony i treści witryny. Ten nagrany plik dźwiękowy może wygodnie przekazać pisemną wiadomość z Twojej witryny i jej wewnętrznych stron do docelowych klientów. Poza tym istnieją różne programy do odczytu ekranu, takie jak Microsoft Narrator, JAWS z Freedom Scientific, VoiceOver dla systemów Mac, Orca (open source) dla systemów opartych na Uniksie, NVDA (open source), Dolphin Supernova by Dolphin i różne takie inne.
3. Podejmij wymagane kroki, aby usprawnić nawigację po witrynie (szczególnie formularze) –
Co to jest dobra strona internetowa, jeśli nie pozwala użytkownikom poruszać się po niej płynnie? Byłoby to marnotrawstwem twojego czasu, pieniędzy i wysiłków, jeśli nawigacja po twojej witrynie jest trudnym zadaniem. Na Twojej witrynie może występować wiele czynników, które mogą stanowić główną przeszkodę w płynnej nawigacji po witrynie. Należy zwrócić szczególną uwagę na te elementy witryny, takie jak formularze rejestracyjne, strona zamówienia, obrazy, filmy wideo, łącza i inne podobne obszary, aby zapewnić łatwą nawigację w witrynie.
Wśród nich mówi się, że formy mają drastyczny wpływ na wydajność strony i nawigację. Musisz wyeliminować niepotrzebne pola, nielogiczne etykiety i inne podobne czynniki, aby odwiedzający mogli wypełnić formularze witryny bez żadnych przeszkód. Co więcej, musisz unikać ograniczeń czasowych i używać prawidłowych nagłówków treści w swojej witrynie, aby ułatwić szybszą nawigację. Aby zwiększyć dostępność formularzy witryny, musisz wykonać następujące kroki.
- Użyj dobrze umieszczonej i opisowej etykiety z każdym polem w formularzu.
- Aby ustanowić efektywną relację między polem tekstowym a polem formularza, można użyć znacznika <label> lub <ARIA>.
- Upewnij się, że kolejność kart w formularzu jest prawidłowo synchronizowana z kolejnością pól formularza.
- W przypadku podobnych lub pokrewnych pól w formularzu można je pogrupować przy użyciu zestawów pól. Weźmy na przykład, pola takie jak "Nazwa ulicy / Miejscowość", "Miejscowość / Miasto" i "Stan / prowincja" mogą być połączone w jednym polu "Adres korespondencyjny".
- Poinformuj użytkowników o obowiązkowych polach w formularzu za pomocą symbolu gwiazdek (*). Oprócz tego możesz wprowadzić wymagane pola za pomocą właściwości ARIA. Użyj pola ARIA required = "true" dla pól formularza obowiązkowego i ARIA required = "false", jeśli pole ma charakter opcjonalny.
- Podaj informacje o klientach dotyczące pomyślnego złożenia formularza lub błędów związanych z przesyłaniem. Pokaż błędy w odpowiednim miejscu i miejscu w formularzu, aby zwiększyć szanse na szybsze rozwiązywanie błędów, które mogą pomóc w szybkim przesłaniu formularza.
- Unikaj używania kodów CAPTCHA do sprawdzania poprawności formularza ze względu na problemy z niedostępnością i wydajnością. Istnieją inne alternatywy, takie jak Słodki Captcha, PlayThru, NuCaptcha, pola wyboru JavaScript po stronie klienta i inne, które mogą być używane do sprawdzania poprawności danych formularzy. Aby uzyskać więcej informacji na temat wysyłania formularzy za darmo ze spamem, możesz sprawdź ten link.
4. Wybierz kolor, który jest w rezonansie z treścią witryny, obrazami, tłem i innymi takimi elementami-
Aby zapewnić efektywną czytelność witryny, ważne jest, aby wybrać odpowiedni kolor dla tła i pierwszoplanowych elementów. Pamiętaj, aby użyć kontrastowego koloru tekstu i tła w celu lepszego dostępu do witryny. Uważaj na używanie podobnych kolorów zarówno tekstu, jak i tła witryny, np. Używanie czarnego tekstu wraz z fioletem, brązem lub innym ciemnym kolorem w znacznym stopniu wpłynie na użyteczność Twojej witryny. Normalny współczynnik kontrastu podczas używania koloru dla tła i pierwszoplanowych elementów powinien wynosić około 7: 1, ale nawet współczynnik kontrastu 4.5: 1 będzie również uwzględniał widoczność twoich treści i zapewni skuteczną dostępność twojej strony internetowej. Możesz sprawdzić kombinację kolorów za pomocątestowanie a / b i narzędzia termowizyjne.
5. Zapewnij odpowiedni rozmiar czcionki treści
Byłoby praktycznie niedojrzałe i naiwne, by oczekiwać od czytelników wyjątkowego widoku 6 / 6, aby mogli bez trudu przeczytać małą czcionkę na swojej stronie. Nie zmuszaj swoich klientów do zbytniego zmagania się z treścią swojej witryny. Aby ułatwić bezproblemowy dostęp do treści witryny, należy używać względnych rozmiarów czcionek wyrażonych w procentach lub ems, a nie przy użyciu bezwzględnych rozmiarów czcionek wyrażonych w punktach lub pikselach. W związku z powyższą praktyką jest praktycznie o wiele łatwiej dla użytkowników, aby wprowadzić pożądane zmiany w rozmiarach czcionek zgodnie z ich wymaganiami i wzrokiem. Tak więc potrzeba godziny skupić się na rozmiarze czcionki, a nie tylko na poprawie atrakcyjności wizualnej witryny.
6. Rola technologii Assistive w dostępie do strony internetowej-
Technologia wspomagająca, znana również jako technologia adaptacyjna (AT), jest w rzeczywistości błogosławieństwem dla osób z różnymi rodzajami niepełnosprawności związanych z zaburzeniami widzenia, mowy, poznawania, motoryki lub innych takich zaburzeń fizycznych i psychicznych, umożliwiających dostęp do różnych obszarów witryny internetowej bez wysiłku, które wykorzystują precyzyjne ruch myszy, pozycjonowanie lub kliknięcia. Technologia ta stanowi grupę urządzeń wspomagających, adaptacyjnych i rehabilitacyjnych przeznaczonych dla osób z różnymi niepełnosprawnościami oraz procesu, który zajmuje się lokalizacją, wyborem i wykorzystaniem tych urządzeń. Ta technologia zapewniła wszystkim osobom niepełnosprawnym ogromne poczucie wolności dzięki różnym ulepszeniom, które zmieniły sposób, w jaki te osoby używały różnych urządzeń cyfrowych.
Różne urządzenia, takie jak czytniki ekranu, system brajlowski, oprogramowanie do powiększania ekranu, oprogramowanie do rozpoznawania mowy, dostęp do przełącznika i inne podobne urządzenia, wykonały ogromną pracę w celu zapewnienia bezproblemowej dostępności strony dla osób z różnymi rodzajami niepełnosprawności. Aby uzyskać więcej informacji na temat różnych typów technologii wspomagających, które działają jako światło przewodnie dla osób niepełnosprawnych, wystarczy wykonać proste połączyć.
7. Popraw wydajność i charakter twoich linków
Aby skierować większą liczbę osób do wybranej lokalizacji linków, upewnij się, że linki mają odpowiednią etykietę i kolor, aby wskazać na nich docelowych klientów. Użyj tekstu bardziej kontekstowego niż te proste wyrażenia, takie jak "kliknij tutaj", "czytaj więcej", "dowiedz się więcej" i inne tego typu stwierdzenia, które mogą zachęcić docelowych klientów do kliknięcia konkretnego linku. Dalej wybierz odpowiedni kolor link do uzyskania większej uwagi klienta i dostępności łącza.
8. Użyj HTML, aby poprawić dostępność danych tabelarycznych-
Należy używać tylko HTML do tabel danych zamiast używać obrazów. Takie podejście będzie bardzo przydatne dla użytkowników korzystających z technologii asystujących w celu uzyskania dostępu do zawartości tabeli. Ponadto spróbuj podać odpowiednie nagłówki kolumn, aby poprawić dostępność treści tabeli. Zaleca się również, aby nie używać formatu tabelarycznego dla układu strony lub struktury strony, ponieważ powoduje to problem z efektywnym dostępem do treści.
Aby tablice danych były bardziej dostępne dla użytkowników, musisz efektywnie oznaczyć komórki nagłówka tabeli. Oprócz tego należy użyć wartości atrybutu scope dla skojarzonego nagłówka kolumny lub nagłówka wiersza tabeli. Jeśli chcesz poprawić dostępność pola "data" w tabeli, musisz zmienić <td> Data </ td> na <th scope = "col"> Data </ th> w części kodującej. aby poinformować użytkowników o swojej tabeli danych, musisz podać odpowiedni opis lub podpis tabeli za pomocą znacznika <caption>.
<Table>
<caption> Harmonogram zajęć </ caption>
<tr> ….
9. Sprawdź dostępność swojej strony za pomocą WAVE-
Narzędzie oceny dostępności sieci (WAVE) to znakomite narzędzie, które może pomóc twórcom stron internetowych w poprawie dostępności ich strony internetowej. To narzędzie oceny witryny zapewnia kluczowe informacje i informacje zwrotne na temat dostępności strony, wprowadzając adres URL swojej strony internetowej na stronie głównej narzędzia Wave. Jeśli masz jakiekolwiek wątpliwości, pytania i wątpliwości dotyczące tego narzędzia oceny witryny, sprawdź ten pomocny link pod adresem https://wave.webaim.org/help. Ponadto, pierwsi użytkownicy, którzy nie są zaznajomieni z tym pionierskim narzędziem dostępu do stron internetowych i oceny, mogą skorzystać z tego linku, aby uzyskać wymaganą wiedzę na temat sprawdzania dostępności swojej strony internetowej. Inne narzędzia oprócz WAVE, które mogą być przewodnikiem dla poprawy dostępności twojej strony to CynthiaSays, Tenon i wiele innych.
10. Pracuj nad udostępnieniem treści do pobrania dla Twoich docelowych klientów
W interesie Twojej witryny może być podjęcie wymaganych kroków w zakresie udostępniania treści do pobrania na swojej stronie, takich jak dokumentacja warunków, podręcznik użytkowania produktu, specyfikacja kategorii produktów lub jakikolwiek inny dokument dostępny dla zainteresowanych użytkowników. Nie zmuszaj ich do wędrowania tu i tam w poszukiwaniu wymaganego oprogramowania do uzyskania dostępu do określonego dokumentu, ale upewnij się, że twoja zawartość do pobrania jest dostępna za pośrednictwem powszechnie dostępnego oprogramowania. Zawsze używaj plików rozdzielanych przecinkami lub tabulatorami, plików PDF i innych formatów, które nie wymagają żadnego licencjonowanego oprogramowania własnego od danego dostawcy. Aby udostępnić swoje treści w formacie PDF, musisz postępować zgodnie z różnymi wytycznymi wymienionymi w tym kluczowym linku, https://webstandards.sonoma-county.org/content.aspx?sid=1014&id=1123.
11. Skorzystaj z usług punktów orientacyjnych ARIA-
Dzięki wprowadzeniu nowej dostępnej aplikacji Rich Internet (ARIA), specyfikacji World Wide Web Consortium (W3C), która jest globalnym organem zarządzającym stronami internetowymi, aplikacje internetowe można teraz łatwo łączyć i udostępniać za pomocą klawiatury. Możesz z łatwością uczynić swoją stronę bardziej przyjazną dla nawigacji za pomocą klawiatury dzięki zastosowaniu ról orientacyjnych ARIA. Wszystko, co musisz zrobić, to po prostu dodać atrybut HTML do dowolnych ważnych ról, np. Rola = "nawigacja", rola = "główna" lub rola = "wyszukiwanie" do kierowania użytkownika do określonej sekcji strony przez jedno naciśnięcie klawisza. Pozwól nam sprawdzić ten kod HTML, który może dodać odpowiedni atrybut roli punktów orientacyjnych w sekcji "główna" i "szukaj" na stronie internetowej.
<div id = "maincontent" role = "main">
<form action = "search.php" role = "search">
12. Naucz się korzystać z usług Learning Management Systems (LMS) i Content Management Systems w celu zwiększenia dostępności twojej strony internetowej-
W celu poprawy dostępności swojej witryny eCommerce, musisz skorzystać z usług skutecznych platform eCommerce, które składają się z wielu funkcji. Oprócz tego możesz korzystać z usług różnych systemów zarządzania treścią, takich jak WordPress, Joomla, Drupal i inne dla zapewnienia łatwego dostępu do wielu tematów, szablonów, Wtyczki eCommerce i inne takie opcje. Wtyczki są postrzegane jako zapewniające zaawansowany poziom dostępności, wydajności i użyteczności strony internetowej w celu poprawy ogólnej wydajności strony internetowej.
Jednak upewnij się, że korzystasz z wiedzy specjalistycznej dotyczącej wyjątkowych projektów wtyczek i usług programistycznych, takich jak Knowband, który ma wieloletnie doświadczenie w tej dziedzinie. Niektóre z doskonałych wtyczek dostarczonych przez niego są następujące:
Magento– Niektóre z niesamowitych Rozszerzenia Magento które są dostarczane przez Knowband to Magento Abandoned Cart, Magento Auto Subscribe, Magento One Page Supercheckout, Magento Google Analytic Enhanced Ecommerce i wiele więcej.
OpenCart– Oto niektóre z nich Rozszerzenia OpenCart?that can help in enhancing the productivity of your OpenCart store to a great extent. They are OpenCart Ajax Cart+, OpenCart One Page Supercheckout Pro, OpenCart Social Loginizer, OpenCart Price Alert and such others.
PrestaShop– Jeśli masz sklep PrestaShop, są to niektóre z PrestaShop Addons?that can be the game changer for your online store and can improve the accessibility and performance of your website. Take a look at these plugins which are PrestaShop Abandoned Cart, PrestaShop Return Manager, PrestaShop One Page Supercheckout and many others.
13. Zwiększ zasięg swojej witryny na różnych urządzeniach mobilnych
Ze względu na ciągły wzrost liczby klientów mobilnych, wyłącznym obowiązkiem każdego podmiotu gospodarczego w Internecie jest udostępnienie swojej strony internetowej różnym dostępnym urządzeniom mobilnym. Skorzystaj z różnych narzędzi, takich jak mobilność, test przyjazny dla urządzeń mobilnych, PageSpeed Insights, test szybkości strony Pingdom i inne narzędzia SEO dla telefonów komórkowych w celu poprawy wydajności witryny mobilnej. Jeśli chcesz dowiedzieć się więcej o tym, jak poprawić wyniki SEO dla komórek, odwiedź ten informacyjny link. Co więcej, korzystanie z usług sieci dostarczania treści (CDN) wraz z formatem obrazu internetowego dla przeglądarki Google Chrome może mieć znaczny wpływ na dostępność Twojej witryny na różnych urządzeniach mobilnych.
14. Użyj odpowiedniego tekstu alternatywnego dla obrazów-
Chociaż jest powiedziane, że "obraz może powiedzieć tysiąc słów", ale te obrazy wymagają obsługi tekstu alternatywnego, aby pomóc użytkownikowi w zrozumieniu właściwego zamiaru lub przesłania tych obrazów. Ponadto, tekst alternatywny staje się o wiele bardziej przydatny podczas używania Obrazy informacyjne, takie jak infografiki Należy zauważyć, że wiadomość, która ma być przekazana za pomocą określonego obrazu, musi być wykorzystana w tekście alt tego obrazu. Podobnie, jeśli dany obraz składa się z jakiegoś tekstu, ten konkretny tekst powinien również być uwzględnione w tekście alternatywnym. Upewnij się, że obrazy używane jako łącza są opatrzone odpowiednim tekstem alternatywnym, aby czytnik ekranu mógł odczytać powiązaną wiadomość z obrazem zamiast czytać nazwę pliku obrazu. Oto przykładowy kod w jaki sposób atrybut alt może być użyty w obrazie, aby poprawić jego atrakcyjność i zrozumienie wśród docelowych klientów.
<img src = "webaimlogo.jpg" alt = "WebAIM – Web Accessibility Mind">
Możesz jednak pozostawić tekst alternatywny pusty dla obrazów, jeśli obraz jest używany wyłącznie
15. Zainicjuj kroki, aby Twoja strona była bardziej dostępna poprzez klawiaturę
Istnieje wielu użytkowników, którzy lubią poruszać się po danej stronie internetowej za pomocą klawiszy skrótu klawiaturowego lub klawiszy dostępu. Te klucze dostępu są elementami HTML, które nie są skutecznie wykorzystywane podczas procesu tworzenia strony internetowej w celu zapewnienia bezproblemowego dostępu do niektórych sekcji witryny za pomocą klawiatury. Aby korzystać z usług kluczy dostępu, musisz wykonać następujące kroki.
– Naciśnij klawisz funkcyjny (Alt w przypadku systemu Windows i Ctrl, jeśli system to komputer Mac), a także konkretny klucz literowy lub numeryczny powiązany z określoną sekcją witryny.
Co więcej, programiści mogą bez wysiłku dodawać funkcje kluczy dostępu do swojej witryny internetowej, dodając prosty kod HTML do znacznika nawigacyjnego w swojej witrynie. Przykładowy kod jest pokazany poniżej.
<a href="index.html" accesskey="1"> Strona główna </a>
Jednak ograniczenie użycia kluczy dostępu na poziomie globalnym polega na tym, że nie istnieje uniwersalny zestaw przypisanych kluczy, które można wykorzystać do implementacji funkcjonalności kluczy dostępu na stronie internetowej. Poza tym nie ma takiego mechanizmu, za pomocą którego użytkownicy mogą być informowani o klawiszach klawiatury, które są używane jako klucze dostępu do nawigacji po witrynie. Ale są pewne kraje, takie jak Wielka Brytania, gdzie zainteresowane władze zaleciły zestaw kluczy dostępu, które można przypisać do płynnej nawigacji po stronie za pomocą klawiatury. Oto lista tych kluczy dostępu.
S – Pomiń nawigację
1 – Strona główna
2 – Aktualności / Aktualizacje
3 – Mapa witryny
4 – Szukaj
5 – Często zadawane pytania (FAQ)
6 – Pomoc
7 – Procedura składania reklamacji
8 – Warunki
9 – Formularz opinii
10 – Informacje o kluczu dostępu
16. Uwzględnij poprawnie nagłówki w celu uporządkowania struktury treści
Aby uzyskać płynny dostęp do treści witryny, skorzystaj ze struktury nagłówków. Użyj znaczników nagłówka HTML, takich jak <h1>, <h2>, <h3> i innych w odpowiednim miejscu w swoich treściach w celu efektywnej organizacji treści i lepszej czytelności. Postępuj zgodnie z prawidłową kolejnością nagłówków i zachowaj prezentację od struktury nagłówków za pomocą CSS. Niektóre z wytycznych, których należy przestrzegać podczas tworzenia nowej klasy CSS dla twoich treści, są następujące.
- Zawsze używaj znacznika <h1> dla głównego tytułu strony. Zachowaj tag nagłówka <h1> zarezerwowany dla tytułu witryny i innych pojedynczych stron.
- Uwzględnij nagłówki dla właściwego wskazania i organizacji struktury treści.
- Postępuj zgodnie z prawidłową kolejnością podczas korzystania z nagłówków i nigdy nie przeskakuj bezpośrednio z nagłówka <h1> do <h3>, ponieważ daje to poczucie, że czytelnikom brakuje niektórych konkretnych treści w środku.
17. Korzystaj z indeksów tabulatorów dla płynnej nawigacji po twojej stronie
W celu określenia właściwej kolejności nawigacji wokół pól formularza za pomocą klawisza tab, ważne jest wykorzystanie indeksów tabulacji. Ta funkcja odgrywa kluczową rolę podczas nawigowania po formularzach na stronie. Jeśli jednak projekt strony jest wyposażony w odpowiednią kolejność logiczną i silną hierarchię ze względu na obecność nagłówków i pod-nagłówków, nie ma się czym martwić o ten indeks kart.
Ponieważ formy składają się z wielu małych elementów, takich jak pola wyboru i przyciski radiowe, które wymagają precyzyjnego pozycjonowania myszy i klikania przez ludzi, wykonanie tego samego byłoby trudne dla osoby z niepełnosprawnością ruchową. W takich sytuacjach życie tych osób może przynieść znaczną ulgę, jeśli w formularzu zostanie przeprowadzone odpowiednie indeksowanie kart, które umożliwi użytkownikowi interakcję z każdym elementem formularza za pomocą prostych pociągnięć za klawiaturę.
Lubiłem to? Spodoba ci się to
- Aplikacje e-commerce, które są koniecznością w tym scenariuszu demonetyzacji
- Rebuild e-commerce – czy to zawsze dobry pomysł?
- Powody, dla których Twoja firma handlu elektronicznego potrzebuje aplikacji mobilnej
- Niektóre kluczowe kwestie do rozważenia przy rozważaniu przejścia na platformę handlu elektronicznego
- Jakie informacje na temat stawek dodatkowych od koszyka ujawniają w Twoim sklepie e-commerce?
