esc_html__( 'Improper Use of Link', 'accessibility-checker' ), 'info_url' => 'https://a11ychecker.com/help6473', 'slug' => 'link_improper', 'rule_type' => 'error', 'summary' => sprintf( // translators: %1$s is href, %2$s is #, %3$s is role="button". esc_html__( 'This element is an anchor tag missing a valid %1$s attribute or is linked to %2$s without having %3$s.', 'accessibility-checker' ), 'href', '#', 'role="button"' ), 'summary_plural' => sprintf( // translators: %1$s is href, %2$s is #, %3$s is role="button". esc_html__( 'These elements are anchor tags missing valid %1$s attributes or are linked to %2$s without having %3$s.', 'accessibility-checker' ), 'href', '#', 'role="button"' ), 'why_it_matters' => esc_html__( 'Anchor tags (a.k.a. links) are intended for navigation to a new page or a different place on the same page. When they are used to trigger actions (such as expanding accordions or opening modals) without the correct roles or behavior, they confuse users, particularly those using screen readers or keyboards, who expect links to navigate rather than perform actions. They also are likely not to function with the space bar, which is an expectation of a button.', 'accessibility-checker' ), 'how_to_fix' => sprintf( // translators: %1$s is <button>, %2$s is role="button", %3$s is role="none", %4$s is role="presentation". esc_html__( 'If the element is used to trigger an action, replace the anchor tag with a %1$s. If you cannot replace it, ensure that %2$s is added to the link, along with JavaScript that adds support for triggering it with the space bar key, and that appropriate ARIA attributes are used for toggle states or other functionality. If the anchor is purely decorative, cannot be focused and has no ARIA states or properties, %3$s or %4$s marks it as presentational so it is not reported.', 'accessibility-checker' ), '<button>', 'role="button"', 'role="none"', 'role="presentation"' ), 'references' => [ [ 'text' => __( 'MDN Web Docs: ARIA button role', 'accessibility-checker' ), 'url' => 'https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/button_role', ], [ 'text' => __( 'W3 Schools: Accessibility Buttons & Links', 'accessibility-checker' ), 'url' => 'https://www.w3schools.com/accessibility/accessibility_buttons_links.php', ], ], 'wcag' => '4.1.2', 'severity' => 2, // High. 'affected_disabilities' => [ AffectedDisabilities::BLIND, AffectedDisabilities::LOW_VISION, AffectedDisabilities::DEAFBLIND, AffectedDisabilities::MOBILITY, ], 'ruleset' => 'js', ]; } }