Список «назва — значення» побудовано неправильно

Список описів (<dl>), який часто використовують для характеристик товару чи вибраних опцій, містить елементи не на своєму місці або в неправильному порядку.

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

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

Користувачі програм зчитування з екрана можуть не почути, яке значення належить до якої назви, наприклад яке число означає вагу, а яке розмір, тому характеристики товару важче зрозуміти.

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

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

Як виправити

Усередині <dl> розміщуйте лише групи з <dt> (назва) і <dd> (значення) саме в такому порядку: кожна група починається з одного чи кількох <dt>, за якими йдуть один чи кілька <dd>. Цілу групу можна огорнути в <div>; також дозволені <script> і <template>. Інші елементи перенесіть усередину <dt> або <dd>.

У Shopify

Трапляється рідше; зазвичай у власних секціях характеристик, блоках метаполів або розмітці застосунків. Виправте структуру в секціях чи сніпетах Liquid теми.

У Shoptet (CZ)

Параметри товару виводить шаблон. Повідомте про це Shoptet або партнера Shoptet.

У PrestaShop

Теми часто показують характеристики товару як <dl>; у змінених темах структура може бути порушена. Виправте розмітку у файлах .tpl сторінки товару в темі.

У WooCommerce

WooCommerce показує вибрані опції товару в кошику й деталях замовлення як <dl>; теми чи плагіни, що перевизначають ці шаблони, можуть порушити структуру. Виправте в шаблоні дочірньої теми або повідомте автора плагіна.

Стандарти

Стандарти
Стандарт	Пункт
WCAG 2.2	1.3.1 (A) Info and Relationships
WCAG 2.1	1.3.1 (A) Info and Relationships
WCAG 2.0	1.3.1 (A) Info and Relationships
EN 301 549 4.1.1	9.1.3.1
EN 301 549 3.2.1	9.1.3.1
Section 508 2017	E205.4
ДСТУ EN 301 549 2022	9.1.3.1

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

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