Przejdź do treści
Pandus

WCAG AAA: zalecenie Priorytet: Drobne

Linki o tym samym tekście prowadzą w różne miejsca

Kilka linków na stronie ma ten sam tekst, na przykład „Czytaj więcej” lub „Kup teraz”, ale prowadzi do różnych stron. To zalecenie poziomu AAA WCAG, wykraczające poza poziom AA, na którym opiera się prawo.

Ten tekst przetłumaczono automatycznie i nie został jeszcze sprawdzony przez native speakera.

Dlaczego to ważne dla Twoich klientów

Użytkownicy czytników ekranu często przeglądają listę wszystkich linków na stronie. Lista identycznych „Czytaj więcej” nic im nie mówi, więc muszą otwierać każdy link, aby znaleźć szukany produkt lub artykuł. To spowalnia, ale rzadko uniemożliwia zakup.

Kogo to dotyczy

  • użytkownicy czytników ekranu
  • osoby z niepełnosprawnościami poznawczymi
  • użytkownicy sterowania głosowego

Jak to naprawić

Nadaj każdemu linkowi tekst opisujący, dokąd prowadzi, na przykład „Więcej o dostawie” zamiast „Czytaj więcej”. Jeśli widoczny tekst musi być krótki, dodaj szczegóły ukrytym wizualnie tekstem lub atrybutem aria-label zaczynającym się od widocznych słów. Linki, które naprawdę prowadzą do tej samej strony, jak zdjęcie produktu i jego nazwa, mogą mieć tę samą nazwę.

W Shopify

Zwykle pochodzi z przycisków „Czytaj więcej” lub „Kup teraz” w sekcjach bloga, kolekcji lub banerów. Zmień etykiety przycisków osobno dla każdej sekcji w edytorze motywu albo dodaj tytuł artykułu lub produktu do linku w kodzie Liquid sekcji.

W Shoptet (CZ)

Zwykle pochodzi z banerów lub list artykułów z tym samym tekstem przycisku. Zmień teksty tam, gdzie pozwalają na to ustawienia szablonu; w innym przypadku dodaj szczegóły własnym kodem lub zapytaj Shoptet albo partnera.

W PrestaShop

Zwykle pochodzi z linków „Szybki podgląd”, „Więcej” lub „Czytaj więcej” na listach produktów i w modułach bloga. Zmień tekst linku lub dodaj nazwę produktu jako ukryty tekst w szablonach .tpl motywu.

W WooCommerce

Zwykle pochodzi z linków „Czytaj więcej” na listach wpisów lub przycisków w siatkach produktów. WooCommerce zwykle dodaje nazwę produktu do własnych przycisków koszyka, ale przyciski motywu lub page buildera mogą tego nie robić. Zmień etykiety w builderze lub w szablonie motywu potomnego.

Normy

Normy
NormaPunkt
WCAG 2.2 2.4.9 (AAA) Link Purpose (Link Only)
WCAG 2.1 2.4.9 (AAA) Link Purpose (Link Only)
WCAG 2.0 2.4.9 (AAA) Link Purpose (Link Only)

Automatyczny test: reguła axe-core identical-links-same-purpose. dequeuniversity.com, github.com, www.w3.org

Wszystkie reguły, które sprawdzamy