Cookie banner is not keyboard accessible

  • The consent options in the cookie banner use <div> elements instead of <button> and <a> elements, as they appear to be. This makes them inaccessible via keyboard navigation or similar assistive technologies.

    Furthermore, the dialog/banner, regardless if “Block content until consent” is enabled or disabled, is not the first focusable element forcing one to navigate through the entire page to reach it.

    Tested on Real Cookie Banner v3.7.2.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Contributor Matthias Günter

    (@mguenter)

    Hey @mcaskill !

    Unfortunately, the plugin is not yet fully compatible with WCAG 2.1. We have this already on our backlog and we will let you know as soon as we have implemented this (~ end of Q3 2023).

    Thread Starter Chauncey McAskill

    (@mcaskill)

    Thanks for the rapid response.

    Full compliance with WCAG 2.1 will be appreciated.

    Until then, could there be an intermediate step forward by replacing the button and link shaped <div> elements with <button type="button"> elements?

    Similarly, can the banner be injected after the opening <body> tag instead of the before the closing </body> tag?

    Take care,

    Plugin Contributor Matthias Günter

    (@mguenter)

    Until then, could there be an intermediate step forward by replacing the button and link shaped <div> elements with <button type="button"> elements?

    Unfortunately, this cannot be customized at the moment as we render the cookie banner not with a “templating” system, rather with a virtual DOM (React).

    Similarly, can the banner be injected after the opening?<body>?tag instead of the before the closing?</body>?tag?

    The cookie banner is currently injected via https://developer.www.ads-software.com/reference/hooks/wp_footer/. We could potentially use https://developer.www.ads-software.com/reference/functions/wp_body_open/, but it is not yet adopted by all themes.

    Plugin Contributor Matthias Günter

    (@mguenter)

    Hi again

    You asked about the accessibility of Real Cookie Banner. I can inform you that as of version 3.11.0 released today, the cookie banner on your website is accessible. Please install the update in your WordPress!

    For more information on what you should consider regarding accessibility in your cookie banner, we have explained it in https://devowl.io/knowledge-base/accessibility-of-real-cookie-banner/.

    The topic of accessibility has kept our team busy for over three months now, as it is more complex than one might think. In the process, we have technically implemented both the European Accessibility Act and national requirements of various legislators in the EU according to the WCAG 2.2 standard level AA. In addition to the frequently required keyboard navigation (usability), this includes other aspects such as color contrast, buttons and font sizes (perceptibility), clear and simple language (comprehensibility) and compliance with technical standards for e.g. screen readers (robustness). Only by meeting all aspects is the cookie banner truly accessible to a wide range of people with disabilities.

    See also: https://www.linkedin.com/feed/update/urn:li:activity:7101874273761255424/

    If you notice something that you think is not accessible, feel free to reply to this thread! We are happy if all people can use the cookie banner without any problems.

    Thread Starter Chauncey McAskill

    (@mcaskill)

    Thank you.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Cookie banner is not keyboard accessible’ is closed to new replies.