SIGN UP

IDs used in ARIA and labels must be unique CRITICAL · WCAG 2.0 A Ensures every id attribute value used in ARIA and in labels is unique.

By: Jen Niles | Asked: 10/06/2022
Forums › Category: How-to › IDs used in ARIA and labels must be unique CRITICAL · WCAG 2.0 A Ensures every id attribute value used in ARIA and in labels is unique.
0 Vote Up Vote Down
Jen Niles asked 2 years ago
I am still trying to figure out how to resolve this issue, I have search FF docs and google for answers and not coming up with much to get this issue resolved with Formidable Forms, this is crucial to get this corrected. Has anyone able to resolve these issues? I had copied previous field key and added new custom field keys, then tested again, still saying duplicate IDs What are the solution to resolve this issue? This affects all of our forms on all websites with Formidable Forms that are being flagged to resolve with WCAG. Thank you in advance.  
Victor Font replied 2 years ago

There's not enough information to go on here. "still saying duplicate IDs" Where are you seeing this message? Formidable creates unique when it generates the HTML. I've also tested Formidable with screen readers and it works fine.

Jen Niles replied 2 years ago

<p>You can install the Web Accessible Helper Addon in Chrome to test a page and see the issues that arises, I can send you a screenshot as well if needed. This is the Accessible Web Ramp we are using to scan and test for WCAG <a href="https://ramp.accessibleweb.com/</p><p> </p&gt&quot; rel="nofollow">https://ramp.accessibleweb.com/</a></p&gt;

Victor Font replied 2 years ago

I don't use external tools anymore. FireFox has a substantial accessibility tool included with the developer tools.

I don't think a screen print will work. The duplicate ID issue should be flagged by the tool and it should show you exactly which IDs are in conflict. It may not have anything to do with Formidable at all.

2 Answers
0 Vote Up Vote Down
Jen Niles answered 2 years ago
I found this https://formidableforms.com/features/wcag-accessible-forms/
but the forms are not WCAG accessible. More training and/or resolution is needed to resolve pending issues with Formidable Forms.
Victor Font replied 2 years ago

Formidable's forms have passed every WCAG test I've run them through.

0 Vote Up Vote Down
Victor Font answered 2 years ago
Jen, I'm not getting errors on your forms when I use my built-in tools. The forms pass every test. I also viewed your source code and there are no duplicate keys when you search for them. What I do see on your site is a lot of jQuery errors that are probably preventing the tools from executing properly. Your ramp scripts aren't loading because of a configuration problem: The resource from “https://ramp.accessibleweb.com/badge/RI2qhAYutx2jqYYXMLE7mwV_iR-wmtoz9AyTVAQ7qBY/script.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff). Another error: Uncaught (in promise) Error: reCAPTCHA has already been rendered in this element You've also got tons of cookie and referrer errors. The fatal jQuery errors will cause any script to fail and not render proper results. After examining your site both visually and with my tools, I believe the problem is not related to Formidable at all, but due to the many other errors on your site.
Jen Niles replied 2 years ago

This error was due to the API turned off at the third party dashboard although the plugin was activated, I deactivated the plugin for now.

Your ramp scripts aren't loading because of a configuration problem: The resource from “https://ramp.accessibleweb.com/badge/RI2qhAYutx2jqYYXMLE7mwV_iR-wmtoz9AyTVAQ7qBY/script.js”

I am checking the reCaptcha which I believe is an error with the pop up modal (SIgn up for our newsletter that shows up on the far right button)

Jen Niles replied 2 years ago

I noticed this error on the homepage with reCaptcha was resolved when I unticked the option in reCaptcha / Formidable Forms - Allow multiple reCAPTCHAs to be used on a single page. ( I was trying to display multiple forms in the menu navigation as pop up modal block but recreated those to be direct URL to a page buttons instead).

The other error related to RAMP Accessible was corrected due to deactivating the plugin since I turned off the api at the dashboard of Accessible Ramp for now (testing).

https://snipboard.io/dKaOEP.jpg

Then I tested the web accessible tool again, the same duplicate Aria IDs appeared even though I hid the block with the pop up modal form that consist of the formidable form. I created another button to direct users to a page with the Sign up for newsletter instead and removed the pop up modal block from the home page (the right side bar of News). Now I do not have those duplicate ARIA IDs, something is conflicting with the pop up modal block with Formidable Forms I think.

Now there is a different issue with Formidable Forms icon in the field, see screenshot.
https://snipboard.io/Xf5HZp.jpg
Something you need to revised on Formidable Form end? Please let me know. Thanks for your help so far. Much appreciated.

Making the Best WordPress Plugin even better - Together

Take on bigger projects with confidence knowing you have access to an entire community of Formidable Experts and Professionals who have your back when the going gets tough. You got this!
Join the community
crossarrow-right