CACSP for people with disabilities (a11y)

  • The Cookies and Content Security Policy plugin is a great example of cookie implementation for WordPress CMS, with great potential for expansion ??. We have implemented the plugin on several of our websites, and during the last implementation, we found one small thing missing – adapting the front-end view for users with disabilities. So, we implemented our own solutions to ensure that users with disabilities can also use it!

    What did we do?

    • We implemented a barrier preventing browsing the site without prior acceptance of cookies – the module code should be implemented first in the DOM structure and should not allow tab navigation to other DOM elements on the page.
    • We redesigned the form so that screen reader programs could correctly read everything in the module.
    • We added module support so that all options could be set using the keyboard.

    We thought we would share our vision of this plugin with you and encourage you to take a closer look at the accessibility possibilities!

    We implemented all these things for a specific project, so review the project and see the differences in the code ??

    Versions:
    Cookies and Content Security Policy: 2.17
    WordPress: 6.4.3
    PHP: 7.4.33
    Screen reader: NVDA

    Link to the plugin implementation with a11y:
    https://drive.google.com/file/d/1CU0rEzHb1_xY7Q8M1nwGGrtP1aJrmjCK/view?usp=drive_link

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Johan Jonk Stenstr?m

    (@jonkastonka)

    Thank you! I will take a look at in for the next release.

    Plugin Author Johan Jonk Stenstr?m

    (@jonkastonka)

    Am I correct that what you’ve done is added aria-label and changed the modal so that it works to navigate by tab?

    Thread Starter ycdevs

    (@ycdevs)

    We have restructured the forms to make them accessible for people with disabilities:

    • we added a different structure in the modal (the label element contains an input element and a description)
    • we managed toggle buttons using the input element -> we blocked the ability to navigate through the site using the tab key until cookies are accepted
    • we introduced “aria” elements
    • we added focus upon transitioning to the cookie selection options (Statistics, Experience, Marketing)
    • and many more… (i don’t remember all changes) ??

    I think you should thoroughly review the changes implemented in the code via file comparison; it will give you a broader overview ??

    You can see the plugin with the applied WCAG improvements on the website: https://galeriakatowicka.eu/

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘CACSP for people with disabilities (a11y)’ is closed to new replies.