WCAG A/AA requirement Priority: Moderate
Some tooltips are empty
Some elements marked as tooltips (role="tooltip") have no readable text.
This text was translated automatically and has not been reviewed by a native speaker yet.
Why it matters to your customers
Screen reader users get no hint where sighted shoppers see one, for example an explanation of sizes, delivery costs, a VAT note or a password rule.
Who is affected
- blind customers
- screen reader users
How to fix it
Make sure every element with role="tooltip" contains text, or has aria-label or aria-labelledby. Connect the tooltip to the element it explains with aria-describedby. If the text is loaded only on hover, put it in the page from the start and just show it on hover and keyboard focus.
On Shopify
Usually theme tooltips or app widgets (size guides, delivery info). Fix the markup in the theme's Liquid snippets or ask the app developer.
On Shoptet (CZ)
Rare in standard templates; more likely in custom code or add-ons. Ask Shoptet or a partner to check.
On PrestaShop
Usually in theme templates or modules that show info icons. Fix the tooltip markup in the .tpl files or overridden module templates.
On WooCommerce
Usually in tooltip, product-option or page-builder plugins. Check the plugin settings; otherwise fix it in a child theme or report it to the plugin author.
Standards
| Standard | Clause |
|---|---|
| WCAG 2.2 | 4.1.2 (A) Name, Role, Value |
| WCAG 2.1 | 4.1.2 (A) Name, Role, Value |
| WCAG 2.0 | 4.1.2 (A) Name, Role, Value |
| EN 301 549 4.1.1 | 9.4.1.2 |
| EN 301 549 3.2.1 | 9.4.1.2 |
| Section 508 2017 | E205.4 |
| ДСТУ EN 301 549 2022 | 9.4.1.2 |
Automated check: axe-core rule aria-tooltip-name.
dequeuniversity.com, github.com, www.w3.org
Related checks
-
A clickable image only works with a mouse
WCAG 2.1.1 A
-
A label-and-value list is built incorrectly
WCAG 1.3.1 A
-
Some form buttons have no name
WCAG 4.1.2 A
-
Images have no text description
WCAG 1.1.1 A