Посилання з однаковим текстом ведуть у різні місця

Кілька посилань на сторінці мають однаковий текст, наприклад «Детальніше» або «Купити зараз», але ведуть на різні сторінки. Це рекомендація рівня AAA стандарту WCAG, вища за рівень AA, на який спирається закон.

Цей текст перекладено автоматично, носій мови його ще не вичитав.

Чому це важливо для ваших покупців

Користувачі програм зчитування екрана часто переглядають список усіх посилань сторінки. Список однакових «Детальніше» нічого їм не каже, тож доводиться відкривати кожне, щоб знайти потрібний товар чи статтю. Це сповільнює, але рідко зриває покупку.

Кого це стосується

користувачі програм зчитування екрана
люди з когнітивними порушеннями
користувачі голосового керування

Як виправити

Дайте кожному посиланню текст, який описує, куди воно веде, наприклад «Детальніше про доставку» замість «Детальніше». Якщо видимий текст має лишатися коротким, додайте подробиці прихованим текстом або aria-label, що починається з видимих слів. Посилання, які справді ведуть на ту саму сторінку, як-от фото товару і його назва, можуть мати однакову назву.

У Shopify

Зазвичай це кнопки «Детальніше» або «Купити» в секціях блогу, колекцій чи банерів. Змініть підписи кнопок окремо для кожної секції в редакторі теми або додайте назву статті чи товару до посилання в коді Liquid секції.

У Shoptet (CZ)

Зазвичай це банери або списки статей з однаковим текстом кнопок. Змініть тексти там, де це дозволяють налаштування шаблону; інакше додайте подробиці через власний код або зверніться до Shoptet чи партнера.

У PrestaShop

Зазвичай це посилання «Швидкий перегляд», «Більше» або «Детальніше» у списках товарів і модулях блогу. Змініть текст посилання або додайте назву товару прихованим текстом у шаблонах .tpl теми.

У WooCommerce

Зазвичай це посилання «Детальніше» у списках блогу або кнопки в сітках товарів. WooCommerce зазвичай додає назву товару до власних кнопок кошика, але кнопки теми чи конструктора сторінок можуть цього не робити. Змініть підписи в конструкторі або в шаблоні дочірньої теми.

Стандарти

Стандарти
Стандарт	Пункт
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)

Автоматична перевірка: правило axe-core identical-links-same-purpose. dequeuniversity.com, github.com, www.w3.org

Усі правила, які ми перевіряємо